NBC - JS 1주차 강의 정리 : 객체, 배열

 

객체

1. 객체 생성 방법

 

1-1. 기본적인 객체 생성 방법

let person = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};

 

1-2. 생성자  함수를 이용한 객체 생성 방법

function Person(name, age, gender) {
  this.name = name;
  this.age = age;
  this.gender = gender;
}

let person1 = new Person("홍길동", 30, "남자");
let person2 = new Person("홍길순", 20, "여자");

 

 

2. 접근하는 방법

console.log(person.name);
console.log(person2.name);

 

 

3. 객체 메소드

객체가 가진 여러가지 기능 : Object.~

 

3-1. Object.key() : key를 가지고 오는 메소드

3-2. Obkect.values() : value를 가지고 오는 메소드

3-3 entreis : key와 value를 묶어서 배열로 만드는 배열 (2차원 배열)

let keys = Object.keys(person);
// ["name", "age", "gender"]

let values = Object.values(person);
// ["홍길동", 30, "남자"]

let entries = Object.entries(person);
// [["name", "홍길동"],["age", 30] ["gender", "남자"]]

 

 

3-4. assign : 객체 복사

let newPerson = {};
Object.assign(newPerson, person);
// newPerson에 person 값이 들어감
Object.assign(newPerson, person, { age: 31 });
// person 값이 들어오지만 age만 바뀜

 

 

3-5. 객체 비교

객체나 배열은 메모리에 저장할 때 별도의 공간에 저장하기 때문에 key와 value 값이 같더라도 같지 않음

let person1 = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};

let person2 = {
  name: "홍길동",
  age: 30,
  gender: "남자",
};
console.log(person1 === person2); //false 출력

console.log(JSON.stringify(person1) === JSON.stringify(person2));
// true (문자열화 시키는 stringify)

 

 

3-6. 객체 병합

let person1 = {
  name: "홍길동",
  age: 30,
};

let person2 = {
  gender: "남자",
};

let perfectMan = { ...person1, ...person2 }; //
console.log(perfectMan); // { name: '홍길동', age: 30 }

 

 

---

 

 

배열

 

1. 생성

1-1. 기본적인 배열 생성

let fruits = ["사과", "바나나", "오렌지"]

 

1-2. 크기 지정

let number = new Array(5);
// [5 empty items] 출력

 

 

2. 요소접근

인덱스로 접근

console.log(fruits[0]); 
// "사과" 출력

 

 

3. 배열 메소드

3-1. push

let fruits = ["사과", "바나나"];

fruits.push("오렌지");
console.log(fruits); // [ '사과', '바나나', '오렌지' ]

 

 

3-2. pop

마지막 요소 삭제

let fruits = ["사과", "바나나", "오렌지"];
fruits.pop();

console.log(fruits); // [ '사과', '바나나' ]

 

 

3-3. shift()

첫번째 요소 삭제

let fruits = ["사과", "바나나", "오렌지"];
fruits.shift();

console.log(fruits); // [ '바나나', '오렌지' ]

 

 

3-4. unshift

맨 앞에 추가

let fruits = ["사과", "바나나", "오렌지"];
fruits.unshift("키위");

console.log(fruits); // [ '키위', '사과', '바나나', '오렌지' ]

 

3-5. splice

요소 바꾸기

let fruits = ["사과", "바나나", "오렌지"];
fruits.splice(1, 1, "귤"); // 1번 인덱스에서 시작해서 첫번째 것만 "귤로 바꿔줘"

console.log(fruits); // [ '사과', '귤', '오렌지' ]

 

3-6. slice

해당 요소만 남기기

let fruits = ["사과", "바나나", "오렌지", "키위"];
let slicedFruits = fruits.slice(1, 3); // 1번 인덱스부터 시작해서 3번 인덱스 전까지
console.log(slicedFruits); // ['바나나', "오렌지"]