TIL : Javascript Object

군밤먹으면서코딩·2021년 5월 19일
0

javascript

목록 보기
7/16
post-thumbnail

Object

  • javascript의 데이터 타입 중 하나!
  • 모든 javascript의 객체는 Object를 상속해 모든 속성과 메서드를 사용할 수 있다.
  • 요약하자면, Object(객체)는 프로퍼티들의 집합!

생성 방법

const obj1 = {}; // objet literal 방식
const obj2 = new Object{}; // object constructor 방식

Computed properties

  • 문법
const Person  = {
  name : 'gyong',
  age : 20
}

console.log(Person.name);
console.log(Person['name']);

Object의 'key'값을 어떻게 하면 변수값으로 넣을 수 있을까?!

function printValue(obj,key){
	console.log(obj[key])
}

printValue(Person,'name');
  • 이 때 주의 할 점은 key값이 반드시 String 으로 들어가야 한다는 점!

in 연산자

특정 key값이 해당 Object에 존재하는가? T/F 반환

// in operator
console.log("name" in Person);
console.log("age" in Person);

for...in vs for....of

for (key) in (object)

for (value in Person) {
    console.log(value);
}
  • 위의 구문에 of를 넣으면 에러가 발생한다.
  • for...in 구문은 객체를 탐색

for (key) of (iterable)

const array = [1, 2, 3, 4, 5];
///for of
for (value of array) {
    console.log(value);
}
  • for...of 구문은 배열을 탐색!!

cloning

const user = {name:'gyong', age = 20};
const user2 = user

위 구문의 경우, user2는 user와 같은 레퍼런스(주소)를 가리키게 되어, 어느 쪽의 값이 바뀌게 되면, 같은 주소를 공유하는 user나 user2의 값도 바뀌게 된다.

  • 메모리 주소(레퍼런스가)가 아닌 값을 복사하고 싶다면!?
const user = { name: "gyong", age: 20 };
const user2 = user;
const user3 = Object.assign({}, user);
console.log(user3);

주의점!!

  • 중복된 key값을 clone 하려 할 경우, 더 나중에 적용된 key의 value값이 clone 된다는 것 명심!

  • 즉, 아래의 예제 에서는 color : 'yellow'가 결과값으로 찍힐 것이다!

const one = { color: "blue" };
const two = { color: "yellow", sky: "blue" };

const three = Object.assign({}, one, two);

console.log(three);

0개의 댓글