es6 物件的擴充套件分享

2021-09-11 15:26:38 字數 4323 閱讀 6965

最近一直不知道該寫什麼分享給大家,看見同事問我es6的一些問題,於是總結了這篇文章。如有不對之處還請指正。

1.屬性的簡潔表示法

function f(x,y) ;

}// 等同於

function f(x,y);

}f(1,2)   // object

例如:let birth = '2000/01/01';

const person =

};例如:用於函式的返回值

function

getpoint

() ;

}console.log(getpoint());

// 複製**

2.屬性名表示式

表示式作為物件的屬性名

let obj = ;

console.log(obj[propkey]); // true

console.log(obj['abc']); // 123

例如:let lastword = 'last word';

const a =

console.log(a['first word']); // "hello"

console.log(a[lastword]); // "world"

console.log(a['last word']); // "world"

例如: 表示式可以用於定義方法名

let obj =

};console.log(obj.hello()); // 'hi'

複製**

3.方法的 name 屬性

例如:函式的name 屬性,返回函式名。

const person = 

}console.log(person.sayname.name); // "sayname"

複製**

4.object.is()

es 比較兩個值是否相等,只有兩個運算子,相等運算子,相等運算子(==)

和嚴格相等運算子(===)

+0 === -0 // true

nan === nan // false

object.is(+0,-0); // false

object.is(nan,nan) // true

複製**

5.object.assign()

object.assign 方法用於物件的合併,將源物件的所有的可列舉屬性,賦值到目標物件

例如;

const target = ;

const source1 = ;

const source2 = ;

object.assign(target,source1,source2);

console.log(target); //

例如:同名屬性的替換,當遇到同名屬性的時候,處理方法是替換。

const target = }

const source = }

console.log(object.assign(target,source))

// }

例如: 陣列的處理

object.assign 可以用來出來陣列,把陣列作為物件看

object.assign([1,2,3],[4,5])

// [4,5,3]

常見用途(1) 為物件新增屬性

class point );}}

常見用途(2) 為物件新增方法

object.assign(someclass.prototype,

anothermethod

()      })

常見用途(3) 轉殖物件

function

clone (origin) ,origin);

}複製**

6.屬性的可枚舉行和遍歷

可列舉性

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

let obj = ;

object.getownpropertydescriptor(obj,'foo')

// 複製**

描述物件的enumerable 屬性,稱為「可列舉屬性」 如果該屬性的值為false,

就表示會忽略當前屬性。

目前有四個操作會忽略 enumerable 為false 屬性。

for...in , object.keys(), json.stringify(), object.assign();

es6一共有5種方法可以遍歷物件的屬性

(1) for ... in

迴圈遍歷物件自身的和繼承的可列舉屬性

(2) object.keys(obj)

object.keys 返回乙個陣列,包括物件自身的所有可列舉屬性

(3) object.getownpropertynames(obj)

object.getownpropertynames 返回乙個陣列,包含物件自身的所有屬性

(4) object.getownpropetrysymbols(obj)

object.getownpropetrysymbols 返回乙個陣列,包含物件自身的所有

symbol屬性的鍵名。

(5) reflect.ownkeys(obj)

reflect.ownkeys 返回乙個陣列,包含物件自身的所有鍵名。

8.proto 屬性

_proto_ 屬性,用來讀取和設定當前物件的protoype物件。

const obj =

}obj._proto_= someotherrobj;

object.setprototypeof()

object.setprototypeof 方法的作用與 _proto_ 相同,用來設定乙個物件的prototype物件

返回引數物件本身,。

// 格式

object.setprototypeof(object,prototype)

// 用法

const o = object.setprototypeof({},null);

object.getprototypeof()

該方法與object.setprototypeof 方法配套,用於讀取乙個物件的原型物件。

object.getprototypeof(obj);

複製**

9.super 關鍵字

this 關鍵字總是指向函式所在的當前物件,super 指向當前物件的原型物件。

const proto = ;

const obj =

}object.setprototypeof(obj,proto);

obj.find();

複製**

10.object.keys() ,object.values(),object.entries()

let  = object;

let object = ;

for (let key of keys(obj))

for(let key of keys(obj))

for(let value of values(obj))

for (let [key,value] of entries(obj))

複製**

11.物件的擴充套件運算**

物件的結構賦值用於從乙個物件取值,相當於將所有可遍歷的,但尚未對齊的屬性,

分配到指定的物件上面,所有的鍵和值他們的值,都會拷貝到新物件上面。

let  = ;

x // 1

y // 2

z //

擴充套件運算

擴充套件運算子(...) 用於取出引數物件的多有可遍歷屬性,拷貝到當前物件之中。

let z = ;

let n = ;

n //

合併兩個物件

let ab = ;

// 等同於

let ab = object.assign({},a,b)

複製**

聯絡我

ES6 物件擴充套件

es6 允許直接寫入變數和函式,作為物件的屬性和方法 var key1 1 var bj var bz 方法的簡寫 var ob fn2 表示式還可以用於定義方法名。var lastword last word var a a first word hello a lastword world a ...

ES6物件擴充套件

es6允許直接寫入變數和函式,作為屬性名和方法 var a b var c c 如果屬性值與屬性名一樣,我們值寫屬性名就可以 方法簡寫 add add function 定義物件屬性有兩種方法 obj.name lijixuan 2obj name lijixuan 我們原本只能用識別符號定義屬性,...

ES6 物件擴充套件

物件擴充套件主要從四個方面開展 1.簡潔表示法 2.屬性表示式 3.擴充套件運算子 4.object新增方法 let es6 console.log es5,es6 object object 在es5中,我們去定義物件,多使用鍵值對的方式來定義,在es6中,我們直接使用變數名稱來定義就可以了。是不...