값 :
8진수 / 2진수
변수:
var -> let
지역변수 / 지역화
const :
상수형변수
문자열 : 템플릿 문자열
어금부호로 감싸는 문자열
값을 포맷하거나 내려쓰기 등이 자유롭다
Escapte 문자를 포함하고 싶다면 ?
String.raw`...\n\n`
JSON이 향상되었다.
변수에 담겨진 값을 이용해 Object를 만들때
뽀개기 : 객체가 가지고있는 속성들을 지역변수화해서 값을 옮겨담는 작업
let kor = 30;
let eng = 40;
let math = 50;
let exam = {
kor :kor,
eng :eng,
math:math,
total: function(){
console.log("total");
}
};
console.log(exam.total());
exam = {
kor,
eng,
math,
total(){
console.log("new total");
}};
console.log(exam);
console.log(exam.total());
exam = {
kor,eng,math,total(){console.log("prac");
}
}
console.log(exam.total());
객체의 키를 변수로 사용
let attr = "kor";
let exam = {
[attr] : 1,
eng : 2
};
console.log(exam.kor); // 1출력
let attr = "kor";
let exam = {
[attr+"1"] : 1,
eng : 2
};
console.log(exam.kor1);
객체를 뽀개지않고 사용하는 방식은 가독성이나 실행 성능을 낮춘다.
function printExam(exam){
//뽀개기 Destructuring
/*let kor = exam.kor;
let eng = exam.eng;
let math = exam.math;*/
//let{kor, eng, math} = exam;
let{kor,eng,math,avg=100} = exam;
console.log(avg);//100
let total = kor + eng+math;
console.log(`kor:${kor}, eng:${eng}, math:${math}`); //ex2.js:485 kor:10, eng:20, math:30
console.log(`total is ${total}`)//ex2.js:486 total is 60
}
let exam = {
kor:10,
eng:20,
math:30
}
printExam(exam);
별칭사용
let{kor:k, eng, math, avg=100} = exam;
console.log(k) // 10
대괄호 변수선언
let [x,y] = [2,3];
console.log(x);//2
console.log(y);//3
[x,y] = [3,4];
console.log(x);//3
console.log(y);//4
[x,y] = [y,x];
console.log(x);//4
console.log(y);//3
[a,b] = [b,a] : 임시변수없이 교체가능
선언없는 할당
코드블럭( )으로 감싸기.
let a;
let b;
[a,b] = [10,20];
console.log(`a:${a},b:${b}`); //a:10,b:20
let kor;
let eng;
({kor,eng} = {kor:80, eng:90});
console.log(`a:${kor},b:${eng}`);//a:80,b:90
let notices = {
title:"공지사항목록",
list:[
{title:"굿~", content:"좋아요~"},
{title:"호호~", content:"웃음소리~"}
]
};
//let {list:[{title}]} = notices;//굿
let {list:[,{title}]} = notices;//호호
console.log(title);
'2021 Newlecture > Javascript' 카테고리의 다른 글
자바스크립트 (ES6) upgrade : collection / OOP / Rest / Class (0) | 2021.06.17 |
---|---|
파일업로드 진척도표시 / 이미지 미리보기 (0) | 2021.05.27 |
for ...in, for ...of 차이 (0) | 2021.05.13 |
(AJAX) 로딩화면만들기 (0) | 2021.05.07 |
(AJAX) bind() / 기본페이지보이기 / 검색기능 (0) | 2021.05.06 |
(AJAX)페이지정보불러오기 (0) | 2021.05.04 |
( Ajax ) ``억음부호 ${ } / insertAdjacentHTML / JSON.parse (0) | 2021.05.03 |
DOM / DOM tree/노드선택 (0) | 2021.05.01 |