ブリーフは純白

ブリーフをかぶった変態の独り言。インデザインや組版、デザインとか色とか、そういう界隈のこと。

【Javascript勉強中】Object.definePropertiesとObject.definePropertyの違い

オブジェクトのプロパティの属性を変更したりするところで躓きました。

Object.defineProperties(オブジェクト,{
    プロパティ1:{
        configurable:false,
        enumerable:false,
        writable:true,
        value:"値1"},
   プロパティ2:{
        configurable:true,
        enumerable:true,
        writable:false,
        value:"値2"}
})

「configurable」の挙動がよくわからなかったんで、こいつはスルーします。

 

↑のように書くと、

console.log(Object.keys(オブジェクト))

で「プロパティ1」は列挙されなくなりました。

オブジェクト.プロパティ1="上書きした値1"
オブジェクト.プロパティ2="上書きした値2"

で値を上書きしてconsole.log(オブジェクト)でコンソール上に出力すると、「プロパティ1: "上書きした値1", プロパティ2: "値2"」と出力されて、「writable」で「true」としたプロパティ1の値が上書きされました。

なるほど、ふむふむ…?

次に、Object.definePropertyを書いてみましたがエラーになってうまくいかなかったので、原因を調べて、Object.definePropertiesとの違いをまとめました。

原因は参考書の書き方にあった。

f:id:bliblibli-fu:20210916110628p:plain

最初の行が「let オブジェクト={}」になっているのが諸悪の根源でした。

「Object.defineProperty」はすでに指定されているプロパティに対して属性を設定するようです。

この書き方だと空のオブジェクトを上書きできると思いますよね??

確かにObject.definePropertiesはオブジェクトが空でも使えました。

Object.definePropertyは先にプロパティがないと使えないということが分かってよかったです。

また、思わず朱書きしちゃったけど、プロパティ名はダブルクォテーションで囲んでカンマ区切りにしないといけないみたいです。

あと、Object.definePropertiesも、Object.definePropertyも、先にオブジェクトに内容をちゃんと書いておけば「value」の指定は上書きしない限り書かなくてもいいみたいです。