ECMAScript 6の新特性——「オブジェクトの拡張」
4802 ワード
1属性の簡潔な表現法
ES 6は、オブジェクトの属性と方法として変数と関数を直接書き込むことができます.
属性を書き込み
2属性名式
JavaScript言語には対象の属性を定義する方法があります.
関数のname属性は関数名を返します.オブジェクトメソッドも関数ですので、name属性もあります.
4 Object.is()
この方法は(==)と基本的に一致しています.+0は-0に等しくなく、NaNは自身に等しいです.
ソースオブジェクトのすべてのエニュメレート・プロパティーをターゲットオブジェクトにコピーします.最初のパラメータはターゲットオブジェクトで、その後のパラメータはソースオブジェクトです.
ES 6は全部で6つの方法でオブジェクトの属性を遍歴することができます. 以上の6つの方法は、オブジェクトの属性を遍歴し、同じ属性遍歴の順序規則を遵守します.は、最初にすべての属性名が数値の属性を巡回して、数字によって並べ替えられます. は次に、すべての属性名が文字列の属性を巡回し、生成時間に従って並べ替えられます. は最後にSymbol値という属性を巡回し、生成時間に従って並べ替えます. 7 Object.get ProttypeOf()とObject.set ProttotypeOf()
代わりに、以下の
ES 5にはObject.keysが1つの配列に戻ります.メンバーはパラメータオブジェクト自体の(引き継ぎを含まない)すべてのアクセス可能な属性のキー名です.
類似配列の上記のいくつかの方法.
9 ES 7:オブジェクトの拡張演算子
現在、ES 7の提案では、Resetデフォース/拡張演算子(…)をオブジェクトに導入する.
10 ES 7:Object.getOwn PropertyDescriptors()
ES 5にはObject.getOwn PropertyDescripter()があります.
ES 6は、オブジェクトの属性と方法として変数と関数を直接書き込むことができます.
属性を書き込み
var name = "value";
var obj = {
name
};
console.log(obj.name); //value
書き込み方法var func = function(){return "function"};
var obj = {
func
};
console.log(obj.func()); //function
例を挙げますlet name = "Oliver";
let sayName = function() {
console.log(this.name);
};
let person = {
name,
sayName
};
console.log(person.name); //Oliver
person.sayName(); //Oliver
伝統的な書き方:let person = {
name: "Oliver",
sayName: function() {
console.log(this.name);
}
};
console.log(person.name); //Oliver
person.sayName(); //Oliver
属性の値を記入する必要はありません.function log(x, y) {
return {x, y};
}
console.log(log(1, 2)); //Object {x: 1, y: 2}
伝統的な書き方:function log(x, y) {
return {x: x, y: y};
}
console.log(log(1, 2)); //Object {x: 1, y: 2}
このような書き方の属性名は常に文字列です.2属性名式
JavaScript言語には対象の属性を定義する方法があります.
var o = {};
function f() {return "boo" + "lean";}
o.bool = true; //
o[f()] = false; //
console.log(o); //Object {bool: true, boolean: false}
ただし、文字どおりにオブジェクトを定義する場合は、方法の一つしか使えません.var o = {
bool: true
};
console.log(o); //Object {bool: true}
ES 6は使用方法2をサポートします.function f() {
return "bool" + "ean";
}
var o = {
bool: true,
[f()]: false
};
console.log(o); //Object {bool: true, boolean: false}
3方法のname属性関数のname属性は関数名を返します.オブジェクトメソッドも関数ですので、name属性もあります.
4 Object.is()
この方法は(==)と基本的に一致しています.+0は-0に等しくなく、NaNは自身に等しいです.
console.log(NaN === NaN); //false
console.log(Object.is(NaN, NaN)); //true
console.log(+0 === -0); //true
console.log(Object.is(+0, -0)); //false
5 Object.assign()ソースオブジェクトのすべてのエニュメレート・プロパティーをターゲットオブジェクトにコピーします.最初のパラメータはターゲットオブジェクトで、その後のパラメータはソースオブジェクトです.
var o1 = {
a: 1
};
var o2 = {
b: 2,
c: 3
};
Object.assign(o1, o2);
console.log(o1); //Object {a: 1, b: 2, c: 3}
同じ名前の属性で、後ろは前面をカバーします.var o1 = {
a: 1
};
var o2 = {
a: 2,
b: 3
};
Object.assign(o1, o2);
console.log(o1); //Object {a: 2, b: 3}
ネストオブジェクトは、追加ではなく代替処理です.var o1 = {
a: {
b: 1,
c: 2
},
d: 1
};
var o2 = {
a: {
b: "str"
},
d: 4
};
Object.assign(o1, o2);
console.log(o1);
//Object {a: Object, d: 4}
//a:Object
//b:"str"
//__proto__:Object
//d:4
//__proto__:Object
配列、処理方法はオブジェクトとして扱われます.var a = [1, 2, 3, 4, 5];
var b = [2, 0];
Object.assign(a, b);
console.log(a); //[2, 0, 3, 4, 5]
6属性の巡回ES 6は全部で6つの方法でオブジェクトの属性を遍歴することができます.
for...in
:for…inサイクルは、オブジェクト自体のエニュメレート・属性(Symbol属性を含まない)を巡回する.Object.keys(obj)
:Object.keysはオブジェクト自体の(引き継ぎを含まない)エニュメレート・属性のすべてを含む配列を返します.Object.getOwnPropertyNames(obj)
:Object.getOwn PropertyNamesは、オブジェクト自体のすべての属性(Symbol属性を含まないが、列挙できない属性を含む)を含む配列を返します.Object.getOwnPropertySymbols(obj)
:Object.getOwn PropertySymboolsは、オブジェクト自体のすべてのSymbol属性を含む配列を返します.Reflect.ownKeys(obj)
:Reflect.ownKeysは、オブジェクト自体の属性のすべてを含み、属性名がSymbolまたは文字列であっても、列挙可能であるかどうかに関わらず、配列を返します.Reflect.enumerate(obj)
:Reflect.enumerateはIteratorオブジェクトに戻り、オブジェクト自体のエニュメレーション属性と継承されたすべてのエニュメレーション属性(Symbol属性を含まない)は、for...inサイクルと同じである.__proto__
を使用してprototypeを取得することはできるだけ避けます.代わりに、以下の
Object.setPrototypeOf()( )
、Object.getPrototypeOf()( )
、Object.create()( )
を使用する.var o = {
name: "Oliver",
age: 18
};
var proto = {};
Object.setPrototypeOf(o, proto);
proto.getName = function() {
return this.name;
};
console.log(o.getName()); //Oliver
console.log(Object.getPrototypeOf(o));
//Object {} getName : () __proto__ : Object
8 ES 7:Object.values()、Object.entries()ES 5にはObject.keysが1つの配列に戻ります.メンバーはパラメータオブジェクト自体の(引き継ぎを含まない)すべてのアクセス可能な属性のキー名です.
var o = {
name: "Oliver",
age: 18
};
console.log(Object.keys(o)); //["name", "age"]
ES 7の提案またはObject.values()、Object.entries()の2つの方法に参加します.類似配列の上記のいくつかの方法.
9 ES 7:オブジェクトの拡張演算子
現在、ES 7の提案では、Resetデフォース/拡張演算子(…)をオブジェクトに導入する.
10 ES 7:Object.getOwn PropertyDescriptors()
ES 5にはObject.getOwn PropertyDescripter()があります.