[JS] 객체

객체 개요

• 객체도 배열처럼 일종의 구조에 데이터 값들을 저장할 수 있는 자료형입니다.
•  선언법
  • 생성자 호출 : let person = new Object();
  • 객체 리터럴 : let arr = {};

• 배열과 달리 데이터 순서(order)가 아닌 **키(key)-값(value)**의 쌍으로 이루어진 프로퍼티를 이용해 데이터를 저장한다.
• 프로퍼티는 순서나 우선순위가 없다.
• 배열과 마찬가지로 어떤 자료형을 넣든 상관없다.
• key값 중복시키는 거 지양

객체 리터럴 생성하기

• 객체 리터럴은 중괄호 {} 를 써서 만드는 키-값 쌍으로 저장되는 데이터 구조를 의미한다.
  • 객체라는 말은 좀 더 범용적으로 쓰인다.
  • typeof [] 가 Object로 나왔던 것을 생각하기
• 각 프로퍼티는 쉼표 , 로 구분한다.

const person = {

    name: "hong",
    
    age: 28,
    
    favorite: ["baseball", "music"]
    
};

 

객체 외부 데이터에 액세스 하기

점 표기법

• 점 구문 쓰기 object.key
  • object객체의 property의 key값의 value에 접근.

대괄호 표기법

• 대괄호와 큰따옴표 쓰기 object["key"]
• 대괄호 안에 표현식을 넣을 수 있다.
• 대괄호 내에서 따옴표로 감싼 이름은 프로퍼티 키로 해석되고, 감싸지 않은 이름은 식별자로 해석된다.
• 동적으로 프로퍼티에 접근할 때는 따옴표로 감싸지 않는다.
• 객체에서 만드는 모든 키들은 문자열로 변환된다. (기호 제외)

const person = {firstName : "Jo", lastName : "jaehong"};

console.log(person); // {firstName : 'Jo', lastName : 'jaehong'}

console.log(person['firstName']); // 'Jo'

console.log(person['firstName']); //error

console.log(person.firstName); // 'Jo'

console.log(person['first'+'Name']); //'Jo'

 

const restaurant = {

    name: 'Ichiran Ramen',
    
    address: `${Math.floor(Math.random() * 100) + 1} Johnson Ave`,
    
    city: 'Brooklyn',
    
    state: 'NY',
    
    zipcode: '11206',
}

//YOUR CODE GOES DOWN HERE:

const { address, city, state, zipcode } = restaurant;

const fullAddress = `${address}, ${city}, ${state} ${zipcode}`;

 

프로퍼티 수정/ 추가하기

• 배열도 키가 숫자인 객체로 생각할 수 있다.
• const로 객체를 선언해도 property 수정/ 추가 가능
  • 객체의 object를 수정하는 행위지 객체 자체를 수정하는 게 아니기 때문

let person = {

    name: "hong",
    
    age: 28,
    
    pet: "cat",
    
};

person.age = 29;

person["pet"] = "dog";

console.log(person); // {name: "hong", age: 29, pet: "dog"}

프로퍼티 삭제하기

• delete 이용해서 삭제 가능 delete person.name delete person["name"]
• delete를 사용하는 방법은 객체와 프로퍼티 간의 연결을 끊을 뿐 메모리에서 삭제되진 않음
• person.name = null; 과 같은 방법을 더 추천함 (메모리까지 삭제)

let person = {

    name: "hong",
    
    age: 28,
    
    pet: "cat",
    
};

delete person.pet;

delete person["age"];

console.log(person); //{ name : "hong" }

배열과 객체 네스트 구성하기

• 배열 안에 객체를 넣을 수도 있고, 객체 안에 배열을 넣을 수도 있다.
• json

const countries = [

	{
    
    	name: 'Korea',
        
        capital: 'Seoul'
        
	},
    
    {
    
    	name: 'Japen',
        
        capital: 'Tokyo'
        
    }
    
]

console.log(comments[1]); // {name : 'Japen', capital : 'Tokyo'}

console.log(comments[0].name); // 'Korea'

프로퍼티가 객체에 존재하는지 확인하기

• in 연산자 활용

const person = {

	name : hong,
    
	age : 28,
    
};

console.log(`${"name" in person}`}; //true

console.log(`${"name" in person}`}; //true

console.log(`${"gender" in person}`}; //false