jinzhe

jinzhe

github
email

javascript中のオブジェクトのプロパティの設定

データ属性ディスクリプタ#

  • value:値
  • writable:値の書き換え可否
  • enumerable:列挙可能かどうか(forinObject.keys()
  • configurable:設定可能かどうか(deletedefinePropertyが成功するかどうか)

注意
プロパティディスクリプタは個々のプロパティレベルで動作します。

Object.getOwnPropertyDescriptor#

データプロパティのディスクリプタを取得します。

const user = {
  name: 'z',
  age: 23
}

const config = Object.getOwnPropertyDescriptor(user, 'name')

console.log(config)
// { value: 'z', writable: true, enumerable: true, configurable: true }

Object.defineProperty#

データプロパティのディスクリプタを設定します。

const user = {
  name: 'z',
  age: 23
}

Object.defineProperty(user, 'name', {
  writable: false,
  enumerable: false,
  configurable: false
})

Object.defineProperties#

オブジェクトの複数のデータプロパティのディスクリプタを一度に設定します。

const user = {
  name: 'z',
  age: 23
}

Object.defineProperties(user, {
  name: {
    writable: false,
    enumerable: false,
    configurable: false
  },
  age:{
    writable: false,
    enumerable: false,
    configurable: false
  }
})

Object.getOwnPropertyDescriptors#

すべてのデータプロパティのディスクリプタを一度に取得します。

const user = {
  name: 'z',
  age: 23
}

const config = Object.getOwnPropertyDescriptors(user)
console.log(config)
// {
//    name: { value: 'z', writable: true, enumerable: true, configurable: true },
//    age: { value: 23, writable: true, enumerable: true, configurable: true }
//}

グローバルなシールオブジェクトを設定する#

Object.seal(obj)#

プロパティの追加 / 削除を禁止します。すべての既存のプロパティに configurable: false を設定します。

Object.freeze(obj)#

プロパティの追加 / 削除 / 変更を禁止します。すべての既存のプロパティに configurable: falsewritable: false を設定します。

アクセサプロパティ#

本質的には値の取得と設定のための関数ですが、外部のコードからは通常のプロパティのように見えます。

let obj = {
  get propName() {
    // obj.propName を読み取るときに getter が動作します
  },

  set propName(value) {
    // obj.propName = value を実行するときに setter が動作します
  }
};

getter と setter#

アクセサプロパティは、"getter" と "setter" メソッドで表されます。オブジェクトリテラルでは、getset を使用して表されます:

let user = {
  name: "John",
  surname: "Smith",

  get fullName() {
    return `${this.name} ${this.surname}`;
  },

  set fullName(value) {
    [this.name, this.surname] = value.split(" ");
  }
};

// fullName には指定された値が設定されます
user.fullName = "Alice Cooper";

console.log(user.fullName) // Alice Cooper
console.log(user.name); // Alice
console.log(user.surname); // Cooper

アクセサディスクリプタ#

  • get:プロパティを読み取るときに動作する引数のない関数
  • set:プロパティを書き込むときに動作する単一の引数を持つ関数
  • enumerable:データプロパティと同じ
  • configurable:データプロパティと同じ
let user = {
  name: "John",
  surname: "Smith"
};

Object.defineProperty(user, 'fullName', {
  get() {
    return `${this.name} ${this.surname}`;
  },
  enumerable: true,
  set(value) {
    [this.name, this.surname] = value.split(" ");
  }
});

console.log(user.fullName); // John Smith

for(let key in user) console.log(key); // name, surname, fullName
読み込み中...
文章は、創作者によって署名され、ブロックチェーンに安全に保存されています。