201031_TIL

오늘한 일

• Javascript Koans 05_Types-part2 ~ 06_Array 복습
• 07_Object ~ 08_SpreadSyntax 풀기
• primitive data type(원시 자료형, 원시값) / ex. string, number, bigint, boolean, undefined, symbol
• Non-primitive data type(기본이 아닌 데이터 유형, 복합 데이터 유형) / ex. Object, Array, function
• call by value 와 call by reference / deep copy 와 shallow copy 고민해보기

 

오늘 느낀점

• 원시 자료형은 값 자체에 대한 변경이 불가능(immutable)하다.
• 원시 자료형은 변수의 크기가 고정되어 있다.

const num1 = 123;
const num2 = 123456789;

// 변수의 값은 num1 < num2 이지만, 두 변수의 크기는 같다.

 

• 원시 자료형을 변수에 재할당할 경우, 값 자체의 복사가 일어난다.

let overTwenty = true;
let allowedToDrink = overTwenty;

overTwenty = false;

console.log(overTwenty);  // false
console.log(allowedToDrink);  // true

 

• 자바스크립트에서 primitive data type 이 아닌 자료 데이터 유형은 모두 Object 이다. Object 는 변수의 크디가 동적(dynamic) 으로 변한다. 이 때문에 Object 의 데이터 자체는 별도의 메모리 공간(heap)에 저장된다. 그리고 이 데이터가 위치한 곳(메모리 상 주소)을 가리키는 주소가 변수에 저장된다. 데이터는 별도로 관리되고, 우리가 직접 다루는 변수에는 주소가 저장되기 때문에 reference type 이라고 한다. Object 자료형의 변수는 실제 데이터가 저장된 주소를 가리킨다(refer), 즉 참조(reference) 한다. 따라서 Object 자료형을 변수에 할당할 경우, 값(데이터)의 '주소'가 저장된다.
• Object 자료형 데이터는 heap에 저장되고, 변수에 할당 할 경우 변수에는 주소가 저장된다.
• Object 를 함수의 인자(매개변수)로 전달할 경우, reference 로 전달된다(deep copy). / 하지만 Object.assign() 을 통한 복사는 얕은 복사(shallow copy) 이다.
• toBe()는 주소값을 비교하고, toEqual() 은 데이터 값을 비교한다.
• ...spread operator(전개 연산자) 는 배열의 원소를 분해해서 개별 요소로 만들어준다.

let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let concatArr = [...arr1, ...arr2];  // arr1.concat(arr2);

console.log(concatArr);  // [1, 2, 3, 4, 5, 6]

 

• Rest Parameter는 인자의 수가 정해져 있지 않은 경우에도 유용하게 사용할 수 있다.

function sum(...nums) {
  let sum = 0;
  for (let i = 0; i < nums.length; i++) {
    sum = sum + nums[i];
  }
  return sum;
}

sum(1, 2, 3);  // 6
sum(1, 2, 3, 4);  // 10

 

• arguments를 통해 '비슷하게' 함수의 인자들을 다룰 수 있다(spread syntax 도입 이전). arguments는 모든 함수의 실행 시 자동으로 생성되는 '객체'이다. / argumetns와 rest parmeter를 통해 배열로 된 인자(args)의 차이는 rest parmeter는 이터러블하다(Symbol(Symbol.iterator)). rest parmeter는 Array 이고, arguments는 Object 이다.

function getAllParamsObj() {
  return arguments;
}

let argObj = getAllParamsObj(1, 2, 3, 99);
console.log(argObj);  // [1, 2, 3, 99];