[자바스크립트] 수업시간 스프레드, 디스트럭트, Map, set

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

//배열이 로그로 [1,2,3,4,5]
console.log(arr);
//1,2,3,4,5
console.log(...arr);
const obj = {
    id:1, name:'홍길동'
};
// console.log(...obj);

let max = Math.max(...arr);
console.log(max);
console.log(   Math.max(1,2,3,4)   );

//서로 다른 두개의 배열을 합칠 때 주로 많이 사용된다.
//es5
var newarr = arr.concat([6,7]);
//이렇게 찢어서 넣을 수도 있음.
const newarr2 = [...arr,...[6,7]];
console.log(newarr);
console.log(newarr2);
// 객체에서도 이렇게 사용가능
const obj1 = {
    age : 13,
    name : 'haha'
}
const obj6 = {
    ...obj1,
    kill : 15
}
console.log(obj6);

 

 

//////////////디스트럭쳐링
const arr = [31, 47, 80];
const[a,b,c] = arr;
console.log(a);
console.log(b);
console.log(c);
//매개변수를 비구조화 할당으로 선언
const add = ([num1, num2, num3])=>{
    return num1+num2+num3;
}
const sum = add(arr);
console.log(sum);
//비구조화 할당의 기준은 인덱스
//인덱스 기준으로 순서대로 할당되고 변수의 개수와 요소의 개수를 맞춰줄 필요는 없다.
const minus = ([num1, num2])=>{
    return num1-num2;
}
//31 47만 사용. 80은 사용하지 않음.
const minu = minus(arr);
console.log(minu);
//rest파라미터와 함께 사용 가능.
const arr2 = [12,2,2,5,24];
const mul = ([num1, num2, ...rest])=>{
   console.log(rest);
    return num1*num2;
};
console.log(mul(arr2));
const haha = [1,2,3,4];
const mul2 = ([num1, num2, ...rest])=>{
    const num3 = rest.reduce((x,y)=>x*y,1);
    return num1*num2*num3;
};
console.log(mul2(haha));

 

 

const car = {
    price : 100000,
    color : 'red',
    model : '아반떼',
    company: '현대'


};
const {price, color, model, company} = car;
console.log(company);
console.log(model);
console.log(price);
const z = [1,2,3,4,5];
 [a,b,c,d,e] = z;
console.log(a,b,c,d,e);
const cararr = [

    {
        id: 1,
        price : 100000,
        color : 'red',
        model : '아반떼',
        company: '현대'

    },
    {
        id: 2,
        price : 500000,
        color : 'blue',
        model : 'lambor',
        company: 'kia'

    },
    {
        id: 3,
        price : 200000,
        color : 'gold',
        model : '아반dung',
        company: '현대ai'

    },
    {
        id: 4,
        price : 100000,
        color : 'red',
        model : '아반떼',
        company: '현대'

    },
    {
        id: 4,
        price : 100000,
        color : 'red',
        model : '아반떼',
        company: '현대'

    }


]

const [car1, car2, car3,...rest] = cararr;
console.log(car1);
console.log(car2);
console.log(car3);
console.log(rest);
//특정객체의. 세번째 객체의 id를 가져오기
const [,,{id}] = cararr;
console.log(id);
const user = {
    name:'홍길동',
    address : {
        city:'서울',
        zipcode:11111
    }
};
const {address:{city}} = user;
console.log(city);


//객체의 비구조화할당에서도 rest파라미터 함께 사용 가능.
const loc = {
    address : '서울시 서초구',
    x: 90.4123,
    y:123.4567
}
const {address,...rest2} = loc;
console.log(address);
console.log(rest2);
console.log(rest);

 

맵

 

 

///맵에 대하여

const map1 = new Map();
console.log(map1);

const map2 = new Map([['id',1], ['name','홍길동']]);
console.log(map2);

const map3 = new Map([[1,'홍길동']]);
console.log(map3);

//

const map4 = new Map(
    [
        ['id',1],['name','홍길동'],['name','장길산']


    ]


);
console.log(map4);

console.log(map4.size);

///size는 map의 속성으로 잡히기 때문에 비구조할당하여 가져올 수 있다.
const {size} = map2;
console.log(size);



//map에 요소를 추가하는 set
map1.set('id',1);
//set은 체이닝기법 지원
map1.set('name','홍길동').set('major','화학').set('year',4);

console.log(map1);

//객체의 키는 문자열만 지정가능
const kiacar = {
    price : 300000,
    model : 'ev6',
    company:'kia'

};
const hyundaicar = {
    price : 300000,
    model : 'ev6',
    company:'kia',
    1:'wqeg'
}

console.log(hyundaicar);


//map의키는 모든 값을 지정가능
map5 = new Map();
map5.set(kiacar,'suv').set(hyundaicar,'sedan');
console.log(map5);

// key값으로 value값을 가져오는거
console.log(map5.get(kiacar));

console.log(map5.get('get'));
//해당 키갑ㅍ으로 매핑된 밸류가 있는지 확인하는 has

console.log(map5.has(kiacar));
console.log(map5.delete(kiacar));
console.log(map5);
console.log(map5.clear());
console.log(map5);

 

셋

const set1 = new Set();
console.log(set1);

const set2 = new Set(["홍길동","장길산","임꺽정","홍길동"])
console.log(set2);


const set3 = new Set("es6");
console.log(set3);

const set4 = new Set("javascript");
console.log(set4);


//set 나오기 전에 중복제거 filter이용

const arr = [1,1,2,2,3,3,4];

// num:현재값, index : 현재인덱스, self : arr배열

const filteredarr = arr.filter((num, index, self)=>
    (self.indexOf(num)===index)
);

console.log(filteredarr);
const filteredarr2 = [...new Set(arr)];
console.log(filteredarr2);

//요소를 추가하는 add
set1.add(111);
//add는 체이닝기법 지원
set1.add(222).add(333).add(444);
console.log(set1);