JavaScript로 크롬 앱 만들기 #3

노마드 코더 - 바닐라 JS로 크롬 앱 만들기 #3

✔ 배열 (Array)

• 하나의 variable 안에 데이터의 list를 가지는 것

const nonsense = [1, 2, "'hello", false, null, true, undefined, "heeseung"];

배열의 요소를 추가하려면 push를 쓰면 된다.

const daysOfWeek = ["mon", "tue", "wed", "thu", "fri", "sat"];

// Add one more day to the array
daysOfWeek.push("sun");
console.log(daysOfWeek);

✔ 객체(Object)

• 자바스크립트의 객체 생성은 CSS와 형태가 비슷하다.

const player = {
    name: "heeseung",
    points: 10,
    fat: true,
};

• [ ] 나 " " 대신에 { }, 즉 중괄호를 사용한다.
• 중괄호 안에는 = 대신 :을 사용한다.
• ; 대신 , 를 사용하여 다음 속성을 이어서 표시해준다.

player.fat = false;
player = false; // 에러

• const는 변하지 않는 변수에 대한 선언이라고 했는데, player.fat = false의 결과가 반영이 되는 이유는 const 속성 자체가 아닌 그 속성의 요소에 변화를 주었기 때문이다. 즉, player 자체를 바꾸려 할 때는 에러가 나지만, 그 안의 요소를 바꾸려 할 때는 에러가 발생하지 않는다.

• 사용자가 원하면 어떤 속성이든 추가할 수 있다.

const player = {
    name: "heeseung",
    points: 10,
    fat: true,
};
console.log(player);
player.lastName = "potato";
console.log(player);

{name: 'heeseung', points: 10, fat: true}
{name: 'heeseung', points: 10, fat: true, lastName: 'potato'}