JS Obejct의 key와 value 값 수정 및 추가하기

Joah·2022년 5월 29일
0

Javascript

목록 보기
4/16
post-thumbnail

array는 index로, object는 key로 값 또는 요소에 접근한다.

const arr = [1,2,3,"안녕","567",[8,9],10];
const obj = {
	number: 123,
  	hello: "안녕",
  	array: [8,9]  
};

//arr의 요소 "567"을 가져오기
console.log(arr[4]);
//"567"

//obj의 값 "안녕"을 가져오기
console.log(obj.hello)
console.log(obj["hello"])
// "안녕" => 둘 다 같은 결과
  • arr는 배열이기 때문에 index number로 요소에 접근한다.
  • obj는 객체이기 때문에 key 이름으로 value에 접근한다.


프로퍼티 할당

const jessica = {
	name: "Jessica",
  	position: ["sever", "hall manager"],
  	age: 31,
  	fulltime: true
}

이미 존재하는 key에 다른 value(값) 할당하기

jessica["name"] = "Jessy"
jessica.name = "Jessy"

console.log(jessica)
/*[object Object] {
  age: 31,
  fulltime: true,
  name: "Jessy",
  position: ["sever", "hall manager"]
}*/
  • 첫 번째 코드는 대괄호 표기법으로 jessica 변수에 이미 존재하는 name이라는 key의 값을 "Jessica"에서 "Jessy"로 변경
  • 두 번째 코드는 점 표기법으로 위의 코드와 동일하게 value의 값을 변경하여 할당함

이전에 없던 key로 접근하여 새로운 {key:value} 추가

jessica["todayDuty"] = "divide tips"
jessica.todayDuty = "divide tips"

console.log(jessica)
/*[object Object] {
  age: 31,
  fulltime: true,
  name: "Jessy",
  position: ["sever", "hall manager"],
  todayDuty: "divide tips"
}*/
  • {key:value}를 한 번에 지정할 수 있다.
  • 만약 key만 생성하고 value를 할당하지 않으면 해당 key를 출력했을 때 undefined값을 가진다.
  • todayDuty라는 key를 생성하여 divide tips라는 value를 할당하였다.

delete로 프로퍼티 {key:value} 삭제

delete jessica.age
delete jessica["age"]

console.log(jessica)
/*[object Object] {
  fulltime: true,
  name: "Jessy",
  position: ["sever", "hall manager"],
  todayDuty: "divide tips"
}*/
  • delete 키워드를 사용하여 object에 접근해 property를 삭제할 수 있다.


const는 값이 변하지 않는 상수라고 알고 있는데 어떻게 객체의 {key:value} 수정하고 추가하고 삭제할 수 있지..?

다음 포스트에....

profile
Front-end Developer

0개의 댓글