溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
今天小編給大家分享一下ES6面試題有哪些的相關知識點，內容詳細，邏輯清晰，相信大部分人都還太了解這方面的知識，所以分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后有所收獲，下面我們一起來了解一下吧。
聲明變量
let a; let b, c, d; let e = 1; let f = 2, g = 3;
特性
不能重復聲明
塊級作用域 只在塊級作用域有效
沒有變量提升
不影響作用域鏈
特性
必須有初始值
一般常量使用大寫
常量的值不能修改
也是塊級作用域
對于數組和對象的修改，不算對常量的修改，不會報錯（可以對數組和對象進行修改，指向的地址沒有改變）
const RNG = ['uzi', 'mlxg', 'letme', 'ming'] let [a, b, c, d] = RNG;// 每個值就是數組的位置對應的值
const UZI= {
name: '自豪',
age: 22,
love: 'LOL'，
lol: function(){
alert('打lol')
}
}
let {name, age, love} = UZI;// 每個值是對象中對應的值
let {lol} = UZI;
lol();// 使用內容中可以直接出現換行符，單引號雙引號內容不能直接用換行符（需要通過引號加號拼接）
let str = `lol s10 tes 是冠軍`;// 可以這樣直接使用換行符
直接進行變量的拼接 ${}
let lol = 'lol十周年';
let uzi = `${lol} 中國隊奪冠`let name = 'zhangning187';
let change = function(){
console.log('努力改變');
}
const supwisdom = {
name,
change
}let fn = (a, b) => {
return a + b;
}
fn(1, 2);// 3特點
1.this是靜態的，this始終是指向函數聲明時所在作用域下的this值，他沒有自己的this
2.不能作為構造實例化對象
3.不能使用arguments變量
4.箭頭函數的簡寫
省略小括號，當形參有且只有一個的時候可以省略
let add = n => {
return n*2;
}省略花括號，當代碼體只有一條語句的時候,return 必須省略，語句的執行結果就是函數的返回值
let add = n => n*2;
function add(a, b, c = 10) {// 當不傳遞c的時候，c的默認值是10，盡量把具有默認值的參數放在后面
return a + b + c;
}
add (1, 2);// 13function con({name, age, love, height = '18'}) {// 還可以給默認值
console.log(age);// 24
console.log(height);// 沒有傳遞，使用默認值 18
}
con({
name: 'zhangning187',
age: 24,
love: 'js'
})用于獲取參數的實參，用于代替arguments
rest參數是一個數組和es5中的arguments不一樣，arguments里面是一個對象
獲取實參的方式
function data(a, b, ...args) {// rest 參數必須放到參數的最后面
console.log(a);// 1
console.log(b);// 2
console.log(args);// [3, 4, 5, 6, 7]
}
data(1, 2, 3, 4, 5, 6, 7);可以將數組轉換為逗號分隔的參數序列，將一個數組分割，并將各個項作為分離的參數序列傳遞給函數
const RNG = ['UZI', 'MLXG', 'LETME', 'MING']; console.log(...RNG)// UZI MLXG LETME MING 解構之后的序列 console.log(RNG);// ['UZI', 'MLXG', 'LETME', 'MING'] 返回的是一個數組 const a = [1,2], b=[3,6]; const c = [...a, ...b];// [1, 2, 3, 6]
他是javaScript 語言的第七種數據類型，是一種類似于字符串的數據類型
特點
1.Symbol 的值是唯一的，用來解決命名沖突的問題
2.Symbol 值不能與其他數據進行運算，也不能自己運算 + - * /
3.Symbol 定義的對象屬性不能使用for in循環遍歷，但是可以使用 Reflect.ownKeys 來獲取對象的所有鍵名
//創建Symbol
let s = Symbol();// s不可見，在內部實現唯一性
let s2 = Symbol('zhangning187');// 這里面的字符串只是一個標志，Symbol返回的值都是唯一的
let s3 = Symbol('zhangning187');
console.log(s2 == s3);// false，確定唯一性
//Symbol.for()方法創建，這是一個對象，這種方式可以得出唯一的Symbol值
let s6 = Symbol.for('zhangning187');
let s8 = Symbol.for('zhangning187');
console.log(s6 ==s8);// true 得到唯一的Symbol值對象添加Symbol類型的屬性
let zn = {
up: function(){},
down: function(){},
name: 'zhangning187',
age: 24
}
// 向對象zn中添加 up down 方法
// zn.up = function(){}// 這個可以添加但是不確定zn中是否存在up方法,可能會覆蓋原來的up方法
// 這時候需要考慮通過Symbol添加唯一的方法
// 聲明一個對象
let methods = {
up: Symbol(),
down: Symbol()
}
zn[methods.up] = function(){
console.log('我可以爬樓');
}
zn[methods.down] = function(){
console.log('我可以下樓');
}
console.log(zn);// 已經添加唯一的方法 up down
let UZI = {
name: '自豪',
// Symbol(): function(){},// 這里不能這樣直接使用， Symbol()是一個表達式，是一個動態的
[Symbol('lol')]: function(){
console.log('我會打lol');
},
[Symbol('籃球')]: function(){// Symbol()中還可以添加描述字符串
console.log('我可以打籃球')
}
}
console.log(UZI);迭代器是一種接口，為各種不同的數據結構提供統一的訪問機制，任何數據結構只要部署Iterator接口，就可以完成遍歷操作
1.ES6創造了一種新的遍歷命令for...of循環，Iterator接口提供for...of消費
2.原生具備iterator接口的數據
Array Arguments Set Map String TypedArray NodeList
3.工作原理
a 創建一個指針對象，指向當前數據結構的起始位置
b 第一次調用對象的next方法，指針自動指向數據結構的第一個成員
c 接下來不斷調用next方法，指針一直往后移動，直到指向最后一個成員
d 每調用next方法返回一個包含value和done屬性的對象
自定義遍歷數據的時候，要想到迭代器
生成器函數是ES6提供的一種異步編程解決方案，與傳統函數完全不同，就是一個特殊的函數
// 聲明
function * gen(){// * 可以靠左，也可以靠右，還可以放在中間
// console.log('hello');
yield '2020lpl牛批';// yield 語句可以算作函數代碼的分隔符
let two = yield ‘uzi 退役了’;
console.log(two);
yield '湖人總冠軍';
}
// 執行
let iterator = gen();
// console.log(iterator);// 返回結果是一個迭代器對象
console.log(iterator.next());// 需要執行迭代器對象中的next()方法，才會執行生成器函數
console.log(iterator.next());// 每個next()只會執行里面一個yield語句，這個會輸出 ‘uzi 退役了’
// 傳遞參數 參數將作為上一個yield語句的返回結果
console.log(iterator.next('AAA'));// 第三次調用傳遞的參數將作為第二個yield 的返回結果 打印為AAA
// 使用for of循環遍歷輸出
for(let v of gen()){
console.log(v);// 依次輸出yield語句中的值
}案例：1s輸出 111 2s輸出 222 3s輸出 333
function one(){
setTimeout(()=>{
console.log('111')
iterator.next();
}, 1000)
}
function two(){
setTimeout(()=>{
console.log('111')
iterator.next();
}, 1000)
}
function three(){
setTimeout(()=>{
console.log('111')
}, 1000)
}
// 生成器函數
function * gen(){
yield one();
yield two();
yield three();
}
// 調用生成器函數
let iterator = gen();
iterator.next();Promise 是一個構造函數，用來封裝異步操作并可以獲取其成功或失敗的結果
1、 Promise 構造函數 Promise(excutor){}
2、 Promise.prototype.then 有兩個參數，兩個參數都是函數，
Promise對象成功狀態執行then中第一個函數，失敗執行第二個函數
3、 Promise.prototype.catch
// 實例化
const p = new Promise((resolve, reject) => {
// 通過resolve，reject這兩個函數來改變Promise對象的狀態，
// resolve會改變p的狀態為成功，reject會改變p的狀態為失敗，然后去執行then里面的方法
// 執行異步操作，以定時器為例，定時器也是異步
setTimeout(()=>{
//let data = '異步執行成功';
// resolve(data);// 調用resolve函數, p會變成一個成功的狀態，會執行then中的第一個方法
let err = '執行失敗';
reject(err);// 調用reject函數，p會變成一個失敗的狀態，會執行then中的第二個方法
}, 1000)
})
// 成功會調用 promise 對象 then 方法
p.then(value => {// 成功
// console.log(value);// 控制臺打印：異步執行成功
}, reason => {// 失敗
console.error(reason)
})Promise.prototype.then 特性
// then方法的返回結果是Promise對象，對象狀態由回調函數的執行結果決定
const p = new Promise((resolve, reject) => {
setTimeout(()=>{
resolve('成功');
reject('失敗');
}, 1000);
});
// then 的返回結果是一個Promise對象，就是result也是一個Promise對象，它的狀態由函數的執行結果決定的
const result = p.then(value => {
console.log(value);
// 1.如果返回的結果是 非Promise 類型的屬性，狀態為成功，返回值return 中的值
// 如果不寫return，函數內部不寫return返回結果是undefined，也不是Promise對象，狀態也是成功
// return 123;
// 2.是 promise 對象, 該對象返回的狀態就決定了then方法返回promise對象狀態
return new Promise((resolve, reject)=>{
// resolve('ok');// then方法返回promise對象狀態為成功
reject('no');// then方法返回promise對象狀態為失敗
})
// 3.拋出錯誤 then方法返回promise對象狀態為失敗，錯誤值為拋出錯誤的值
throw new Error('出錯了');
}, reason => {
console.err(reason);
});
console.log(result);
// 綜上總結，then方法可以鏈式調用 可以改變回調域的現象
p.then(value=>{}, reason=>{})
.then(value()=>{}).then();舉例：多個請求都返回之后，獲取其中的數據
const p = new Promise((resolve, reject)=>{
resolve('第一次返回成功')
});
p.then(value=>{
return new Promise((resolve, reject)=>{
resolve([value, '第二次返回成功'])
});
}).then(value=>{
return new Promise((resolve, reject)=>{
resolve([...value, '第三次返回成功'])
});
}).then(value=>{
console.log(value);// 返回值為三次請求都返回成功以后的值
});新的數據結構Set（集合），它類似于數組，成員的值都是唯一的，集合實現了iterator接口，所以可以使用擴展運算符和for of遍歷
集合的屬性和方法
1 size 返回集合的元素個數
2 add 添加一個新元素，返回當前集合
3 delete 刪除元素，返回boolean值
4 has 檢測集合中是否包含某個元素，返回boolean值
5 clear 清空
// 聲明
let s = new Set();
let s2 = new Set([1, 2, 3, 6, 7]);
console.log(s2);// 5
s2.add(8);// 添加新元素
console.log(s2);// 輸出 {1, 2, 3, 6, 7, 8}
s2.delete(8);
console.log(s2);// 輸出 {1, 2, 3, 6, 7}
console.log(s2.has(8));// false
// s2.clear();// 清空
let arr = [1, 2, 3, 3, 3, 6, 6, 8];
let arr2 = [1, 3, 6, 7, 8];
// 數組去重
let result = [...new Set(arr)];
// 交集
let result = [...new Set(arr)].filter(item => new Set(arr2).has(item));
// 并集
let result = [...new Set([...arr, ...arr2])];
// 差集 arr有arr2中沒有
let result = [...new Set(arr)].filter(item => !(new Set(arr2).has(item)));類似于對象，也是鍵值對的集合，但是 鍵 不限于字符串，各種類型的值（包括對象）都可以當作鍵，
map也實現了 iterator 接口，所以可以使用擴展運算符和for of進行遍歷
1 size 返回 Map 的元素個數
2 set 增加一個新元素，返回當前Map
3 get 返回鍵名對象的鍵值
4 has 檢測Map中是否包含某個元素，返回boolean值
5 clear 清空集合，返回undefined
// 聲明
let m = new Map();
m.set('name', 'zhangning');
m.set('change', function(){console.log('變得更努力')});// 鍵 change 值 一個function
let key = {company: 'supwisdom'};
m.set(key, [1, 2, 3]);//鍵 對象 值 數組
m.size;// 獲取m個數
m.delete('name');// 刪除鍵值對
m.get('change');// 獲取鍵對應的值
// m.clear();// 清空
for(let v of m){console.log(v);}通過class可以定義類，新的class寫法只是讓對象原型的寫法更加清晰，更像面向對象編程的語法而已。
1 class 聲明類
2 constructor 定義構造函數初始化
3 extends 繼承父類
4 super 調用父級構造方法
5 static 定義靜態方法和屬性
6 父類方法可以重寫
es5通過 構造函數實例化 對象的方法
// 人
function People(name, sex) {
this.name = name;
this.sex = sex;
}
// 這個height這種添加方式是屬于函數對象的，不屬于實例對象，這樣的屬性稱之為靜態成員
People.height = '180';
People.prototype.height1 = '100';
// 添加方法
People.prototype.play = function(){
console.log('打籃球');
}
let zn = new People('zhangning', '男');
zn.play();// 輸出 打籃球
console.log(zn);
console.log(zn.height);// 輸出 undefined
console.log(zn.height1);// 輸出 100，必須通過prototype添加才能添加到實例對象上通過class實現
class People{
// 靜態屬性 static，對于static 標注的方法屬于類，不屬于實例對象
static height = '100';
static change(){
console.log('我可以改變世界');
}
// 構造方法 名字不能更改（在使用new People的時候會自動執行實例對象上的constructor方法）
constructor(name, sex){
this.name = name;
this.sex = sex;
}
// 添加方法必須使用該語法，不能使用es5的完整形式（play: function(){} 這種形式不支持，必須使用play()形式）
// 成員屬性
play(){
console.log('打籃球');
}
}
let zn = new People('zhangning', '男');
console.log(zn);
console.log(zn.height);// undefined static 標注的方法屬于類，不屬于實例對象
console.log(People.height);// 100使用es5構造函數實現繼承
// 舉例 chinese 繼承 People 屬性
function People(name, sex) {
this.name = name;
this.sex = sex;
}
People.prototype.play = function(){
console.log('打LOL');
}
function Student(name, sex, like, height){
// 通過call方法，改變this值，this指向chinese中的this，也就是chinese的一個實例對象
People.call(this, name, sex);
this.like = like;
this.height = height;
}
// 設置子集構造函數原型
Student.prototype = new People;// 這樣就會有父級的一個方法
Student.prototype.constructor = Student;// 做一個校正，沒有這行代碼也無所謂
// 聲明子類方法
Student.prototype.photo = function(){
console.log('去拍照');
}
// 實例化
const zn = new Student('zhangning', '男', '打籃球', '187');
console.log(zn)使用es6 class 類 實現繼承 及 父類方法的重寫
// 聲明父類
class People{
// 父類構造方法
constructor(name, sex) {
this.name = name;
this.sex = sex;
}
// 父類成員屬性
play(){
console.log('打LOL');
}
}
// 聲明子類 使用extends 繼承父類
class Student extends People {
// 構造方法
constructor(name, sex, like, height){
super(name, sex);// super 就是父類的constructor構造函數，這樣調用
this.like = like;
this.height = height;
}
photo(){
console.log('去拍照');
}
// 對父類中的play方法進行重寫，子類是不能去調用父類的同名方法的，
play(){
// super(); 不允許，在普通的成員方法里面是不能出現super()去調用父類的同名方法的，會報錯，只能完全重寫
console.log('我會打LOL，還會打籃球');
}
}
const zn = new Student('zhangning', '男', '打籃球', '187');
console.log(zn)class 中 getter 和 setter 設置
class People{
get like(){
return '打籃球';
}
set like(newVal){
// 通過傳過來的newVal值，進行操作，改變 like
console.log('改變like值');
}
}
let p = new People();
console.log(p.like)// 輸出 打籃球
p.like = 'LOL';// 然后通過 set like 進行操作判斷兩個值是否完全相等
Object.is(1, 1);// true
和 === 很相似，唯一區別就是 NaN === NaN 為 false， Object.is(NaN, NaN) 為true
對象的合并
const c1 = {name: 'znn'};
const c2 = {name: 'zhangning', height: 187};
Object.assign(c1, c2);// 如果兩個對象中存在相同屬性，c2 中覆蓋c1中的屬性內容設置原型對象
const zn = {
name: 'zhangning',
}
const p = {
h: true,
sfsfdf: 'fasfasdf'
}
Object.setPrototypeOf(zn, p);// 設置 zn 的原型里面有 p
Object.getPrototypeOf(zn);// 獲取 zn 的原型
console.log(zn);// 打印看下Array.from方法用于將兩類對象轉為真正的數組：類數組的對象（ array-like object ）和可遍歷（ iterable ）的對象（包括 ES6 新增的數據結構 Set 和Map ）。
let arrayLike = {
'0': 'a',
'1': 'b',
'2': 'c',
length: 3
};
// ES5 的寫法
var arr1 = [].slice.call(arrayLike); // ['a', 'b', 'c']
// ES6 的寫法
let arr2 = Array.from(arrayLike); // ['a', 'b', 'c']
// NodeList 對象
let ps = document.querySelectorAll('p');
Array.from(ps).forEach(function (p) {
console.log(p);
});
// arguments 對象
function foo() {
var args = Array.from(arguments);
// ...
}
//字符串轉換為字符數組str.split('')
Array.from('hello') // ['h', 'e', 'l', 'l', 'o']
let namesSet = new Set(['a', 'b'])
Array.from(namesSet) // ['a', 'b']
Array.from({ length: 3 }); // [ undefined, undefined, undefined ]對于還沒有部署該方法的瀏覽器，可以用Array.prototype.slice方法替代：
const toArray = (() => Array.from ? Array.from : obj => [].slice.call(obj) )();
Array.from還可以接受第二個參數，作用類似于數組的map方法，用來對每個元素進行處理，將處理后的值放入返回的數組。
Array.from(arrayLike, x => x * x);
// 等同于
Array.from(arrayLike).map(x => x * x);
Array.from([1, 2, 3], (x) => x * x)
// [1, 4, 9]
//Array.from回調函數
var arr1 = Array.from([1,2,3], function(item){
return item*item;
});
var arr2 = Array.from([1,2,3]).map(function(item){
return item*item;
});
var arr3 = Array.from([1,2,3], (item) => item*item);
console.log(arr1); //[ 1, 4, 9 ]
console.log(arr2); //[ 1, 4, 9 ]
console.log(arr3); //[ 1, 4, 9 ]值得提醒的是，擴展運算符（...）也可以將某些數據結構轉為數組。
// arguments 對象
function foo() {
var args = [...arguments];
}
// NodeList 對象
[...document.querySelectorAll('div')]Array.of方法用于將一組值，轉換為數組。Array.of總是返回參數值組成的數組。如果沒有參數，就返回一個空數組。
Array.of基本上可以用來替代Array()或new Array()，并且不存在由于參數不同而導致的重載。它的行為非常統一。
這個方法的主要目的，是彌補數組構造函數Array()的不足。因為參數個數的不同，會導致Array()的行為有差異
Array() // [] Array(3) // [, , ,] Array(3, 11, 8) // [3, 11, 8] Array.of() // [] Array.of(3) // [3] Array.of(3, 11, 8) // [3,11,8] Array.of(3).length // 1 Array.of(undefined) // [undefined] Array.of(1) // [1] Array.of(1, 2) // [1, 2]
Array.of方法可以用下面的代碼模擬實現：
function ArrayOf(){
return [].slice.call(arguments);
}數組實例的find方法，用于找出第一個符合條件的數組成員。它的參數是一個回調函數，所有數組成員依次執行該回調函數，直到找出第一個返回值為true的成員，然后返回該成員。如果沒有符合條件的成員，則返回undefined。
[1, 4, -5, 10].find((n) => n < 0)
// -5
[1, 5, 10, 15].find(function(value, index, arr) {
return value > 9;
}) // 10上面代碼中，find方法的回調函數可以接受三個參數，依次為當前的值、當前的位置和原數組。數組實例的findIndex方法的用法與find方法非常類似，返回第一個符合條件的數組成員的位置，如果所有成員都不符合條件，則返回-1。
[1, 5, 10, 15].findIndex(function(value, index, arr) {
return value > 9;
}) // 2這兩個方法都可以接受第二個參數，用來綁定回調函數的this對象。
另外，這兩個方法都可以發現NaN，彌補了數組的IndexOf方法的不足。
[NaN].indexOf(NaN) // -1 [NaN].findIndex(y => Object.is(NaN, y)) // 0
fill()方法使用給定值，填充一個數組。
['a', 'b', 'c'].fill(7) // [7, 7, 7] new Array(3).fill(7) // [7, 7, 7] ['a', 'b', 'c'].fill(7, 1, 2) // ['a', 7, 'c']
上面代碼表明，fill方法用于空數組的初始化非常方便。數組中已有的元素，會被全部抹去。
fill()方法還可以接受第二個和第三個參數，用于指定填充的起始位置和結束位置
['a', 'b', 'c'].fill(7, 1, 2) // ['a', 7, 'c']
ES6 提供三個新的方法 —— entries()，keys()和values() —— 用于遍歷數組。它們都返回一個遍歷器對象，可以用for...of循環進行遍歷，唯一的區別是keys()是對鍵名的遍歷、values()是對鍵值的遍歷，entries()是對鍵值對的遍歷。
for (let index of ['a', 'b'].keys()) {
console.log(index);
}
// 0
// 1
for (let elem of ['a', 'b'].values()) {
console.log(elem);
}
// 'a'
// 'b'
for (let [index, elem] of ['a', 'b'].entries()) {
console.log(index, elem);
}
// 0 "a"
// 1 "b"如果不使用for...of循環，可以手動調用遍歷器對象的next方法，進行遍歷。
let letter = ['a', 'b', 'c']; let entries = letter.entries(); console.log(entries.next().value); // [0, 'a'] console.log(entries.next().value); // [1, 'b'] console.log(entries.next().value); // [2, 'c']
ES5中，我們常用數組的indexOf方法，檢查是否包含某個值。indexOf方法有兩個缺點，一是不夠語義化，它的含義是找到參數值的第一個出現位置，所以要去比較是否不等于 -1 ，表達起來不夠直觀。二是，它內部使用嚴格相當運算符（ === ）進行判斷，這會導致對NaN的誤判。
[NaN].indexOf(NaN) // -1 includes使用的是不一樣的判斷算法，就沒有這個問題。 [NaN].includes(NaN) // true
Array.prototype.includes方法返回一個布爾值，表示某個數組是否包含給定的值，與字符串的includes方法類似。該方法屬于 ES7 ，但 Babel 轉碼器已經支持。
[1, 2, 3].includes(2); // true [1, 2, 3].includes(4); // false [1, 2, NaN].includes(NaN); // true
該方法的第二個參數表示搜索的起始位置，默認為 0 。如果第二個參數為負數，則表示倒數的位置，如果這時它大于數組長度（比如第二個參數為 -4 ，但數組長度為 3 ），則會重置為從 0 開始。
[1, 2, 3].includes(3, 3); // false [1, 2, 3].includes(3, -1); // true
下面代碼用來檢查當前環境是否支持該方法，如果不支持，部署一個簡易的替代版本。
const contains = (() => Array.prototype.includes ? (arr, value) => arr.includes(value) : (arr, value) => arr.some(el => el === value) )(); contains(["foo", "bar"], "baz"); // => false
另外， Map 和 Set 數據結構有一個has方法，需要注意與includes區分。
Map 結構的has方法，是用來查找鍵名的，比如Map.prototype.has(key)、WeakMap.prototype.has(key)、Reflect.has(target, propertyKey)。
Set 結構的has方法，是用來查找值的，比如Set.prototype.has(value)、WeakSet.prototype.has(value)。
數組的空位指，數組的某一個位置沒有任何值。比如，Array構造函數返回的數組都是空位。
注意，空位不是undefined，一個位置的值等于undefined，依然是有值的。空位是沒有任何值，in運算符可以說明這一點。
0 in [undefined, undefined, undefined] // true 0 in [, , ,] // false
上面代碼說明，第一個數組的 0 號位置是有值的，第二個數組的 0 號位置沒有值。
ES5 對空位的處理，已經很不一致了，大多數情況下會忽略空位。
forEach() , filter() , every() 和some()都會跳過空位。
map()會跳過空位，但會保留這個值
join()和toString()會將空位視為undefined，而undefined和null會被處理成空字符串。
// forEach方法
[,'a'].forEach((x,i) => console.log(i)); // 1
// filter方法
['a',,'b'].filter(x => true) // ['a','b']
// every方法
[,'a'].every(x => x==='a') // true
// some方法
[,'a'].some(x => x !== 'a') // false
// map方法
[,'a'].map(x => 1) // [,1]
// join方法
[,'a',undefined,null].join('#') // "#a##"
// toString方法
[,'a',undefined,null].toString() // ",a,,"ES6則是明確將空位轉為undefined。
//Array.from方法會將數組的空位，轉為undefined，也就是說，這個方法不會忽略空位。
Array.from(['a',,'b']) // [ "a", undefined, "b" ]
//擴展運算符（...）也會將空位轉為undefined。
[...['a',,'b']] // [ "a", undefined, "b" ]
//copyWithin()會連空位一起拷貝。
[,'a','b',,].copyWithin(2,0) // [,"a",,"a"]
//fill()會將空位視為正常的數組位置。
new Array(3).fill('a') // ["a","a","a"]
//for...of循環也會遍歷空位。
let arr = [, ,];
for (let i of arr) {
console.log(1);
}
// 1
// 1
//上面代碼中，數組arr有兩個空位，for...of并沒有忽略它們。如果改成map方法遍歷，空位是會跳過的。
//entries()、keys()、values()、find()和findIndex()會將空位處理成undefined。
// entries()
[...[,'a'].entries()] // [[0,undefined], [1,"a"]]
// keys()
[...[,'a'].keys()] // [0,1]
// values()
[...[,'a'].values()] // [undefined,"a"]
// find()
[,'a'].find(x => true) // undefined
// findIndex()
[,'a'].findIndex(x => true) // 0
//由于空位的處理規則非常不統一，所以建議避免出現空位。以上就是“ES6面試題有哪些”這篇文章的所有內容，感謝各位的閱讀！相信大家閱讀完這篇文章都有很大的收獲，小編每天都會為大家更新不同的知識，如果還想學習更多的知識，請關注億速云行業資訊頻道。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
