一個面試題小總結

在羣裏看到一個聽說是阿里校招的面試題的圖片,不得不感慨阿里的面試問的內容之廣,前端,算法,數據結構,數學知識,網絡,服務器等都有包含到。大量的題目都是本身的知識盲區或者答不全,因此花了兩個星期對除了後端語言和mySql的題都作了一遍,收穫很多,記錄於此。javascript

1.列舉幾個css中可繼承和不可繼承的元素

參考 www.jianshu.com/p/fbfc6c751…php

css樣式表繼承指的是,特定的css屬性向下傳遞到後代元素css

可繼承的屬性:

1.字體系列屬性:font, font-family, font-weight, font-size, font-style, font-variant, font-stretch, font-size-adjust...html

2.文本系列屬性:text-indent, text-align, line-height, word-spacing, letter-spacing, direction, color...前端

3.元素可見性:visibilityvue

4.表格佈局屬性:caption-side、border-collapse、border-spacing、empty-cells、table-layout...java

5.列表屬性:list-style-type、list-style-image、list-style-position、list-style...node

6.生成內容屬性:quotescss3

7.光標屬性:cursorweb

能夠繼承到全部元素的屬性:

元素可見性, 光標屬性

能夠繼承到內聯元素的屬性:

字體系列屬性, 除text-indent、text-align以外的文本系列屬性

能夠繼承到塊級元素的屬性:

一、text-indent、text-align

不可繼承的屬性:

一、display

二、文本屬性:vertical-align,text-decoration,text-shadow,white-space,unicode-bidi

三、盒子模型的屬性:寬度、高度、內外邊距、邊框等

四、背景屬性:背景圖片、顏色、位置等

五、定位屬性:浮動、清除浮動、定位position等

六、生成內容屬性:content、counter-reset、counter-increment

七、輪廓樣式屬性:outline-style、outline-width、outline-color、outline

八、頁面樣式屬性:size、page-break-before、page-break-after

2.用CSS選中列表的第二項

  • 使用nth-child() 選擇器:
li:nth-child(2)
{
  ...
}
複製代碼

3.僞類和僞元素的區別

  • 僞類存在的意義是爲了經過選擇器找到那些不存在與DOM樹中的信息以及不能被常規CSS選擇器獲取到的信息。例如: :focus, :hover
  • 僞元素在DOM樹中建立了一些抽象元素,這些抽象元素是不存在於文檔語言裏的(能夠理解爲html源碼)。
  • 總結: 僞元素是建立了一個抽象的有內容的虛擬容器, 僞類則是找到那些常規選擇器找不到的元素
  • 能夠同時使用多個僞類,而只能同時使用一個僞元素;

4.H5中的字體大小自適應

  • css3屬性單位: vw(按寬度的百分比), vh(按高度的百分比)

5.介紹rpx, rem, vx

  • rpx 是微信小程序解決自適應屏幕尺寸的尺寸單位。微信小程序規定屏幕的寬度爲750rpx。
  • rem是CSS3新增的相對長度單位,是指相對於根元素html的font-size計算值的大小。
  • vx是窗口寬度的百分比。

6.什麼狀況下css會使用GPU加速

css硬件加速觸發緣由:

不少瀏覽器提供了某些觸發的CSS規則。

如今,像Chrome, FireFox, Safari, IE9+和最新版本的Opera都支持GPU加速,當它們檢測到頁面中某個DOM元素應用了某些CSS規則時就會開啓,最顯著的特徵的元素的3D變換。

們可能不想對元素應用3D變換,可咱們同樣能夠開啓3D引擎。例如咱們能夠用transform: translateZ(0); 來開啓硬件加速

咱們能夠加入如下代碼來觸發硬件加速:

.cube {
   -webkit-transform: translate3d(0, 0, 0);
   -moz-transform: translate3d(0, 0, 0);
   -ms-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
  /* Other transform properties here */
}
複製代碼

7. css filter是什麼

filter 屬性定義了元素(一般是)的可視效果(例如:模糊與飽和度)。 簡單來講就是濾鏡。filter函數對應了不一樣的濾鏡

filter: none | blur() | brightness() | contrast() | drop-shadow() | grayscale() | hue-rotate() | invert() | opacity() | saturate() | sepia() | url();
複製代碼

全部濾鏡的展現效果: www.runoob.com/try/try.php…

8. 網頁如何自適應寬度

  • 在網頁代碼的頭部,加入一行viewport元標籤,網頁初始大小佔屏幕面積的100%。
<meta name="viewport" content="width=device-width,initial-scale=1" />
複製代碼
  • 網頁中的元素都用相對寬度: %,rem,vx,
  • 有網格類的佈局時用float來讓它超出寬度自動換行

詳解meta的做用

1、meta標籤的定義和做用:

meta標籤是head部的一個輔助性標籤,提供關於 HTML 文檔的元數據。它並不會顯示在頁面上,但對於機器是可讀的。可用於瀏覽器(如何顯示內容或從新加載頁面),搜索引擎(SEO),或其餘 web 服務。

meta標籤裏的數據是供機器解讀的,其主要做用有:搜索引擎優化(SEO),定義頁面使用語言,自動刷新並指向新的頁面,實現網頁轉換時的動態效果,控制頁面緩衝,網頁定級評價,控制網頁顯示的窗口等等。

meta的可選屬性

http-equiv屬性

  • charset

說明:用以說明網頁製做所使用的文字以及語言

  • expires

說明:設置網頁的過時時間,一旦過時則必須到服務器上從新獲取。須要注意的是必須使用GMT時間格式

  • refres

說明:定時讓網頁在指定的時間n內,跳轉到頁面

  • set-cookie

Cookie設定,若是網頁過時,存盤的cookie將被刪除。須要注意的也是必須使用GMT時間格式;

  • pragma

說明:用於設定禁止瀏覽器從本地計算機的緩存中訪問頁面內容

  • windows-target

說明:用於設定強制頁面在窗口中以獨立頁面顯示,防止本身的網頁被別人看成一個frame頁調用

  • page-enter,page-exit

說明:用於設定頁面進入和離開時的過渡效果,注意被添加的頁面不能在一個frame中

name屬性

  • keywords

說明:keywords用來告訴搜索引擎你網頁的關鍵字是什麼。

  • description

說明:description用來告訴搜索引擎你的網站主要內容。

  • robots

說明:robots用來告訴搜索機器人哪些頁面須要索引,哪些頁面不須要索引

  • copyright

說明:generator用於說明網站版權信息

  • viewport

說明:viewport用於說明移動端網站的寬高縮放比例等信息

property="og"

og是一種新的HTTP頭部標記,即Open Graph Protocol,這種協議可讓網頁成爲一個「富媒體對象"。用了property=og標籤,就是你贊成了網頁內容能夠被其餘社會化網站引用等,目前這種協議被SNS網站如Fackbook、renren採用

常見用法

<!-- 設定字符集 -->
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 
<!-- 頁面關鍵詞 keywords -->
<meta name="keywords" content="your keywords">
 
<!-- 頁面描述內容 description -->
<meta name="description" content="your description">
 
<!-- 定義網頁做者 author -->
<meta name="author" content="author,email address">
 
<!-- 定義網頁搜索引擎索引方式,robotterms 是一組使用英文逗號「,」分割的值,一般有以下幾種取值:none,noindex,nofollow,all,index和follow。 -->
<meta name="robots" content="index,follow">
 
<!-- 優先使用最新的chrome版本 -->
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
 
<!-- 禁止自動翻譯 -->
<meta name="google" value="notranslate">
 
<!-- 禁止轉碼 -->
<meta http-equiv="Cache-Control" content="no-transform">
 
<!-- 選擇使用的瀏覽器解析內核 -->
<meta name="renderer" content="webkit|ie-comp|ie-stand">
 
<!-- 移動端 -->
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="format-detection"content="telephone=no, email=no" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" /><!-- 刪除蘋果默認的工具欄和菜單欄 -->
<meta name="apple-mobile-web-app-status-bar-style" content="black" /><!-- 設置蘋果工具欄顏色 -->
<meta name="format-detection" content="telphone=no, email=no" /><!-- 忽略頁面中的數字識別爲電話,忽略email識別 -->
<!-- 啓用360瀏覽器的極速模式(webkit) -->
<meta name="renderer" content="webkit">
<!-- 避免IE使用兼容模式 -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- 針對手持設備優化,主要是針對一些老的不識別viewport的瀏覽器,好比黑莓 -->
<meta name="HandheldFriendly" content="true">
<!-- 微軟的老式瀏覽器 -->
<meta name="MobileOptimized" content="320">
<!-- uc強制豎屏 -->
<meta name="screen-orientation" content="portrait">
<!-- QQ強制豎屏 -->
<meta name="x5-orientation" content="portrait">
<!-- UC強制全屏 -->
<meta name="full-screen" content="yes">
<!-- QQ強制全屏 -->
<meta name="x5-fullscreen" content="true">
<!-- UC應用模式 -->
<meta name="browsermode" content="application">
<!-- QQ應用模式 -->
<meta name="x5-page-mode" content="app">
<!-- windows phone 點擊無高光 -->
<meta name="msapplication-tap-highlight" content="no">
複製代碼

10.position默認值和全部可能值

  • static

默認值。沒有定位,元素出如今正常的流中

  • absolute

生成絕對定位的元素,相對於 static 定位之外的第一個父元素進行定位。

  • fixed

生成絕對定位的元素,相對於瀏覽器窗口進行定位

  • relative

生成相對定位的元素,相對於其正常位置進行定位。 所以,"left:20" 會向元素的 LEFT 位置添加 20 像素。

  • inherit

規定應該從父元素繼承 position 屬性的值

11.什麼是sass和less

兩個對css進行擴展的預處理語言

12.css動畫的最小間隔

最小間隔爲顯示器每一幀的時間

13.什麼是shadow DOM

Shadow DOM是HTML的一個規範 ,它容許瀏覽器開發者封裝本身的HTML標籤、CSS樣式和特定的javascript代碼,同時也可讓開發人員建立相似video這樣的自定義一級標籤,建立這些新標籤內容和相關的的API被稱爲Web Component。

14.svg和canvas的概念和區別

SVG:

SVG 是一種使用 XML 描述 2D 圖形的語言。

SVG 基於 XML,這意味着 SVG DOM 中的每一個元素都是可用的。您能夠爲某個元素附加 JavaScript 事件處理器。

在 SVG 中,每一個被繪製的圖形均被視爲對象。若是 SVG 對象的屬性發生變化,那麼瀏覽器可以自動重現圖形

Canvas:

Canvas 經過 JavaScript 來繪製 2D 圖形。

Canvas 是逐像素進行渲染的。

在 canvas 中,一旦圖形被繪製完成,它就不會繼續獲得瀏覽器的關注。若是其位置發生變化,那麼整個場景也須要從新繪製,包括任何或許已被圖形覆蓋的對象。

15.canvas圖層怎麼用

  • canvas的context上有globalAlpha屬性能夠調節透明度,默認爲0
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');

context.fillStyle = 'rgba(280,187,188,1)';
context.fillRect(10,10,100,100);

context.globalAlpha = 0.5;//透明度爲0.5
複製代碼
  • globalCompositionOperation 參數設置圖層之間的圖形結合方式
context.fillStyle = 'rgba(280,187,188,1)';
context.fillRect(150,150,100,100);

context.globalCompositeOperation = 'source-in';//重疊部分可見,其餘透明。
複製代碼

source-over(默認):後繪製圖層位於前圖層上方。

source-in:圖層重疊部分可見,其餘透明。

source-out:圖層不重疊部分可見,先繪製層透明。

source-atop:圖層重疊部分可見,先繪製不受影響。

destination-over:後繪製圖層位於前圖層下方。

destination-in:後繪製圖層位於前圖層下方,不重疊部分透明。

destination-out:後繪製圖形擦除與先繪製圖形重疊部分。

destination-atop:後繪製圖層位於下方,不重疊部分,先繪製層透明。

16.dom渲染的性能損耗在哪裏

dom渲染的性能損耗主要在dom的改變引發了dom樹的重排和重繪;

重繪:是一個元素外觀的改變所觸發的瀏覽器行爲,例如改變visibility、outline、背景色等屬性(上面說到的其餘屬性)。瀏覽器會根據元素的新屬性從新繪製,使元素呈現新的外觀。重繪不會帶來從新佈局,並不必定伴隨重排。

重排:當DOM的變化影響了元素的幾何屬性(寬或高),瀏覽器須要從新計算元素的幾何屬性,一樣其餘元素的幾何屬性和位置也會所以受到影響。瀏覽器會使渲染樹中受到影響的部分失效,並從新構造渲染樹。這個過程稱爲重排。重排必定伴隨着重繪。(重排次數多可能會致使瀏覽器垮掉而頁面閃爍)

優化方法:

  1. 儘可能不要在佈局信息改變時作查詢(會致使渲染隊列強制刷新)
  2. 同一個DOM的多個屬性改變能夠寫在一塊兒(減小DOM訪問,同時把強制渲染隊列刷新的風險降爲0)
  3. 若是要批量添加DOM,能夠先讓元素脫離文檔流,操做完後再帶入文檔流,這樣只會觸發一次重排(fragment元素的應用)
  4. 將須要屢次重排的元素,position屬性設爲absolute或fixed,這樣此元素就脫離了文檔流,它的變化不會影響到其餘元素。例若有動畫效果的元素就最好設置爲絕對定位。

17.如何高效地從一千個div中刪除10個div

爲了減小重排重繪,能夠先讓元素脫離文檔流,操做完後再帶入文檔流,這樣只會觸發一次重排。 具體方法:

  1. 隱藏元素,具體修改,而後再顯示它
  2. 將原始元素拷貝到一個脫離文檔的節點中,修改副本,而後覆蓋元素

18. 如何監聽img加載完成

給img添加onload事件

若是是監聽大量的圖片加載完成,則在父元素上添加load事件捕獲

19.瀏覽器裏除了js還能運行什麼

  • webAssembly

經過WebAssembly 能夠在瀏覽器中擴展C/C++/Rust語言。 預計會推出的語言有Go,Java和C#

  • actionScript

一個被淘汰的瀏覽器語言

20.promise的三種狀態

pending、fulfilled、rejected(未決定,履行,拒絕)

  1. 初始化,狀態:pending

  2. 當調用resolve(成功),狀態:pengding=>fulfilled

  3. 當調用reject(失敗),狀態:pending=>rejected

21.promise如何捕獲錯誤

  • reject 做爲失敗的回調
  • then後的catch做爲異常的捕獲

22.promise能夠串聯嗎?

能夠,promise能夠鏈式調用,源碼的then方法返回的是promise對象自己,因此能夠實現鏈式調用。

23.vue均可以解決什麼問題

  • VUE經過關注視圖層,用數據操做的方式來替代了dom操做
  • vue經過響應式的數據綁定實現了更好的數據和視圖的操做
  • vue經過組件化開發讓工程結構更加明確,更易於維護
  • vue經過虛擬dom,優化了dom操做,實現了性能提升
  • vue擁有本身的vue-cli腳手架工具,具備良好的工程化性能

24.虛擬dom如何進行diff操做

虛擬dom

虛擬dom就是用js的對象模擬dom中的節點,使用虛擬dom能夠減小頁面元素的修改次數,減小頁面的重排重繪,提升性能。

實現步驟:

  1. 用JavaScript對象模擬DOM
  2. 把此虛擬DOM轉成真實DOM並插入頁面中
  3. 若是有事件發生修改了虛擬DOM
  4. 比較兩棵虛擬DOM樹的差別,獲得差別對象
  5. 把差別對象應用到真正的DOM樹上

代碼實現

  • 定義虛擬dom對象:
class crtateElement {
    constructor (el, attr, child) {
        this.el = el
        this.attrs = attr
        this.child = child || []
    }
    render () { 
        let virtualDOM =  document.createElement(this.el)
        // attr是個對象因此要遍歷渲染
        for (var attr in this.attrs) {
            virtualDOM.setAttribute(attr, this.attrs[attr])
        }

        // 深度遍歷child
        this.child.forEach(el => {
            //若是子節點是一個元素的話,就調用它的render方法建立子節點的真實DOM,若是是一個字符串的話,建立一個文件節點就能夠了
            // 判斷一個對象是不是某個對象的實力
            let childElement = (el instanceof crtateElement) ? el.render() : document.createTextNode(el);
            virtualDOM.appendChild(childElement);
        });
        return virtualDOM
    }
}

let ul = new crtateElement('div',myobj,[
    '我是文字',
    element('div',{'id': 'xiao'},['1']),
    element('div',{'id': 'xiao1'},['2']),
    element('div',{'id': 'xiao2'},['3']),
])

複製代碼
  • 比較兩顆dom樹的差別,diff算法,diff算法的比較方式爲同級比較,不會跨越層級
  • 比較的結果可能有四種:
  1. 節點被移除
  2. 節點屬性被改變
  3. 文本內容被改變
  4. 節點被整個替換
let utils = require('./utils');

let keyIndex = 0;
function diff(oldTree, newTree) {
    //記錄差別的空對象。key就是老節點在原來虛擬DOM樹中的序號,值就是一個差別對象數組
    let patches = {};
    keyIndex = 0;  // 兒子要起另一個標識
    let index = 0; // 父親的表示 1 兒子的標識就是1.1 1.2
    walk(oldTree, newTree, index, patches);
    return patches;
}
//遍歷
function walk(oldNode, newNode, index, patches) {
    let currentPatches = [];//這個數組裏記錄了全部的oldNode的變化
    if (!newNode) {//若是新節點沒有了,則認爲此節點被刪除了
        currentPatches.push({ type: utils.REMOVE, index });
        //若是說老節點的新的節點都是文本節點的話
    } else if (utils.isString(oldNode) && utils.isString(newNode)) {
        //若是新的字符符值和舊的不同
        if (oldNode != newNode) {
            ///文本改變 
            currentPatches.push({ type: utils.TEXT, content: newNode });
        }
    } else if (oldNode.tagName == newNode.tagName) {
        //比較新舊元素的屬性對象
        let attrsPatch = diffAttr(oldNode.attrs, newNode.attrs);
        //若是新舊元素有差別 的屬性的話
        if (Object.keys(attrsPatch).length > 0) {
            //添加到差別數組中去
            currentPatches.push({ type: utils.ATTRS, attrs: attrsPatch });
        }
        //本身比完後再比本身的兒子們
        diffChildren(oldNode.children, newNode.children, index, patches, currentPatches);
    } else {
        currentPatches.push({ type: utils.REPLACE, node: newNode });
    }
    if (currentPatches.length > 0) {
      patches[index] = currentPatches;
    }
}
//老的節點的兒子們 新節點的兒子們 父節點的序號 完整補丁對象 當前舊節點的補丁對象
function diffChildren(oldChildren, newChildren, index, patches, currentPatches) {
    oldChildren.forEach((child, idx) => {
        walk(child, newChildren[idx], ++keyIndex, patches);
    });
}
function diffAttr(oldAttrs, newAttrs) {
    let attrsPatch = {};
    for (let attr in oldAttrs) {
        //若是說老的屬性和新屬性不同。一種是值改變 ,一種是屬性被刪除 了
        if (oldAttrs[attr] != newAttrs[attr]) {
            attrsPatch[attr] = newAttrs[attr];
        }
    }
    for (let attr in newAttrs) {
        if (!oldAttrs.hasOwnProperty(attr)) {
            attrsPatch[attr] = newAttrs[attr];
        }
    }
    return attrsPatch;
}
module.exports = diff;

複製代碼
  • 獲取到了補丁,就要把補丁打到相應的dom上,代碼以下
let keyIndex = 0;
let utils = require('./utils');
let allPatches;//這裏就是完整的補丁包
function patch(root, patches) {
    allPatches = patches;
    walk(root);
}
function walk(node) {
    let currentPatches = allPatches[keyIndex++];
    (node.childNodes || []).forEach(child => walk(child));
    if (currentPatches) {
        doPatch(node, currentPatches);
    }
}
function doPatch(node, currentPatches) {
    currentPatches.forEach(patch => {
        switch (patch.type) {
            case utils.ATTRS:
                for (let attr in patch.attrs) {
                    let value = patch.attrs[attr];
                    if (value) {
                        utils.setAttr(node, attr, value);
                    } else {
                        node.removeAttribute(attr);
                    }
                }
                break;
            case utils.TEXT:
                node.textContent = patch.content;
                break;
            case utils.REPLACE:
                let newNode = (patch.node instanceof Element) ? path.node.render() : document.createTextNode(path.node);
                node.parentNode.replaceChild(newNode, node);
                break;
            case utils.REMOVE:
                node.parentNode.removeChild(node);
                break;
        }
    });
}
module.exports = patch;

複製代碼

25.vue中的Data爲何是函數不是對象

組件中的data寫成一個函數,數據以函數返回值形式定義,這樣每複用一次組件,就會返回一份新的data,相似於給每一個組件實例建立一個私有的數據空間,讓各個組件實例維護各自的數據。而單純的寫成對象形式,就使得全部組件實例共用了一份data,就會形成一個變了全都會變的結果

26.爲何須要淺拷貝

js變量中的引用類型再複製的操做中會複製地址,致使兩個變量指向同一份數據。

深拷貝和淺拷貝都是針對引用類型,防止地址複製的,淺拷貝只進行了一層的拷貝,深拷貝利用遞歸進行了無數層。

全部在須要複製一個複雜對象進行操做且不但願影響影響原對象的時候,應該採起深拷貝。

27.簡述指針是什麼

指針就是內存地址,在js中,引用類型如對象和數組,他們的值都是指向對應的地址,在賦值傳遞的過程當中爲地址傳遞

28.簡述nodeJs是什麼

Node.js 是一個基於 Chrome V8 引擎的 JavaScript 運行環境。 Node.js 使用了一個事件驅動、非阻塞式 I/O 的模型,使其輕量又高效。

node.js能夠做爲一個讓js運行在服務端的開發平臺

29.進程和線程的區別

  • 一個程序能夠有多個進程;

  • 一個進程能夠有多個線程;

  • 進程在執行過程當中擁有獨立的內存單元,而多個線程共享內存,從而極大地提升了程序的運行效率。;

  • 多個線程之間能夠相互通訊;

  • 每一個獨立的線程有一個程序運行的入口、順序執行序列和程序的出口。可是線 程不可以獨立執行,必須依存在應用程序中,由應用程序提供多個線程執行控制。

  • 從邏輯角度來看,多線程的意 義在於一個應用程序中,有多個執行部分能夠同時執行。但操做系統並無將多個線程看作多個獨立的應用,來實現 進程的調度和管理以及資源分配。這就是進程和線程的重要區別。

  • 從chrome瀏覽器來理解進程個線程https://blog.csdn.net/Donspeng/article/details/82970503

31. 如何監聽未處理的異常

  • try..catch

一、沒法捕捉到語法錯誤,只能捕捉運行時錯誤;

二、能夠拿到出錯的信息,堆棧,出錯的文件、行號、列號;

四、須要藉助工具把全部的function塊以及文件塊加入try,catch,能夠在這個階段打入更多的靜態信息

  • window.onerror

因爲try..catch只能捕獲塊裏面的錯誤,全局的一些錯誤能夠用window.onerror來捕捉

34.http和https的區別

  • http工做在TCP協議的80端口,HTTP所封裝的信息是明文的,經過抓包工具能夠分析其信息內容,因此包含危險。
  • https工做在TCP協議的443端口,它隊傳輸的信息和url都作了加密處理,更加安全。

35.爲何https不會被截獲信息

1) 完成TCP三次同步握手 2) 客戶端驗證服務器數字證書,經過,進入步驟3 3) DH算法協商對稱加密算法的密鑰、hash算法的密鑰 4) SSL安全加密隧道協商完成 5)網頁以加密的方式傳輸,用協商的對稱加密算法和密鑰加密,保證數據機密性;用協商的hash算法進行數據完整性保護,保證數據不被篡改

36. 量子計算機可否破接非堆成加密

現有的量子計算機的能力沒法破解公鑰私鑰結合的非對稱加密,可是隨着量子計算技術的發展,總有一天會對現有密碼構成實際威脅。

國際上從2006年開始舉辦"抗量子計算密碼學術會議(PostQuantum Cryptography)",每兩年舉行一次,至今已舉辦了4屆。已經產生了一批重要的研究成果,讓人們看到了抗量子計算密碼的新曙光。

37. 量子計算機的原理

量子計算機經過量子力學的量子比特的兩種量子態來表示經典比特狀態0,1。 現代量子計算機模型的核心技術即是態疊加原理,屬於量子力學的一個基本原理。一個體系中,每一種可能的運動方式就被稱做態。在微觀體系中,量子的運動狀態沒法肯定,呈現統計性,與宏觀體系肯定的運動狀態相反。量子態就是微觀體系的態。

38.瀏覽器是如何緩存的

HTML Meta標籤控制緩存

瀏覽器緩存機制,其實主要就是HTTP協議定義的緩存機制(如: Expires; Cache-control等)。可是也有非HTTP協議定義的緩存機制,如使用HTML Meta 標籤,Web開發者能夠在HTML頁面的節點中加入標籤,代碼以下:

<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
複製代碼

告訴瀏覽器當前頁面不被緩存

HTTP頭信息控制緩存

  1. Expires(過時時間): 這個屬性告訴緩存器:相關副本在多長時間內是新鮮的。過了這個時間,緩存器就會向源服務器發送請求

  2. Cache-Control響應頭信息:

1) no-cache:表示必須先與服務器確認返回的響應是否被更改。

2) no-store:更加簡單,直接禁止瀏覽器和全部中繼緩存存儲返回的任何版本的響應

3) max-age:該指令指定從當前請求開始,容許獲取的響應被重用的最長時間(單位爲秒)

4) s-maxage=[秒]: 相似於max-age屬性,除了他應用於共享(如:代理服務器)緩存。

5) public : 標記認證內容也能夠被緩存

39. 詳述http1.0 1.1 2.0的區別

內容較多,詳情參考連接 www.cnblogs.com/heluan/p/86…

40. TCP協議如何保證傳輸的可靠性

詳細參考:

blog.csdn.net/cmm0401/art…

www.iteye.com/blog/uule-2…

TCP協議保證數據傳輸可靠性的方式主要有:

校驗和

發送的數據包的二進制相加而後取反,目的是檢測數據在傳輸過程當中的任何變化。若是收到段的檢驗和有差錯,TCP將丟棄這個報文段和不確認收到此報文段。

確認應答+序列號

序列號:TCP傳輸時將每一個字節的數據都進行了編號,這就是序列號。

確認應答:TCP傳輸的過程當中,每次接收方收到數據後,都會對傳輸方進行確認應答。也就是發送ACK報文。這個ACK報文當中帶有對應的確認序列號,告訴發送方,接收到了哪些數據,下一次的數據從哪裏發。

序列號的做用不只僅是應答的做用,有了序列號可以將接收到的數據根據序列號排序,而且去掉重複序列號的數據,這也是TCP傳輸可靠性的保證之一。

超時重傳

當TCP發出一個段後,它啓動一個定時器,等待目的端確認收到這個報文段。若是不能及時收到一個確認,將重發這個報文段。

流量控制

TCP鏈接的每一方都有固定大小的緩衝空間,TCP的接收端只容許發送端發送接收端緩衝區能接納的數據。當接收方來不及處理髮送方的數據,能提示發送方下降發送的速率,防止包丟失。TCP使用的流量控制協議是可變大小的滑動窗口協議。

擁塞控制

TCP引入了慢啓動的機制,在開始發送數據時,先發送少許的數據探路。探清當前的網絡狀態如何,再決定多大的速度進行傳輸。這時候就引入一個叫作擁塞窗口的概念。發送剛開始定義擁塞窗口爲1,每次收到ACK應答,擁塞窗口加 1。在發送數據以前,首先將擁塞窗口與接收端反饋的窗口大小比對,取較小的值做爲實際發送的窗口。

擁塞窗口的增加是指數級別的。慢啓動的機制只是說明在開始的時候發送的少,發送的慢,可是增加的速度是很是快的。爲了控制擁塞窗口的增加,不能使擁塞窗口單純的加倍,設置一個擁塞窗口的閾值,當擁塞窗口大小超過閾值時,不能再按照指數來增加,而是線性的增加。在慢啓動開始的時候,慢啓動的閾值等於窗口的最大值,一旦形成網絡擁塞,發生超時重傳時,慢啓動的閾值會爲原來的一半(這裏的原來指的是發生網絡擁塞時擁塞窗口的大小),同時擁塞窗口重置爲 1。

擁塞控制是TCP在傳輸時儘量快的將數據傳輸,而且避免擁塞形成的一系列問題。是可靠性的保證,同時也是維護了傳輸的高效性。

擁塞控制主要是四個算法:1)慢啓動,2)擁塞避免,3)擁塞發生,4)快速恢復。

TCP的鏈接管理

  1. TCP是面向有鏈接的數據通訊,也就說在進行實際的數據包的收發以前,會先作好通訊兩端主機的準備工做:TCP三次握手!
  2. 在雙端主機進行數據的交互完成過以後,會進行TCP鏈接的斷開處理

滑動窗口

TCP引入了窗口這個概念,即便在往返時間比較長的狀況下,它也可以控制網絡性能的降低。確認應答包再也不以每一個段爲單位進行確認了,而是以更大的單位進行確認,轉發時間將會被大幅度的縮短。也就是說,發送端主機在發送了一個段以後,不必一直等待對端主機的確認應答信號,而是繼續發送。

窗口大小,指的就是無需等待接收端主機的確認應答信號而能夠持續發送的數據的最大值,或者說段的最大值

在滑動窗口之外的數據,包括還沒有發送出去的數據,以及已經確認對端收到的數據,當發送端確認對端已經收到數據包以後,此數據包就能夠從緩衝區中清除了。

當收到確認應答信號過以後,會把滑動窗口的位置滑動到確認應答的序列號的位置,這樣就能夠順序的將多個段同時發送以提升通訊功能了。這就是滑動窗口控制。

41. UDP和TCP協議的區別

UDP(User Datagram Protocol)

UDP不提供複雜的控制機制,利用IP提供面向無鏈接的通訊服務。而且它是將應用程序發來的數據在收到的那一刻,馬上按照原樣發送到網絡上的一種機制。 即便是出現網絡擁堵的狀況下,UDP也沒法進行流量控制等避免網絡擁塞的行爲。此外,傳輸途中若是出現了丟包,UDO也不負責重發。甚至當出現包的到達順序亂掉時也沒有糾正的功能。若是須要這些細節控制,那麼不得不交給由採用UDO的應用程序去處理。換句話說,UDP將部分控制轉移到應用程序去處理,本身卻只提供做爲傳輸層協議的最基本功能。UDP有點相似於用戶說什麼聽什麼的機制,可是須要用戶充分考慮好上層協議類型並製做相應的應用程序。

UDP應用場景:

  1. 面向數據報方式
  2. 網絡數據大多爲短消息
  3. 擁有大量Client
  4. 對數據安全性無特殊要求
  5. 網絡負擔很是重,但對響應速度要求高

TCP(Transmission Control Protocol)

TCP充分實現了數據傳輸時各類控制功能,能夠進行丟包的重發控制,還能夠對次序亂掉的分包進行順序控制。而這些在UDP中都沒有。此外,TCP做爲一種面向有鏈接的協議,只有在確認通訊對端存在時纔會發送數據,從而能夠控制通訊流量的浪費。TCP經過檢驗、序列號、確認應答、重發控制、鏈接管理以及窗口控制等機制實現可靠性傳輸。

一個例子

咱們常用「ping」命令來測試兩臺主機之間TCP/IP通訊是否正常,其實「ping」命令的原理就是向對方主機發送UDP數據包,而後對方主機確認收到數據包,若是數據包是否到達的消息及時反饋回來,那麼網絡就是通的。而損失了多少數據就是丟包率

推薦一個借魔獸世界遊戲服務器來講明兩種協議各自的優缺點的文章

blog.csdn.net/w00w12l/art…

42.爲何使用UDP

UDP在相應速度上是優於TCP,安全性和數據可靠性上不如TCP

因此,UDP通常用在網絡負擔很是重,但對響應速度要求高,數據類型都是短消息的狀況下。

一個有意思的例子

若是你寫一個有肢體觸碰的即時動做對戰遊戲,那就應該用UDP,由於須要快速的物理碰撞檢測反應

若是dota類遊戲,則應該使用TCP,能夠更好地保證數據可靠和減小丟包。

43. WebSoket是基於什麼協議的鏈接

  • WebSoket是HTML5的協議,基於http1.1協議的擴展.
  • WebSoket是一種能夠實現服務端主動向客戶端發送消息的鏈接,相比於ajax輪詢和long poll,具備更好的處理效率和和更低的服務器資源消耗。
  • 一句話說明就是: WebSoket的TCP鏈接不會中斷,能夠監聽服務端的主動消息,執行回調。

44.冒泡算法和快速排序的時間複雜度

  • 冒泡排序進行了兩層循環,時間複雜度O(n²)
  • 快速排序是兩分遞歸的排序方法,平均時間複雜度O(nlg(n)),最糟的狀況複雜度是O(n²),最好狀況是O(nlog2(n))

快速排序時間複雜度的證實

www.cnblogs.com/fengty90/p/…

最優狀況每次均分,最差狀況每次分到極值

45. 分佈式系統用什麼算法排序

什麼是分佈式系統

分佈式系統是由一組經過網絡進行通訊、爲了完成共同的任務而協調工做的計算機節點組成的系統。分佈式系統的出現是爲了用廉價的、普通的機器完成單個計算機沒法完成的計算、存儲任務。其目的是利用更多的機器,處理更多的數據。

什麼是分佈式排序

分佈式排序是指,在p臺已經斌於序號的計算機C1,C2,……,Cp上,對一組給定的數據分佈X={X1,X2,……,Xp}進行全局排序,獲得一個新的數據分佈Y={Y1,Y2,……,Yp},使得每一個Yi(1≤i≤p)有序,而且Yi的每一個元素不大於Yj的任何元素,i≤j。

分佈式排序的分類

  • 單節點排序(SNS)
  • 多節點歸併排序(MNMS)
  • 多節點分區排序(MPS)

詳細見文章

zhuanlan.zhihu.com/p/26013687

46.深度搜索和廣度搜索的應用

  • 深度搜索和廣度搜索都是針對樹,圖等可聯通對象的遍歷方法。
  • 廣度搜索遵循同級遍歷的原則,常被用來搜索最短路徑或最佳路徑,廣度優先搜索空間複雜度大。
  • 深度搜索遵循一條路走到底再找另外一條的原則,深度優先搜索特別適用於那些探索全部的可能性的這些問題,問題解決的可能性是很是多的,因此須要去探索全部的可能性,從而找到全部可以知足問題的解決方案或者是解決方案中最優的那一個。
  • 深搜和廣搜時間複雜度同樣,可是空間複雜度廣度搜索要大

47. 廣度搜索的數據結構

  • 廣度搜索的實現藉助了數據結構隊列
  • 經過隊列的特性確保了完成一層的遍歷再進入下一層

48.鏈式求導是什麼

  • 鏈式求導是微積分中複合函數的求導法則
  • 深度學習神經網絡中有用到相關內容

49.矩陣的秩是什麼

矩陣的秩是線性代數中的一個概念。在線性代數中,一個矩陣A的列秩是A的線性獨立的縱列的極大數,一般表示爲r(A),rk(A)或rank A

50. 梯度和倒數,偏導

都是一些微積分的基本概念,推薦閱讀

www.cnblogs.com/lingjiajun/…

51.信息熵

  • 信息量度量的是一個具體事件發生了所帶來的信息,而熵則是在結果出來以前對可能產生的信息量的指望——考慮該隨機變量的全部可能取值,即全部可能發生事件所帶來的信息量的指望。
  • 信息熵還能夠做爲一個系統複雜程度的度量,若是系統越複雜,出現不一樣狀況的種類越多,那麼他的信息熵是比較大的。 若是一個系統越簡單,出現狀況種類不多(極端狀況爲1種狀況,那麼對應機率爲1,那麼對應的信息熵爲0),此時的信息熵較小。
相關文章
相關標籤/搜索