Es6 建立面試題

2021-10-14 12:23:17 字數 3971 閱讀 1601

var:1.不受限於塊級作用域

2.可以重複宣告變數

3.宣告的變數存在宣告提公升,變數可以在宣告之前呼叫,值:underfind

宣告提公升:就是將變數提公升到當前作用域的最頂部

let和const:1.受限於塊級作用域

2.有暫時性死區

3.不能重複宣告變數

4.變數不存在宣告提公升,一定在宣告後使用,否則會報錯

const:是常量,不可改變的量,一旦改變會報錯,宣告之後進行賦值,否則或報錯

暫時性死區:使用let命令宣告變數前,該變數是不存在的

普通函式:1.可以有匿名函式,也有具名函式,可以用於建構函式,以此建立例項物件

2.具有arguments物件

3.有原型prototype屬性

4.的this指向呼叫它的物件

定義:解構賦值就是從目標物件或陣列中提取變數

應用場景:element-ui vant-ui的按需引入 請求介面返回資料,提取想要的資料

1.陣列結構賦值:左右值是一一對應的

var a,b;

[a,b]=[10,20]

console.log(a)//10

console.log(b)//20

2.物件結構賦值:值是根據屬性名來賦值

(=)console.log(a)//10

console.log(b)//20

3.解構賦值:交換a,b的值

var a = 1,b = 2;

[a,b] = [b,a];

console.log(a); // 2

console.log(b); // 1

4.// 剩餘運算子 陣列:根據陣列的形式,左右值是一一對應的,a,b的值,剩下的就是…rest的啦

var a,b,rest;

[a,b,…rest] = [22,33,44,55,66]

console.log(a); // 22

console.log(b); // 33

console.log(rest); // [44,55,66]

5.// 剩餘運算子 物件:值是根據屬性名來賦值,位置發生變動,值也不變

var a,b,rest;

(=)console.log(a); // 22

console.log(b); // 33

console.log(rest); // [44,55,66]

es5中的類:

es5中生成例項物件需要定義建構函式,通過new操作符來生成例項物件。

定義了建構函式並且new建構函式,後台會隱式執行new object()建立物件。並將建構函式的作用域給到新物件,即例項物件的this直接指向建構函式

es5繼承:

1.原型鏈繼承:父類的例項作為子類的原型

優點:簡單易於實現,父類的新增例項與屬性子類都能訪問

缺點:可以在子類中增加例項屬性,如果要新增原型屬性和方法需要在new父類建構函式的後面無法實現多繼承

建立子類例項時,不能向父類建構函式中傳引數

2.借用建構函式繼承:複製父類的例項屬性給子類

優點:解決子類建構函式向父類建構函式傳遞引數,可以實現多繼承

缺點:方法在建構函式中定義,無法復用

不能繼承原型屬性/方法,只能繼承父類的例項屬性和方法

3.組合繼承:既能呼叫父類例項屬性,又能呼叫父類原型屬性

優點:函式可復用,不存在引用屬性問題,可以繼承屬性和方法,也可以繼承原型的屬性和方法

缺點:由於呼叫兩次父類,所以產生了兩份例項

es6中的類:

es6中引入了class類的概念,通過class關鍵字定義類。

定義方法不能使用function關鍵字

方法之間不能用逗號隔開,不然會發生報錯

class定義的類實質上是乙個函式,指向自身相關聯的建構函式,可以理解為class類是建構函式的另一種寫法

在通過class定義的類中存在prototype屬性的。class定義的類中的方法都被儲存在prototype中。

可以通過object.assign方法動態給物件增加方法。

constructor方法是類的建構函式的預設方法,通過new命令生成物件例項時,自動呼叫該方法

constructor方法預設返回例項物件this,但是也可以指定constructor方法返回乙個全新的物件,讓返回的例項物件不是該類的例項

在constructor內部定義的屬性可以稱為例項屬性,constructor外宣告的屬性都是定義在原型上的,可以稱為原型屬性。然後通過hasownproperty()函式用於判斷屬性是否是例項屬性,返回值為布林值。然後通過in操作符可以判斷屬性是否在類中。結合這兩個方法可以判斷該屬性時在類的例項上還是原型上。

class不存在變數提公升,所以需要先定義再使用。因為es6不會把類的宣告提公升到**頭部,但是es5就不一樣,es5存在變數提公升,可以先使用,然後再定義。

es6繼承:

**量少,簡單易懂

通過class關鍵字定義乙個類,子類通過extends關鍵字來繼承父類的屬性和方法

子類的constructor方法中通過super關鍵字繼承父類的屬性

在子類的原型上通過super關鍵字來繼承父類的方法

1.for…in遍歷陣列會得到下標

2.for…in遍歷物件得到是物件的key值

1.for…of遍歷陣列得到的是value

2.for…of直接遍歷物件會報錯

3.for…of遍歷物件需要配合object.keys()

var obj =

for(var a of object.keys(obj))

深拷貝:建立乙個新的物件和陣列,將原物件的各項屬性的值(陣列的所有元素)拷貝過來,是值而不

是』引用』

淺拷貝:將原物件或陣列的引用直接賦給新物件或新陣列,新陣列/新物件只是原物件的乙個引用

手動深拷貝(遞迴**)

function deepclone(obj)

// 初始化返回結果

let result

// 判斷傳入的是陣列還是物件

// 用instanceof 來判斷obj 是否在array的原型鏈上 如果在就是陣列

if(obj instanceof array)else

}//for … in 遍歷obj

for(var key in obj)

return result}}

var add=,

arr:[『a』,『b』,『c』]

}const obj1=deepclone(add)

consloe.log(obj1.arr)//a,b,c

obj1.arr[0]=『d』

consloe.log(obj1.arr[0])//d

es5繼承:在子類中建立自己的this指向,最後將方法新增到this中

es6繼承:使用關鍵字先建立父類例項物件this,最後在子類class中修改this

// promise 封裝ajax

function fun(method,url)else if(xhr.status == 400)}})

return p

}let url=『

fun(『get』,url).then(res=>)

待更新…

ES6面試題總結

1 說出至少5個es6的新特性,並簡述它們的作用。簡答題 1.let關鍵字,用於宣告只在塊級作用域起作用的變數 2.const關鍵字,用於宣告乙個常量 3.結構賦值,一種新的變數賦值方式。常用於交換變數值,提取函式返回值,設定預設值 4.symbol資料型別,定義乙個獨一無二的值 5.proxy 用...

前端面試題 ES6

1.反引號 標識 模板字串 template string 是增強版的字串,用反引號 標識,它可以當作普通字串使用,也可以用來定義多行字串,或者在字串中嵌入變數 var name bob time today hello how are you hello bob,how are you today...

js高階面試題總結(es6)

1 模組化 通過import 來呼叫其他js檔案中export的的模組 exp1.js export default exp2.js export function fn1 export function fn2 imp.js 匯入 import exp1 from exp1.js import f...