JavaScript 분할 대입

11457 단어 JavaScripttech

개시하다


JavaScript의 편리한 분할 대입을 요약했습니다.
여기서 예를 들면 왼쪽은 변수를 사용하지만 변수 이외의 변수도 사용할 수 있다.

기본적


왼쪽의 변수 이름을 자유롭게 설정하고 일치하는 오른쪽 그룹 요소를 통해 초기화할 수 있습니다.
const animals = ["dog", "cat", "monkey"]
const [first, second, third] = animals
// first ... dog
// second ... cat
// third ... monkey
객체의 분할 대입은 왼쪽에 속성 이름을 지정합니다.
const monkey = {name: "George", gender: "boy"}
const { name, gender } = monkey 
// name ... "George"
// gender ... "boy"
오른쪽 가장자리에 왼쪽 변수와 일치하는 요소가 존재하지 않으면 undefinde로 변경됩니다.
const animals = ["dog", "cat"]
const [first, second, third] = animals
// first ... dog
// second ... cat
// third ... undefined

const monkey = {name: "George", gender: "boy"}
const { name, age } = monkey 
// name ... "George"
// age ... undefinde

불필요한 값 무시


불필요한 값이 있으면 무시할 수 있습니다.
const animals = ["dog", "cat", "monkey"]
const [first, second] = animals
// first ... dog
// second ... cat
const animals = ["dog", "cat", "monkey"]
const [first, , third] = animals
// first ... dog
// third ... monkey

내포된 객체


내포된 객체에서 분할 대입을 수행하려면 다음을 참고하십시오.
const monkey = {name: "George", gender: "boy", birthday: {year: 1995, mounth: 4, day: 1}}
const { birthday: {mounth, day} } = monkey
// mounth ... 4
// day ... 1

기본값


예를 들어 일치하는 요소가 없는 경우 왼쪽 가장자리 값은undefinde입니다.
const animals = ["dog", "cat"]
const [first, second, third = "wallaby"] = animals
// first ... dog
// second ... cat
// third ... "wallaby"

const monkey = {name: "George", gender: "boy"}
const { name, age = 3 } = monkey 
// name ... "George"
// age ... 3
대상은 다음과 같은 방법으로 지정할 수 있다.
const monkey = {name: "George", gender: "boy"}
const { nickname = name } = monkey 
// nikcname ... "George"

rest 선언


분할 대입その他の要素을 지정할 수 있습니다.
지정 방법은 변수 이름의 머리에만 ...를 붙인다.
const animals = ["dog", "cat", "monkey"]
const [first, ...others] = animals
// first ... dog
// others ... ["cat", "monkey"]

const monkey = {name: "George", gender: "boy", birthday: {year: 1995, mounth: 4, day: 1}}
const { birthday, ...others } = monkey 
// birthday ... {year: 1995, mounth: 4, day: 1}
// others ... {name: "George", gender: "boy"}

최후


끝까지 읽어주셔서 감사합니다.

좋은 웹페이지 즐겨찾기