자바스크립트 배열(Array)과 객체(Object)

객체(Object)

객체를 표현 할 때에는 중괄호 {}를 감싸서 나타냅니다.

객체에는 key(속성명)와 value(속성값)으로 구성되어있습니다.

여러 속성을 추가 할 때에는 쉼표 , 으로 구분합니다.

key(속성명)는 문자열만 가능하고 따옴표가 필요 없지만 따옴표가 필요한 경우도 있습니다.속성명에 공백이 필요할 경우인데 그럴 경우는 잘 없는것 같습니다.

속성값은 다른 변수를 받아오는 값이 아닌 문자열을 넣는다면 따옴표를 붙여줘야 합니다. 숫자형이나 부울형은 따옴표가 필요 없습니다.

let person = {
  // 속성명 : 속성값
  name: "kim",
  age: 30,
  status: false,
  "my city": "busan",
};

다른 변수를 받아온다는 말은 다른 변수의 값을 가지고 온다는 의미 입니다.

let name = "kim";

let person = {
  // 속성명 : 속성값
  name: name, //kim
  age: 30,
  status: false,
};

es6 문법 부터는 key(속성명)과 속성값(value)의 이름이 같으면 속성값을 넣지 않아도 됩니다.

let person = {
  // 속성명 : 속성값
  name,
  age: 30,
  status: false,
};

person 객체의 속성에 접근하려면 마침표 .으로 구분합니다.

let person = {
  // 속성명 : 속성값
  name,
  age: 30,
  status: false,
};

console.log(person.name); //kim

객체의 속성값을 바꾸는 법은 객체의 속성에 접근해서 변경 할 수 있습니다.

let이 아닌 const를 사용해도 객체의 속성에 접근해서 변경 할 수 있습니다.

const는 원시타입인 문자형(string), 숫자형(number), 부울형(boolean)은 재할당할 수 없습니다.

let person = {
  // 속성명 : 속성값
  name,
  age: 30,
  status: false,
};

person.name = "jung";

console.log(person.name); //jung

배열을 표현 할 때에는 대괄호 []로 감싸서 나타냅니다.

배열에는 문자열(string), 숫자형(number), 부울형(boolean)등이 들어가지만 객체도 들어갈 수 있습니다.

let personArray = ["kim", 30, false];

let personObject = [
  {
    person: "kim",
    age: 30,
    status: false,
  },
];

배열 안에 있는 것들을 요소(item)이라고 부르며 객체의 속성처럼 쉼표 , 으로 구분합니다.

배열과 객체의 차이는 key(속성명)입니다. 배열은 key(속성명) 없이 그냥 값만 순서대로 나열되어있습니다.

배열의 요소에 접근할 때에는 몇번째 요소인지 숫자를 붙여주면 됩니다. 배열에서는 속성명이 없을 뿐 이 숫자가 key가 되는 셈입니다. 숫자를 붙일 때에는 왼쪽에서 0으로 시작합니다. 위의 예제에서 kim은 0 이고 30은 1이고 false는 2입니다.

console.log(personArray[0]); // kim
console.log(personArray[1]); // 30
console.log(personArray[2]); // false

배열도 마찬가지로 해당 요소에 접근해서 값을 재할당 할 수 있습니다.

personArray[0] = "jung";
personObject[0].person = "park";

console.log(personArray[0]); // kim
console.log(personObject[0].person); // park

personObject의 key가 0인 이유는 personObject의 요소는 하나밖에 없기 때문입니다. 요소를 더 추가 하려면 중괄호를 하나더 만들면 됩니다.

const personObject = [
  {
    person: "kim",
    age: 30,
    status: false,
  },
  {
    person: 'lee',
    age: 20,
    status: true
  }
];

이렇게 하면 두번째 중괄호는 personObject [1]이 됩니다.

객체와 마찬가지로 배열도 let이 아닌 const로 선언해도 재할당이 가능합니다.