如果區塊中存在let和const命令,這個區塊對這些命令聲明的變量,從一開始就形成了封閉作用域。凡是在聲明之前就使用這些變量,就會報錯。
Chapter 4對象擴展對象字面量擴展1.創建對象時,當屬性名和變量名相等時,省略屬性名function createPerson(name, age) { return { name, age };}2.給對象添加方法時,省略functionvar person = { name: "Nicholas", sayName() { console.log(this.name); }};3.屬性名let lastName = "last name";let person = { "first name": "Nicholas", [lastName]: "Zakas"};console.log(person["first name"]); // "Nicholas"console.log(person[lastName]); // "Zakas"用表達式作為屬性名:var suffix = " name";var person = { ["first" + suffix]: "Nicholas", ["last" + suffix]: "Zakas"};console.log(person["first name"]); // "Nicholas"console.log(person["last name"]); // "Zakas"4.新方法1.Object.is() 比較兩個值是否嚴格相等2.Object.assign() 用于對象的合并,將源對象的所有屬性復制到目標對象var target = { a: 1 };var source1 = { b: 2 };var source2 = { c: 3 };Object.assign(target, source1, source2);target // {a:1, b:2, c:3}還可用于為對象添加屬性、方法等。5.重寫"use strict";var person = { name: "Nicholas", name: "Greg" // no error in ES6 strict mode};console.log(person.name); // "Greg"6.屬性枚舉順序 Object.getOwnPRopertyNames(obj)數字按升序排列,字符串按它們添加到對象的順序排列.7.改變PrototypeObject.setPrototypeOf()方法,接收兩個對象最為參數8.super 指向當前對象原型的指針原為Object.getPrototypeOf(this).getGreeting.call(this);改為super.getGreeting();【在簡化的方法中】,可以通過super調用對象原型上的任何方法。let friend = { getGreeting: function() { // syntax error return super.getGreeting() + ", hi!"; }};
Chapter 5解構賦值ES6允許按照一定模式,從數組和對象中提取值,對變量進行賦值。1.對象解構let node = { type: "Identifier", name: "foo"};let { type, name } = node;變量名和屬性名一致var { foo, bar } = { foo: "aaa", bar: "bbb" };foo // "aaa"bar // "bbb"對象的解構賦值的內部機制,是先找到同名屬性,然后再賦給對應的變量。真正被賦值的是后者,而不是前者。var { foo: baz } = { foo: "aaa", bar: "bbb" };baz // "aaa"foo // error: foo is not defined也可嵌套var obj = { p: [ 'Hello', { y: 'World' } ]};var { p: [x, { y }] } = obj;x // "Hello"y // "World"指定默認值let node = { type: "Identifier", name: "foo"};let { type, name, value = true } = node;2.數組解構數據解構對items的位置操作模式匹配let colors = [ "red", "green", "blue" ];let [ firstColor, secondColor ] = colors;console.log(firstColor); // "red"console.log(secondColor); // "green"交換變量:let a = 1, b = 2;[ a, b ] = [ b, a ];3.混合Chapter 71.set:類似數組,但成員的值唯一let set=new Set();可接收一個數組作為參數,用來初始化。添加:set.add(value)判斷是否存在:set.has(value)刪除一個:set.delete(value)刪除全部:set.clear() forEach()方法:set.forEach(function(value,key,ownerSet){});forEach方法還可以有第二個參數,表示綁定的this對象。key和value相等set里的forEach()不能訪問items索引,如需要,則應將其轉換為數組。Array.from方法可將Set結構轉換為數組。set轉換為array: array=[...set];(會去除set中的重復項)。Weak Sets:(對象引用)弱引用(即垃圾回收機制不考慮WeakSet對該對象的引用,也就是說,如果其他對象都不再引用該對象,那么垃圾回收機制會自動回收該對象所占用的內存,不考慮該對象還存在于WeakSet之中。這個特點意味著,無法引用WeakSet的成員,因此WeakSet是不可遍歷的。)WeakSet結構與Set類似,也是不重復的值的集合,但WeakSet的成員只能是對象。創建:let set=new WeakSet();三大集合對象:arrays, maps, sets2.map:(key-value)let map=new Map();添加:map.set(key,value);檢索:map.get();對象也可以是key。也有has(),delete(),clear()方法。Weak Maps:每一個key都必須是對象object,鍵名所指向的對象,不計入垃圾回收機制。用處:和DOM元素進行數據交互。存儲對象實例的專用數據。(WeakMap的設計目的在于,鍵名是對象的弱引用(垃圾回收機制不將該引用考慮在內),所以其所對應的對象可能會被自動回收。當對象被回收后,WeakMap自動移除對應的鍵值對。典型應用是,一個對應DOM元素的WeakMap結構,當某個DOM元素被清除,其所對應的WeakMap記錄就會自動被移除?;旧?,WeakMap的專用場合就是,它的鍵所對應的對象,可能會在將來消失。WeakMap結構有助于防止內存泄漏。)Chapter 81.是一個方法,返回一個迭代器。function關鍵字與函數名之間有一個星號,函數體內部使用yield語句,定義不同的內部狀態。2.function *createIterator(){}let iterator=createIterator(); 指向內部狀態的指針對象如果是匿名函數,星號的位置為:let createIterator=function *(){}3.yield:執行完一條時,暫停執行,直到下一個next()調用的時候,再執行下一條yield。每次調用next(),返回一個有著value和done兩個屬性的對象。4.因為是方法,可添加到對象。5.for-of如果只是迭代數組或集合里的值的話用for-oflet values=[1,2,3];for(let num of values){ console.log(num);}6.通過Symbol.iterator訪問默認迭代器let values=[1,2,3];let iterator=values[Symbol.iterator]();console.log(iterator.next());獲取默認迭代器,并用于遍歷數組中的items,也是for-of的內部過程。還可以據此判斷一個對象是否可迭代。7.自定義迭代器自己創建一個Symbol.iterator屬性,該屬性包含一個Generator函數。8.內置迭代器entries() 返回key-value對values() 返回valueskeys() 返回keys9.三大集合類型的for-of時的默認迭代器arrays/sets: values()maps: entries()10.字符串迭代器for-of 可打印字符串的雙字節字符11. 節點列表迭代器12.擴展運算符(...)可將多個數組插入到一個數組中13.高級迭代器功能當將參數傳遞給next()方法時,該參數將成為上一個yield語句的返回值。iterator.throw(new Error("boom"));使用yield時,next()和throw()方法控制迭代器中的執行。next()可通過給定值來指示迭代器繼續執行,throw()通過拋出錯誤來指示迭代器繼續執行。14. return 停止執行,done為true,value為undefined。若提供一個返回值,則value為該值,done為true。再執行一條next()時,value變為undefined。15. 委托在yield和函數名之間加*號,可以委托給別的Generator。function *createCombinedIterator(){ yield *createNumberIterator(); yield *createColorIterator();}據此可以將多個Generator的value合成一個。也可訪問返回值。16. 異步編程因為生成器允許在執行的時候有效地暫停執行,這位異步處理提供了許多可能性。一個簡單的任務運行器,需定義一個函數,接受一個Generator作為參數,在函數內創建一個迭代器并start。若要傳遞數據,可將result.value傳入next()作為參數。一個異步的任務運行器,result.value(function(err,data){} 有一個回調函數。Chapter 9類1.類的聲明:class PersonClass{ constructor(name){ this.name=name; } sayName(){ console.log(this.name); }}let person=new PersonClass("Jack");2.類的聲明類似let,存在暫時性死區。3.在類的里面不能重寫類名,在類外可以。4.類表達式匿名類表達式,省略類名。let PersonClass=class{}若有類名,如let PersonClass=class PersonClass2{},則PersonClass2只存在于類內,類外為undefined。5.ES6中,類可作為函數參數。6.類表達式可通過立即調用類構造函數來創建實例。需要new。let person=new Class{ constructor(name){ this.name=name; } sayName(){ console.log(this.name); }}("Jack");創建一個匿名類表達式并立即執行。7.訪問器屬性類允許在原型上定義訪問器屬性。get和setclass CustomHTMLElement{ constructor(element){ this.element=element; } get html(){ return this.element.inerHTML; } set html(vlaue){ this.element.innerHTML=vlaue; }}var descriptor=Object.getOwnPropertyDescriptor(CustomHTMLElement.prototype,"html");console.log("get" in descriptor); //ture【Object.getOwnPropertyDescriptor(object,propertyname)獲取指定對象的自身屬性描述符。自身屬性描述符是指直接在對象上定義(而非從對象的原型繼承)的描述符。】8.[表達式]使用變量為類定義中的方法分配名稱。let methodName="sayName";class PersonClass{ constructor(name){ this.name=name; } [methodName](){ cosole.log(this.name); }};使用變量為類定義中的方法分配屬性名let propertyName="html";class CustomHTMLElement{ ... get [propertyName](){...} ...}9. Generator Methods定義:class MyClass{ *createIterator(){ yield 1; yield 2; }}let instance=new MyClass();let iterator=instance.createIterator();9.靜態成員class PersonClass{ ... static create(name){ return new PersonClass(name); }}let person=PersonClass.create("Jack");10.派生類繼承,關鍵字extendsclass Rectangle { constructor(length, width) { this.length = length; this.width = width; } getArea() { return this.length * this.width; }}class Square extends Rectangle { constructor(length) { // equivalent of Rectangle.call(this, length, length) super(length, length); }}var square = new Square(3);Square構造函數使用super()來調用具有指定參數的Rectangle構造函數。如果選擇不使用構造函數,在創建一個新的類的實例時,super()會被自動調用。11.繼承靜態成員如果基類具有靜態成員,那么這些靜態成員也可在派生類上使用。12.表達式派生類只要表達式帶有[[Construct]]的函數和原型,就可以對任何表達式使用extend。在extends之后接受任何類型的表達式提供了強大的可能性,例如動態確定要繼承的內容。chapter 10數組1.創建數組Array.of() 參數為items2.將一個類數組轉換為數組Array.from() 參數為items,可接收一個函數作為第二個參數,每個item在該函數運行后輸出。還可接收第三個參數代表this。還可在迭代器中使用:let numbers = { *[Symbol.iterator]() { yield 1; yield 2; yield 3; }};let numbers2 = Array.from(numbers, (value) => value + 1);console.log(numbers2); // 2,3,43.find()&findIndex()let numbers = [25, 30, 35, 40, 45];console.log(numbers.find(n => n > 33)); // 35console.log(numbers.findIndex(n => n > 33)); // 24.fill() 對數組items的整體或部分進行重寫5.copyWithin()6.Typed Arrays數組緩存區所有類型數組的基礎是數組緩沖區,它是一個可以包含指定數量字節的內存位置。創建數組緩沖區:let buffer=new ArrayBuffer(10);console.log(buffer.byteLength); //10可用slice()7.使用視圖操作數組緩沖區 DataView數組緩沖區表示內存位置,視圖是用于操作該內存的接口。視圖對數組緩沖區或數組緩沖區字節的子集進行操作,以一種數值數據類型讀取和寫入數據。let buffer=new ArrayBuffer(10);let view=new DataView(buffer); //所有let view=new DataView(buffer,5,2); //部分 5,6檢索視圖信息有三個,buffer,byteOffset,byteLength8.讀寫數據getInt8(byteOffset,littleEndian),setInt8(byteOffset,value,littleEndian視圖允許在任何時間點以任何格式讀取和寫入,而不考慮之前數據時如何存儲的。9.創建特定類型視圖let buffer=new ArrayBuffer(10), view1=new Int8Array(buffer), view2=new Int8Array(buffer,5,2);
新聞熱點
疑難解答