// function 함수
function isAnimal(name) {
const animals = ['고양이', '강아지', '사자', '호랑이'];
return animals.includes(name);
}
// 화살표 함수
const isAnimal = name => ['고양이', '강아지', '사자', '호랑이'].includes(name);
console.log(isAnimal('강아지')); // true
console.log(isAnimal('노트북')); // false
function getSound(animal) {
const sounds = {
강아지: '멍멍',
고양이: '야옹',
참새: '짹짹'
};
return sounds[animal] || '...?';
}
console.log(getSound('강아지')); // 멍멍
console.log(getSound('참새')); // 짹쨱
function getSound(animal) {
const tasks = {
강아지() {
console.log('멍멍');
},
고양이() {
console.log('고양이');
},
참새() {
console.log('짹짹');
}
};
if (!tasks[animal]) {
console.log('...?');
return;
}
tasks[animal]();
}
getSound('강아지'); // 멍멍
getSound('참새'); // 짹쨱
const object = { a: 1, b: 2 };
const { a, b } = object;
console.log(a); // 1
console.log(b); // 2
const object = { a: 1 };
function print({ a, b }) {
console.log(a);
console.log(b);
}
print(object);
// 1
// undefined
const object = { a: 1 };
// 파라미터에서 설정 시,
function print({ a, b = 2 }) {
console.log(a);
console.log(b);
}
print(object);
// 1
// 2
// 파라미터에서 설정하지 않을 시,
const { a, b = 2 } = object;
console.log(a); // 1
console.log(b); // 2
const animal = {
name: '산체',
type: '강아지'
};
const nickname = animal.name;
// const { name: nickname } = animal
console.log(nickname); // 강아지
const array = [1];
const [one, two = 2] = array;
console.log(one);
console.log(two);
const deepObject = {
state: {
information: {
name: 'velopert',
languages: ['korean', 'english', 'chinese']
}
},
value: 5
};
const { name, languages } = deepObject.state.information;
const { value } = deepObject;
const extracted = { // key 이름으로 선언된 값이 존재하다면, 바로 매칭
name, // name: name,
languages, // languages: languages,
value // value: value
};
console.log(extracted);
// {name: "velopert", languages: Array[3], value: 5}
...
const {
state: {
information: { name, languages }
},
value
} = deepObject;
const extracted = {
name,
languages,
value
};
console.log(extracted);
// {name: "velopert", languages: Array[3], value: 5}
// 기본 코드
const dog = {
name: '우유'
};
const mildDog = {
name: '우유',
personality: 'mild'
};
const whiteMildDog = {
name: '우유',
personality: 'mild',
color: 'white'
};
// spread 연산자 사용
const dog = {
name: '우유'
};
const mildDog = {
...dog,
personality: 'mild'
};
const whiteMildDog = {
...mildDog,
color: 'white'
};
console.log(dog); // Object {name: "우유"}
console.log(mildDog); // Object {name: "우유", personality: "mild"}
console.log(whiteMildDog); // Object {name: "우유", personality: "mild", color: "white"}
const animals = ['강아지', '고양이', '참새'];
const anotherAnimals = [...animals, '비둘기'];
console.log(animals); // ["강아지", "고양이", "참새"]
console.log(anotherAnimals); // ["강아지", "고양이", "참새", "비둘기"]
// 여러 번 사용
const someAnimals = [...animals, '비둘기', ...animals];
console.log(someAnimals); // ["강아지", "고양이", "참새", "비둘기", "강아지", "고양이", "참새"]
const myFunction(a) { // 여기서 a : 파라미터
console.log(a); // 여기서 a : 인자
}
myFunction('Hello, World'); // 여기서 'Hello, World' : 인자
function sum(...rest) {
return rest.reduce((acc, current) => acc + current, 0);
}
const numbers = [1, 2, 3, 4, 5, 6];
// 일일이 대입
const result = sum(
numbers[0],
numbers[1],
numbers[2],
numbers[3],
numbers[4],
numbers[5]
);
// spread 사용
const result = sum(...numbers);
console.log(result);
const whiteMildDog = {
name: '우유',
personality: 'mild',
color: 'white'
};
const { color, ...mildDog } = whiteMildDog; // 비구조화 할당 문법과 함께 사용
console.log(color); // white
console.log(mildDog); // Object {name: "우유", personality: "mild"}
const numbers = [0, 1, 2, 3, 4, 5, 6];
const [one, ...rest] = numbers; // 배열 비구조화 할당
console.log(one); // 0
console.log(rest); // [1, 2, 3, 4, 5, 6]
const [..rest, last] = numbers; // error
// 함수 사용
function sum(a, b, c, d, e, f, g) { // 7개의 파라미터
let sum = 0;
if (a) sum += a;
if (b) sum += b;
if (c) sum += c;
if (d) sum += d;
if (e) sum += e;
if (f) sum += f;
if (g) sum += g;
return sum;
}
// rest 파라미터 사용
function sum(...rest) {
return rest;
}
const result = sum(1, 2, 3, 4, 5, 6); // 6개의 인자
console.log(result); // [1, 2, 3, 4, 5, 6]
Reference
벨로퍼트와 함께하는 모던 자바스크립트