ES6系列之小知識點

擴充套件運算子（spread）是三個點（...）。它好比 rest 引數的逆運算，將乙個陣列轉為用逗號分隔的引數序列。

將乙個陣列轉為用逗號分隔的引數序列。

function add(x, y) 
const numbers = [4, 38];
add(...numbers) // 42
let arr1 = [0, 1, 2];
let arr2 = [3, 4, 5];
arr1.push(...arr2);

複製陣列

const a1 = [1, 2];
// 寫法一
const a2 = [...a1];
// 寫法二
const [...a2] = a1;

上面的兩種寫法，a2都是a1的轉殖。

合併陣列

// es5
[1, 2].concat(more)
// es6
[1, 2, ...more]
var arr1 = ['a', 'b'];
var arr2 = ['c'];
var arr3 = ['d', 'e'];
// es5的合併陣列
arr1.concat(arr2, arr3);        // [ 'a', 'b', 'c', 'd', 'e' ]
// es6的合併陣列
[...arr1, ...arr2, ...arr3]     // [ 'a', 'b', 'c', 'd', 'e' ]

與解構賦值結合

const [first, ...rest] = [1, 2, 3, 4, 5];
first // 1
rest  // [2, 3, 4, 5]
const [first, ...rest] = ;
first // undefined
rest  // 
const [first, ...rest] = ["foo"];
first  // "foo"
rest   //

如果將擴充套件運算子用於陣列賦值，只能放在引數的最後一位，否則會報錯。

字串

let str = 'x\ud83d\ude80y';
str.split('').reverse().join('')       // 'y\ude80\ud83dx'
[...str].reverse().join('')            // 'y\ud83d\ude80x'

1.es5 對空位的處理:

2.es6 則是明確將空位轉為undefined。

單行定義的物件，最後乙個成員不以逗號結尾。多行定義的物件，最後乙個成員以逗號結尾。

物件盡量靜態化，一旦定義，就不得隨意新增新的屬性。如果新增屬性不可避免，要使用object.assign方法。

es6 允許直接寫入變數和函式，作為物件的屬性和方法。

屬性簡潔表示
const foo = 'bar';
const baz = ;
baz // 
// 等同於
const baz = ;
方法簡潔表示
const o = 
};// 等同於
const o = 
};

es6 允許字面量定義物件時，用表示式作為物件的屬性名，即把表示式放在方括號內。

let propkey = 'foo';
let hello = 'haha';
let obj =   
};

屬性名表示式如果是乙個物件，預設情況下會自動將物件轉為字串[object object]，這一點要特別小心。

物件的擴充套件運算子（...）用於取出引數物件的所有可遍歷屬性，拷貝到當前物件之中。

擴充套件運算子可以用於合併兩個物件。

let ab = ;
// 等同於
let ab = object.assign({}, a, b);

如果使用者自定義的屬性，放在擴充套件運算子後面，則擴充套件運算子內部的同名屬性會被覆蓋掉。

let awithoverrides = ;
// 等同於
let awithoverrides =  };

與陣列的擴充套件運算子一樣，物件的擴充套件運算子後面可以跟表示式。

const obj =  : {}),
b: 2,
};

由於解構賦值要求等號右邊是乙個物件，所以如果等號右邊是undefined或null，就會報錯，因為它們無法轉為物件。

let  = null; // 執行時錯誤
let  = undefined; // 執行時錯誤

解構賦值必須是最後乙個引數，否則會報錯。

let  = obj; // 句法錯誤
let  = obj; // 句法錯誤

解構賦值的拷貝是淺拷貝，即如果乙個鍵的值是復合型別的值（陣列、物件、函式），那麼解構賦值拷貝的是這個值的引用，而不是這個值的副本。

let obj =  };
let  = obj;
obj.a.b = 2;
x.a.b // 2

擴充套件運算子的解構賦值，不能複製繼承自原型物件的屬性。

let o1 = ;
let o2 = ;
o2.__proto__ = o1;
let  = o2;
o3 // 
o3.a // undefined

如果使用解構賦值，擴充套件運算子後面必須是乙個變數名，而不能是乙個解構賦值表示式。

let  } = o;    // syntaxerror

function point(x = 0, y = 0) 
const p = new point();
p //

引數預設值可以與解構賦值的預設值，結合起來使用。

function foo() 
foo({}) // undefined 5
foo() // 1 5
foo() // 1 2
foo() // typeerror: cannot read property 'x' of undefined

引數預設值不是傳值的，而是每次都重新計算預設值表示式的值。也就是說，引數預設值是惰性求值的。

引數設定預設值，這個引數是沒法省略的。

指定了預設值以後，函式的length屬性，將返回沒有指定預設值的引數個數。

rest 引數搭配的變數是乙個陣列，該變數將多餘的引數放入陣列中。

function add(...values) 
return sum;
}add(2, 5, 3) // 10

函式的name屬性，返回該函式的函式名。

function foo() {}
foo.name // "foo"

引數寫成多行（即每個引數佔據一行），尾部直接有乙個逗號。

function clownseverywhere(
param1,
param2,
)

ES6知識點總結

面向過程和物件導向的對比面向過程物件導向物件物件是由屬性和方法組成的類 class 在 es6 中新增加了類的概念，可以使用 class 關鍵字宣告乙個類，之後以這個類來例項化物件物件導向的思維特點抽取抽象物件共用的屬性和行為組織封裝成乙個類模板對類進行例項化,獲取類的物件...

ES6知識點簡單總結

let宣告的變數只能在所處遇到的快級有效。不存在變數提公升。暫時性死區，不受外部影響。在乙個大括號中使用let關鍵字宣告的變數才具有塊級作用域，var關鍵字不具有這個特點具有塊級作用域。使用const關鍵字宣告的常量必須賦值。常量賦值後值不能更改。varletconst 函式級作用域塊級作用域...

es6常用知識點總結

1.定義變數的方式 let 1 沒有變數提公升 var具有變數提公升即在當前作用域的最上面定義這個變數但不賦值例 console.log x var x 20 顯示undefined console.log m let m 100 報錯 2 let不可以重複宣告例 var x 10 var ...

ES6系列之小知識點

ES6知識點總結

ES6知識點簡單總結

es6常用知識點總結

相關推薦