[TIL]JavaScript * 객체의 값을 추가,수정, 삭제하는 방법

객체란

객체는 JavaScript라는 언어만이 가지고 있는 특징의 기초를 이루는 자료형으로,
많은 기능을 내장하고 있습니다.

var result = {name: "soyoon"}

중괄호 '{ }' 안에 key : value 형식으로 프로퍼티를 저장한다.
프로퍼티란 객체에 속한 데이터를 뜻한다.

객체 속성 값을 읽는 방법은 점 표기법(dot notation) 과
대괄호 표기법(bracket notation) 2가지가 있다.

객체의 값을 추가, 수정

🧃 점 표기법 (dot notation)

let obj = {
  fruit : "favorite fruit",
  "favorite fruit" : {
  apple : "first",
  peach : "second",
  banana : "third"
  }
};

// 속성 추가
obj.stock = 100;
console.log(obj.stock);  //  100

// 속성 값 변경
obj.fruit = "soyoon";
console.log(obj.fruit);  //  "soyoon"

console.log(obj);

/*  favorite fruit: {
    apple: "first",
    banana: "third",
    peach: "second"
  },
  fruit: "soyoon",
  stock: 100
}
*/

🧃 대괄호 표기법 (bracket notation)

let obj = {
  fruit : "favorite fruit",
  "favorite fruit" : {
  apple : "first",
  peach : "second",
  banana : "third"
  }
};

// 속성 추가
obj["stock"] = 100;
console.log(obj["stock"]);//  100

// 속성 값 변경
obj["fruit"] = "soyoon";
console.log(obj["fruit"]); //  "soyoon"

console.log(obj);

/*  favorite fruit: {
    apple: "first",
    banana: "third",
    peach: "second"
  },
  fruit: "soyoon",
  stock: 100
}
*/

dot notation 은 key값이 동적으로 변할 때 사용에 한계가 있으며,
숫자로 시작할 수 없고, 변수를 포함할 수 없음.
bracket notation 은 key값이 변수일 때 주로 사용하며
숫자, 변수, 공백 모두 사용할 수 있음.

let obj = {
	cat: 'meow',
	dog: 'woof',
};

let dog = 'cat';			
let sound = obj.dog;			

console.log(sound); // woof	

//dot notation 을 사용했을 때, 변수를 포함하지 못함.

let obj = {
	cat: 'meow',
	dog: 'woof',
};

let dog = 'cat';			
let sound = obj[dog];			

console.log(sound); // meow	

//bracket notation 을 사용했을 때, 변수를 포함했음.

객체의 값을 삭제

객체의 속성을 삭제할 때는 delete 연산자를 사용.
dot notation, bracket notation 모두 사용 할 수 있음.

• delete obj.id;
• delete obj.product['product type']);

let obj = {
  cat: 'meow',
  dog: 'woof',
  duck: 'quack',
  cow: 'moo',
};

delete obj.cat;
console.log(obj); // cow: "moo", dog: "woof", duck: "quack"

delete obj['dog'];
console.log(obj); //  cat: "meow", cow: "moo", duck: "quack"

delete써서 ‘array’의 특정 ‘index’를 지워버리면 그 자리가 ’empty’가 됨.

let obj = [
  {cat: 'meow'},
  {dog: 'woof'},
  {duck: 'quack'},
  {cow: 'moo'}]

delete obj[0];
console.log(obj);

/*
[undefined, {dog: "woof"},
{duck: "quack"},{cow: "moo"}]
*/