[개인학습 시작 2일차] 객체, 배열

React 입문 복습

 

객체 : key-value 

JSON : JavaScript Object Notation 

const user = {
   name : "르탄이",
   age : 30,
   isAdmin: true,
};

 

// 접근

 ● 괄호 표기법

const attribute = "name";

console.log(user[attribute]); 

● 점 표기법

console.log(user.name); 

console.log(user.age);

 

user.email = "jay@gmail.com"; // 추가

user.age = 31; // 수정

delete user.isAdmin; // 삭제

불변성이 깨짐

불변성을 유지하는 것은 중요하다

 

● const keys = object.keys(user); // keys 를 뽑을 때

  = [ 'name', 'age', 'isAdmin' ]

● const values = object.values(user); // values 를 뽑을 때

  = [ '르탄이', 30, true ] 

● const entries = object.entries(user); // key와 value 를 쌍으로 뽑을 때

  = [ [ 'name, '르탄이' ], [ 'age', 30 ], [ 'isAdmin', true] ]

● const userDetails = {

        occupation: "개발자",

};

object.assign(user, userDetails); // 기존에 있던 객체에 다른 객체를 추가할 때

 = { name, '르탄이', age : 30, isAdmin: true, occupation: '개발자' }

---

배열

const number = [1, 2, 3];

 

console.log(number[1]); // 접근

number[1] = 10; // 수정

const fruits = [ "Apple", "Banana"]; 

 

● fruits.push("Orange"); // 추가

● fruits.pop(); // 배열의 마지막 요소 삭제

const numbers = [1, 2, 3, 4, 5]; 

 

● map : 배열 내의 모든 요소 각각에 대해 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환

const squared = numbers.map(function(num) {

         return num * num; 

});  

// [1, 4, 9, 16, 25]  return 필수

● filter  

const evenNumbers = numbers.filter((num) => {

       return num % 2 === 0;

});

// [2, 4] 

● reduce : 배열의 각 요소에 대해서 주어진 함수를 실행하고 결과물을 누적해서 반환

numbers.reduce(function(누적된값, 일반값) {

     return  누적된값 + 일반값

});

// 1 2 / 3 3 / 6 4 / 10 5  

● sort : 정렬을 위한 함수 (원본배열을 바꾼다, 불변성이 깨진다)

const fruits = ["Banana", "Orange", Apple", "Mango"];

// [ 'Apple', 'Banana', 'Mango', 'Orange']  

 

const numbers = [40, 100, 1, 5, 25];

numbers.sort(); // [1, 100, 25, 40, 5];

 

numbers.sort(function (a, b) {

     return a - b; (b - a)

});

// [1, 5, 25, 40, 100]

// [100, 40, 25, 5, 1]