TIL 06/05/21 (Tip of coplit,spread,rest)

How to solve the problem :
1. After read a problem, imaginning it like a picture.
2. Put input and output and then must know the result and be able to write in pseudo code.
3. Writing a code.

spread syntax (전개구문) - shallow copy(얕은복사)
배열을 벗기고 요소를 전달

const arr = [1,2,3];
const max = Math.max(arr) //arr = [1,2,3]
console.log(max) //NaN

const max2 = Math.max(...arr);// arr = 1,2,3
console.log(max2) //3

before

used Function.prototype.apply
배열을 벗기고 요소를 전달

let max4 = Math.max.apply(null, arr); //arr = 1,2,3
console.log(max4); //3

warning : result of spread syntax is not value.
오직 쉼표로 구분한 값의 목록을 사용하는 문맥에서만 사용 가능
-함수 호출문의 인수 목록
-배열 리터럴의 요소 목록
-객체 리터럴의 프로퍼티 목록

const list = 1,2,3 // Uncaught SyntaxError: Unexpected number
const list1 = ...[1,2,3]// Uncaught SyntaxError: Unexpected token '...'
const list3 = [1,2,3] //correct!!!

Warning with Rest parameter!!!!

it is the opposite means with spread syntax!

Compare between Rest parameter and Spread syntax

Rest parameter : 1,2,3 => [1,2,3]
Spread syntax : [1,2,3] => 1,2,3

function sum() {
  console.log(arguments) {length:4, '0':1, '1':2, '2':4, '3':5}
//유사배열 객체인  arguments객체를 배열로 변환 call을 사용해서
 let array = Array.prototype.slice.call(arguments);//args나 value는 안됨 
   return array.reduce(function(pre,cur) {
     return pre + cur
    }, 0);
   }
   console.log(sum(1,2,4,5)) // 12

function sum(...values) {//꼭 args라고 변수명을 할 필요는 없다 '...' 이 중요
return values.reduce((pre,cur) => pre + cur, 0);
}
console.log(values) //[1,2,4,5]

console.log(sum(1,2,4,5)) // 12

reference : Mordern javascript deep dive(book)