자바스크립트 JavaScript | 구문과 표기법: 전개 구문 (Spread Syntax), 객체 리터럴 표기법, 구조 분해 할당 (Destructuring Assignment)

 

⭕ 자바스크립트 JavaScript | 구문과 표기법: 전개 구문 (Spread Syntax), 객체 리터럴 표기법, 구조 분해 할당 (Destructuring Assignment)

➡️ 전개 구문 (Spread Syntax)

전개 구문은 배열이나 객체의 요소를 여러 개의 개별 요소로 "전개"하는 데 사용됩니다. 이 구문은 함수 호출에 인수를 전달하거나, 배열을 다른 배열에 병합하거나, 객체를 다른 객체와 병합할 때 유용하게 사용할 수 있습니다.

// 배열 전개
let numbers = [1, 2, 3];
let moreNumbers = [...numbers, 4, 5];
console.log(moreNumbers); // [1, 2, 3, 4, 5]

// 객체 전개
let person = { name: "Alice", age: 25 };
let updatedPerson = { ...person, location: "New York" };
console.log(updatedPerson); // { name: "Alice", age: 25, location: "New York" }

 

 

➡️ 객체 리터럴 표기법

객체 리터럴 표기법은 중괄호({})를 사용하여 객체를 생성하는 간결한 방법입니다. 이 방법을 사용하면 키-값 쌍을 나열하여 객체의 속성을 정의할 수 있습니다.

let book = {
  title: "JavaScript: The Good Parts",
  author: "Douglas Crockford",
  year: 2008
};

console.log(book);

 

➡️ 구조 분해 할당 (Destructuring Assignment)

구조 분해 할당은 배열이나 객체의 속성을 해체하여 그 값을 개별 변수에 할당하는 JavaScript 표현식입니다. 이를 통해 배열이나 객체에서 데이터를 쉽게 추출할 수 있습니다.

// 배열 구조 분해
let colors = ["red", "green", "blue"];
let [firstColor, secondColor] = colors;
console.log(firstColor); // red
console.log(secondColor); // green

// 객체 구조 분해
let user = { username: "jdoe", email: "jdoe@example.com" };
let { username, email } = user;
console.log(username); // jdoe
console.log(email); // jdoe@example.com