ECMAScript6 入門 物件的擴充套件

2022-03-25 11:28:53 字數 2487 閱讀 7754

物件的擴充套件

1:屬性的簡潔表示

(也就是說當物件的屬性和值同名時,可以縮寫為乙個)

const foo = 'bar';

const baz =;

baz

////

等同於const baz =;

方法簡寫

const o =

};//

等同於const o =

};2:屬性名表示式

(可以使用表示式定義物件的key)

已知定義物件的屬性方法

//方法一

obj.foo = true;//

方法二obj['a' + 'bc'] = 123;

但是使用字面量方式定義物件(使用大括號)的話,只能用上面方法一

var obj =;

es6支援

let obj =;

表示式還可以定義方法名

let obj =

};obj.hello()

//hi

3:方法的name屬性

函式的name屬性,返回函式名

如果物件的方法使用了取值函式(getter)和存值函式(setter),

則name屬性不是在該方法上面,而是該方法的屬性的描述物件的get和set屬性上面,

返回值是方法名前加上get和set

4:屬性的可列舉性和遍歷

物件的每個屬性都存在乙個描述物件,用來控制該屬性的行為。

object.getownpropertydescriptor方法可以獲取該屬性的描述物件

enumerable表示該物件是否可以列舉

以下四個操作都會忽略物件的不可列舉屬性

for...in迴圈:只遍歷物件自身的和繼承的可列舉的屬性。

object.keys():返回物件自身的所有可列舉的屬性的鍵名。

json.stringify():只序列化物件自身的可列舉的屬性。

object.assign(): 忽略enumerable為false的屬性,只拷貝物件自身的可列舉的屬性

已知遍歷物件屬性的五個方法

(1)for...in

for...in迴圈遍歷物件自身的和繼承的可列舉屬性(不含 symbol 屬性)。

(2)object.keys(obj)

object.keys返回乙個陣列,包括物件自身的(不含繼承的)所有可列舉屬性(不含 symbol 屬性)的鍵名。

(3)object.getownpropertynames(obj)

object.getownpropertynames返回乙個陣列,包含物件自身的所有屬性(不含 symbol 屬性,但是包括不可列舉屬性)的鍵名。

(4)object.getownpropertysymbols(obj)

object.getownpropertysymbols返回乙個陣列,包含物件自身的所有 symbol 屬性的鍵名。

(5)reflect.ownkeys(obj)

reflect.ownkeys返回乙個陣列,包含物件自身的所有鍵名,不管鍵名是 symbol 或字串,也不管是否可列舉。

5:super關鍵字

this

關鍵字總是指向函式所在的當前物件

( 關聯知識點

1:普通函式中this與函式定義時無關,只與函式執行時所在的物件有關

2:箭頭函式中的this執行定義函式時所處的物件

)super 指向當前物件的原型物件

物件新增api

1:object.is()

比較兩個值是否相等,與嚴格運算子===的行為基本一致

區別:+0 不等於-0nan 等於自身了

2:object.assign()

用於物件合併 將源物件source可列舉屬性,複製到目標物件

3:object.getownpropertydescriptors()

返回物件的某個屬性的描述物件

4:object.getownpropertydescriptors()

返回指定物件所有自身屬性的描述物件,不包含繼承的屬性

5:物件的繼承是通過原型鏈實現

用來讀取設定當前物件的prototype物件

object.setprototypeof()

object.getprototypeof()

額外知識點:__proto__屬性,object.setprototypeof(),object.getprototypeof()

6:object.keys()

返回值是乙個陣列,成員是引數物件的所有可遍歷的屬性的key(不包含繼承)

7:object.values()

返回值是乙個陣列,成員是引數物件的所有可遍歷的屬性的value(不包含繼承)

8:object.entries()

返回值是乙個陣列,成員是引數物件的所有可遍歷的屬性的key 和 value(不包含繼承)

9:object.fromentries()

object.entries的逆操作

ECMAScript 6入門類繼承筆記

看類繼承前,先回顧建構函式怎麼實現物件的繼承的 function f function son function inherit s,f inherit son,f let son new son 它實現了哪幾個功能 用來extends和super關鍵字,看乙個簡單的繼承 class a class...

EcmaScript 6 箭頭函式

es5 var total values.reduce function a,b 0 es6 var total values.reduce a,b a b,0 箭頭即乙個函式的簡化 es5 confetti btn click function event es6 confetti btn cli...

ECMAScript 6入門讀書筆記二

更加便利的從匿名物件或者陣列中,對變數進行賦值 基本樣式,右邊資料型別必須是可迭代的型別。let a 1,b 2,c 3 等價於 let a,b,c 1,2,3 對於let a,b,c 1,2,3 就是按照 這樣的模式一一對abc進行賦值 對於陣列型別的模式匹配取值還算簡單的,比較容易 設定預設值 ...