TIL - 11. Object


1.objectバー


名前(key)と値(value)で区切られたPropertyの集合.

かっこを使用すると、各プロパティ(プロパティ)の名前(キー)が重複しません.(値は重複可能)
例)
let plan1 = {
 name: "Basic",
 price: 3.99,
 space: 100,
 transfer: 1000,
 pages: 10
};
オブジェクトplan 1には5つのProperty(property)があり、名前(キー)はname、price、...、ページ、値は「基本」、3.99、...、10までです.

1-1. オブジェクトの属性値(value)でアクセスするには

let plan1 = {   
  name: "Basic"
};
console.log(plan1.name);
console.log(plan1["name"]);
  • オブジェクト名.key -> dot(.) notation
    オブジェクトの名前を入力します.
  • オブジェクト名[[キー]->かっこ記号
  • キー値の変数を設定適用する場合、
  • キーの値で数字を書き込む場合は
  • です.
    上記の2つの方法を用いる
    let plan1 = {   
      name: "Basic"
    };
    let propertyName = "name";
    console.log(plan1[propertyName]);
    //console.lg(plan1.propertyName); -> 불가능
    カッコ記号を使用してキー値を変数名に設定できます
    dot notatoinは不可能です

    1-2. 属性値(value)を割り当てるには

    difficult[name] = '값 바꾼다';
    console.log(difficult[name]);
    // 객체에 이미 키가 존재하는데, 다시 한 번 할당하면 값이 교체(수정)된다.
    
    difficult.color = '색깔';
    console.log(difficult.color);
    //이전에 없던 키로 접근하면, 새로운 프로퍼티가 추가 된다.
    
    console.log('생성전: ' + difficult.new);
    difficult.new = '새로 추가된 프로퍼티';
    console.log('생성후: ' + difficult.new);
    //아직 없던 키에 접근하면 프로퍼티를 추가할 준비는 되어있지만, 값이 없다.

    2.方法(方法)


    オブジェクトに格納されている値が関数である場合をメソッドと呼びます.
    let methodObj = {
      do: function() {
        console.log('메서드 정의는 이렇게');
      }
    }
    メソッドの定義方法
    methodObj.do();
    メソッド呼び出しメソッド

    3.ネストされたオブジェクト


    ビジネスで使用されるオブジェクトはほとんど重複しています.
    コンフィギュレーション値は、オブジェクトであってもよいし、コンフィギュレーション値の配列の要素であってもよいし、オブジェクトであってもよい.
    //예시
    let nestedObj = {
    	type: {
    		year: '2019',
    		'comment-type': [{
    			name: 'simple'
    		}]
    	}
    }
    「simple」を出力する方法
    console.log(nestedObj.type['comment-type'][0].name);

    4.オブジェクトは参照として保存されます。


    オブジェクトを変数に保存すると、オブジェクト自体ではなく参照が格納されます.
    逆に、変数にテキストを保存すると、テキスト自体が保存されます.したがって、同じテキストを比較演算すると、互いの値は同じであるためtrueとなる.
    const a = '안녕';
    const b = '안녕';
    console.log(a === b);
    aとbは同じテキストを含むのでtrueを返します.
    const hiObj = { 
      name: '안녕' 
    };
    const helloObj = {
      name: '안녕'
    };
    console.log('객체비교 =>', hiObj === helloObj);
    hiobjとhelloobjの表面には同じ内容が含まれているように見えますが、オブジェクトが各メモリに格納されている参照のためfalseが返されます.
    コメント画像)

    でも.
    console.log('객체값비교 =>', hiObj.name === helloObj.name);
    これにより、比較オブジェクトのプロパティ値(value)はtrueを返すことができます.

    5.オブジェクトのキーを変数としてアクセスする方法

    const information = {
      name: '김개발'
    }
    オブジェクトを作成し、キーと値を割り当てた場合.
    const verb = 'developes'
    const project = 'facebook'
    これらの変数によって作成された設定をキーと値にすると
    information[verb] = project // [A]
    information.developes = 'facebook' // [B]
    [B]の方法この場合,キーと値は常に固定される.
    [A]の手法では,変数動詞とprofectが持つ値に応じて,他のキーと異なる値を持つことができる.

    6.オブジェクトを巡回する


    オブジェクトには順序がなく、キーでのみアクセスできます.
    しかしながら、オブジェクト内のすべてのキーにアクセスするために、様々な理由でコードを記述する必要がある2つの方法がある.

    6-1. Object.keys()


    Object.keysメソッドは、オブジェクトが持つキーリストを「配列」に戻す方法です.
    使用方法)
    const obj = {
      name: 'melon',
      weight: 4350,
      price: 16500,
      isFresh: true
    }
     
    Object.keys(obj) // ['name', 'weight', 'price', 'isFresh']
    Object.keysメソッドが返す値は配列なので、繰り返して使用できます.
    const keys = Object.keys(obj) // ['name', 'weight', 'price', 'isFresh']
     
    for (let i = 0; i < keys.length; i++) {
      const key = keys[i] // 각각의 키
      const value = obj[key] // 각각의 키에 해당하는 각각의 값
      console.log(value)
    }
    その他にObjectもありますvalues, Object.エントリもあります.
    const values = Object.values(obj)
    // values === ['melon', 4350, 16500, true]
     
    const entries = Object.entries(obj)
     
    /*
    entries === [
      ['name', 'melon'],
      ['weight', 4350],
      ['price', 16500],
      ['isFresh', true]
    ]
    */
    

    6-2. for-in


    反復文for文と同様の構文ですが、ES 6に追加されたオブジェクトと配列に特化した構文です.
    オブジェクトを巡回するだけでなく、通常のアレイを巡回する場合にも便利です.
    const arr = ['coconut', 'banana', 'pepper', 'coriander']
    
    for (let i = 0; i < arr.length; i ++) {
      console.log(i)
      console.log(arr[i])   // 기존의 for문
    }
    
    for (let i in arr) {
      console.log(i)
      console.log(arr[i])   // 새롭게 추가된 for-in문
    }
    コードを省略する構文は、例えばiを0に初期化し、配列長と比較し、iを1インクリメントする.
    const obj = {
      name: 'melon',
      weight: 4350,
      price: 16500,
      isFresh: true
    }
    
    for (let key in obj) {
      const value = obj[key]
    
      console.log(key)
      console.log(value)
    }
    これにより、オブジェクトには、数値ではなくオブジェクトのキーに対応する文字列も割り当てられます.