간단하면서도 강력한 연산자입니다.

대부분의 일반적인 웹 관련 프로그래밍 언어를 보면 모두 기본 연산자가 있으며 거의 ​​모든 개발자가 사용 방법을 알고 있습니다. 그러나 흔하지 않은 일부 연산자가 있으며 모든 언어에 이러한 연산자가 있는 것은 아니며, 있다고 하더라도 동일한 구문을 공유하지 않을 수 있습니다. 그러나 언어를 처음 접하는 사람들에게는 다른 사람의 코드를 읽으려고 노력하고 기술 간의 개념을 이해하는 데 필요한 도구가 없으면 문제가 될 수 있습니다. 따라서 이 기사에서는 Javascript의 과소평가되고 악명 높은 "확산"연산자, 일명 3점(...) 연산자에 대해 이야기하겠습니다. 오다! 탐험을 시작합시다!

스프레드 연산자

Javascript는 지난 몇 년 동안 많은 새로운 기능을 추가하여 구문과 기능이 크게 향상되었습니다. Spread는 가장 유용한 방법 중 하나이며 새 개체를 만드는 동안 개체의 데이터 일부를 업데이트하려는 경우 가장 간단한 방법입니다. 프로그래밍에 많은 응용 프로그램이 있는 매우 강력한 구문입니다.
지금은 그들 모두를 추적하기가 어렵습니다. 스프레드 연산자의 가장 일반적인 사용 사례 중 일부를 파헤쳐 보겠습니다.

배열 사본 만들기

작은 예를 들어 이것을 이해합시다.
가장 좋아하는 크리켓 선수는 누구입니까?
내 거? 분명히 Dhoni와 Raina입니다.
괜찮아. 이것을 배열로 가져 갑시다.

let favourites = ["Dhoni","Raina"]
let copy = [...favourites]
console.log(copy);
// ["Dhoni","Raina" ]

다른 방식으로 보면 확산 연산자는 즐겨찾는 배열 내에서 각 개별 요소를 선택하고 각 요소를 새로운 배열 구조에 배치합니다. 이는 확산과 같습니다. 이제 스프레드 연산자가 없으면 어떻게 되는지 생각할 수 있습니다.

let favourites = ["Dhoni","Raina"]
let copy = [favourites]
console.log(copy);
//  [["Dhoni","Raina" ]]

이것은 우리가 다차원 배열(배열 안의 배열)을 얻고 있기 때문에 다릅니다.

어레이 확장

이전 예를 바탕으로 새 플레이어를 내 즐겨찾기 목록에 추가하고 싶다고 가정해 보겠습니다. Spread 연산자는 이를 수행하는 간단하고 효과적인 방법을 제공합니다.

let favourites = ["Dhoni","Raina"]
console.log(...favourites,"Smith");
//  Dhoni Raina Smith

저것과 같이 쉬운. 여기서는 이전 사례와 달리 배열 구조를 요청하지 않기 때문에 배열을 얻지 않습니다. 따라서 이렇게 하면 기존 데이터를 실제로 덮어쓰지 않고 데이터를 업데이트할 수 있습니다.

문자열 확산

확산 연산자는 문자열 확산에도 사용할 수 있습니다. 한 가지 실용적인 예는 문자열에서 문자를 추출하는 것입니다.

const player = 'Sachin';

//Spread Operator extracts the characters from the String and assigns to an array
const characters = [...player];

console.log(characters); 
//Output -> Array (6) ["S", "a", "c", "h","i","n"]

개체 병합

객체 병합은 일부 키-값 조건을 제외하면 배열 병합과 거의 유사합니다.
고유 키가 있는 경우 키-값이 새 개체에 추가됩니다. 키가 같으면 값이 새 값으로 대체됩니다.

const match1 = 
{ 
  name : "Sachin", 
  score : 56 
};


const match2 = 
{ 
    name : "Sachin", 
    score: 53,
    balls: 32 
};



const match = {...match1, ...match2};
console.log(match) ;
 // Output -> 
             {  name: "Sachin",
                score: 53,
                balls: 32
             };

이것이 이 기사의 전부입니다. 이 외에도 스프레드 구문에는 다른 많은 응용 프로그램이 있습니다. 그것을 시도해보고 언어가 제공하는 이 새로운 도구를 받아들이십시오. 기사가 마음에 드셨기를 바랍니다. 아래 댓글 섹션에서 피드백을 알려주십시오.

확산 구문에 대한 자세한 내용은 MDN Web Docs.을 참조하십시오.

다음편에서 만나요👋