배열과 객체 비교

배열과 객체 비교
배열 안의 값은 요소(element), 객체 안의 데이터 하나하나를 속성(property) 라고 함.
객체의 키는 식별자(숫자로 시작하지 않고 기호는 $와 _만 포함.) 이다.

const object = {
 키:값,
 키:값,
 키:값
}

const cloud = {
name : '구름',
age : 9
}
cloud.name = '태양' // cloud라는 객체의 name이라는 속성값이 바뀐다.
cloud.age = 5  // cloud라는 객체의 age이라는 속성값이 바뀐다.

속성과 메서드.
객체 내부에 있는 함수를 메서드라고 함.

const cloud = {
  name : '구름',
  age : 9
  action : function() {
    console.log(`${cloud.name}이/가 움직입니다.`)
  action2 : () => {
    console.log(`${cloud.name}이/가 사라집니다.`)
    }  
  }
}

cloud.action()
cloud.action2()

※참고사항.
자바스크립트에선 메서드라는 것이 속성의 일종.

this
익명함수에서 this는 자기자신을 나타냄(dog).
화살표함수에서 this는 Window.
익명함수는 객체를 this 바인딩(연결)해주고 화살표함수는 바인딩하지 않는다.
*this 바인딩: this를 현재 객체와 연결하는 것.
**만약 this.을 붙이지않는다면 name이 어디에 속하는 속성인지 확인할 수가 없다.

   const cloud = {
     name : '구름',
     age : 9
     action : function() {
       console.log(`${this.name}이/가 움직입니다.`)
     action2 : () => {
       console.log(`${this.name}이/가 사라집니다.`)
       }  
     }
   }

   cloud.action()
   cloud.action2()

추가 활용.

const object = {
ko: '빵',
en: 'bread',
fr: 'pain',
es: 'pan',
lang: {
ko: '한국어',
en: '영어',
fr: '프랑스어',
es: '스페인어'
},
print: function (lang) {
console.log(`${this.ko}는 ${this.lang[lang]}로 ${this[lang]}입니다.`)
}
}
object.print('es')

객체에 동적으로 속성 추가하기.
처음 만들 때 만드는 것: 정적으로 생성한다.
나중에 만드는 것: 동적으로 생성한다.

// 객체의 키와 값을 정적으로 생성한다.
const cloud = {
  name : '구름',
  age : 7 
}

// 객체의 키와 값을 동적으로 생성한다.
cloud.color = 'skyblue' /*cloud['color']='skyblue'*/
// 갹체의 키와 값을 동적으로 제거한다.
delete cloud.color
/*delete cloud['color']*/