ES 6エントリーオブジェクトの拡張

1.属性の簡潔な表現
ES 6では変数と関数を直接書き込むことができ,オブジェクトの属性と方法としてコードの書き込みをより簡潔にする.

const f = 'a'
const b = {f}
b  // {f: 'a'}

   
const b = {f: f}

ES 6ではオブジェクト内に直接変数を書き込むことができます.この場合、属性名は変数名で、属性値は変数値です.

function u(x, y){
    return {x, y}
}

// ====

function u(x, y){
    return {x: x, y: y }
}

u(1, 2)   // {x:1, y: 2}


      ：

function o() {
    const x = 1;
    const x = 2;
    return {x, y}
}
o() // {x:1, y:2}

2.属性名式
JavaScriptにおける属性名の式の方法は2つあり,1つは直接識別子を属性名,2つ目は式を属性名とする.2番目に書くときは式をかっこの中に入れます

// 
obj.foo = true

// 
obj['a' + 'bc'] = 123

// 
let t = 'm'

let obj = {
    [t]: true,
    ['a' + 'bc']: 123
}

式はメソッド名を定義するためにも使用できます(属性名式は簡潔な表現と同時に使用できません)

let obj = {
    ['h' + 'ello']() {
        return 'hi'
    }
}

obj.hello() // hi

属性名式がオブジェクトである場合、デフォルトではオブジェクトは文字列に自動的に変換されます[object Object]

const ka = {a: 1}
const kb = {b: 2}

const myObj = {
    [ka]: 'va',
    [kb]: 'vc'
}

myObj // Object {[object Object]: 'vc'}

3.メソッドのname属性
関数のname属性は、関数名を返し、オブジェクトメソッドも関数であるため、name属性も返します.

const p = {
    n() {
        console.log('h')
    }
}

p.n.name // n

特殊な場合getterとsetterのプロパティはgetとsetの上にあります

const obj = {
    get foo() {},
    set fod() {}
}

obj.foo.name // undefined

const d = Object.getOwnPropertyDescriptor(obj, 'foo')

d.get.name // get foo
d.set.name // set fod

特殊な場合bindが作成した関数name属性はboundに元の関数の名前を返す

var do = function(){
    
}
do.bind().name // bound do

特殊な場合Function構造関数が作成した関数で、nameはanonymousを返します.

(new Function()).name // anonymous

オブジェクトのメソッドがSymbolの場合、nameはこのSymbolの説明を返します.

const k = Symbol('  ')
k.name // "[  ]"

4.属性の列挙性と遍歴
列挙可能性
オブジェクトの各プロパティには、そのプロパティの動作を制御する記述オブジェクトがあります.getownPropertyDescriptorメソッドは、このプロパティの記述オブジェクトを取得できます.

let obj = {f: 234}
Object.getOwnPropertyDescriptor(obj, 'foo')
//  {
//    value: 234,
//    writable: true,
//    enumerable: true,
//    configurable: true
//  }

オブジェクトを記述するenumerableプロパティは、「列挙可能」と呼ばれ、trueの場合、現在の操作が無視される操作があることを示します.

         enumerate   false    

- for...in  ：                  
- Object.keys()：                  
- JSON.stringify():                
- Object.assign():   enumerable false   ， 
             

ES 6のすべてのclassのプロトタイプの方法は枚挙にいとまがない.
属性の遍歴
ES 6には,オブジェクトの属性を巡回する5つの方法がある.

（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     ，        。 1）for..in


             ，               
    
             ，        。
              ，          。
           Symbol  ，          。
    

5.superキーワード
thisのキーワードは常に関数が存在する現在のオブジェクトを指し、ES 6はまた別の類似のキーワードsuperを追加し、現在のオブジェクトのプロトタイプオブジェクトを指す.
注意:superキーワードがプロトタイプオブジェクトを表す場合、オブジェクトのメソッドにしか使用できません.他の場所で使用するとエラーが発生します.

//   
const obj = {
  foo: super.foo
}

//   
const obj = {
  foo: () => super.foo
}

//   
const obj = {
  foo: function () {
    return super.foo
  }
}

JavaScriptエンジンにとって、ここのsuperはオブジェクトの方法に使われていないので、上記の3つのsuperの使い方は間違っています.1つ目の書き方はsuperが属性に使用され、2つ目と3つ目の書き方はsuperが1つの関数に使用され、foo属性に値を付与します.現在、JavaScriptエンジンに確認できるのは、オブジェクトメソッドの略記法のみであり、オブジェクトのメソッドを定義している.
公衆番号へようこそ【小夭さん】
ES 6入門シリーズ
ES 6入門のlet、cont
ES 6入門の変数の解構賦値
ES 6エントリー文字列の拡張
ES 6入門の正則的な拡張
ES 6入門の数値の拡張
ES 6入門の関数の拡張
ES 6入門の対象の新しい方法
Gitチュートリアル
フロントエンドGit基礎チュートリアル