0. use destructuring assignment to extract values from objects.
: neatly assigning values taken directly from an object.
1. use destructuring assignment to assign values from objects.
: allows you to assign a new variable name when extracting values.
do this by putting the name after a colon when assigning the value.
const user = {name:'sam lee', age:30};
const {name:userName, age:userAge} = user;
// user.name = userName 이름의 변수로 저장됨.
//user.age = userAge이름의 변수로 저장됨.
console.log(userName) //sam lee출력
console.log(userAge) // 30출력
2. use destructuring assignment to assign variables from nested objects.
cosnt user = {
samlee : {
age: 30,
email: 'samlee@gmail.com'
}
};
const {samlee: {age, email}} = user;
const {samlee:{samAge, samEmail}} = user;
3. use destructuring assignment to assign variables from arrays.
-> one key difference between the spread operator and array destructing is that the spread operator unpacks all contents of an array into a comma-separated list.
-> consequently, you cannot pick of choose which elements you want to assign to variables.
4. use destructuring assignment with the rest parameter to reassign array elements.
*** the rest parameter only works correctly as the last variable in the list.
*** as in, you cannot use the rest parameter to catch a subarray that leaves out the last element of the original array.
const source = [1,2,3,4,5,6,7,8,9,10];
function removeFirstTwo(list) {
const [,,...arr] = list ;
return arr;
}
const arr = removeFirstTwo(source);
5. use destructuring assignment to pass an object as a Function's parameters
-> can destructure the object in a function argument itself.
#예제 (이해x)
6. create strings using template literals
: 백틱 ``을 사용함.
-> allow you to create multi-line strings and to use string interpolation(내삽법) features to create strings.
`Hello my name is ${variable}! Nice to meet you`;
+ you can include other expressions in your string literal, ex) ${a + b}.
7. write concise object literal declarations using object property shorthand.
const getMousePosition = (x, y) => ({
x: x,
y: y
});
// is same as below
const getMousePosition = (x, y) => ({ x, y });
8. write concise declarative functions
'ONLINE COURSES > JavaScript' 카테고리의 다른 글
FreeCodeCamp_JS_TIL_DAY2 (0) | 2021.06.26 |
---|---|
FreeCodeCamp_JS_TIL_DAY1 (0) | 2021.06.23 |
DOM-3 (0) | 2021.06.15 |
DOM-2 (0) | 2021.06.14 |
DOM-1 (0) | 2021.06.14 |
댓글