JavaScript--ES6 설명

섹션 1 let

// ES6 — let

let a = 1;

if (1 === a) {
let b = 2;
}

for (let c = 0; c < 3 ; c++) {
// …
}

functionletsDeclareAnotherOne() {
let d = 4;
}

console.log(a) // 1
console.log(b); 정의되지 않았습니다
console.log(c); // ReferenceError: c가 정의되지 않았습니다
console.log(d); // ReferenceError: d가 정의되지 않았습니다

// window
console.log(window.a) ; // 1
console.log(window.b); // undefine
console.log(window.c); // undefine
console.log(window.d) // undefine
이번에는 변수 a만 전역으로 선언됩니다. let은 외부에서 정의되지 않은 블록 범위 변수를 선언하는 방법을 제공합니다.

//todo

let과 const는 var와 유사하며 둘 다 변수를 선언하는 데 사용됩니다. 실제 응용 프로그램에는 둘 다 고유한 특수 용도가 있습니다.

demo1
var name = 'shitu91'

if(true) {
var name = 'shituketang'
console.log(이름) //shituketang
}

console.log(이름) //shituketang
use var 두 출력 모두 Shiuketang입니다. 이제 표시되는 내부 변수는 외부 변수를 포함합니다. 이는 ES5가 블록 수준 범위가 아닌 전역 범위(범위)와 함수 범위만 갖기 때문입니다.

그리고 실제로 JavaScript에 새로운 블록 수준 범위를 추가해 보겠습니다. 이를 통해 선언된 변수는 let 명령이 있는 코드 블록 내에서만 유효합니다.

let name = 'shitu91'
if (true) {
let name = 'shituketang'
console.log(name) //shituketang
}

console.log(name) //shitu91
demo2 Counted The 루프 변수가 전역 변수로 유출되었습니다
var a = [];
for (var i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a6; // 10
위 코드에서 변수 i는 var로 선언되었으며 전역 범위에서 유효합니다. 따라서 반복될 때마다 새로운 i 값이 이전 값을 덮어쓰게 되어 최종 출력이 마지막 라운드의 i 값이 됩니다.
let을 사용하면 이 문제가 발생하지 않습니다.

var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a6; // 6
demo3
var clickBoxs = document.querySelectorAll('.clickBox')
for (var i = 0; i < clickBoxs.length; i++){
clickBoxs[i].onclick = function(){
console .log(i)
}

원래는 다른 clickBox를 클릭하고 다른 i를 표시하려고 했지만 사실은 어떤 clickBox를 클릭하든 출력은 5입니다. 클로저를 사용하여 이를 수행하는 방법을 살펴보겠습니다.
function iteratorFactory(i){
var onclick = function(e){
console.log(i)
}
return onclick;
}
var clickBoxs = document.querySelectorAll('.clickBox')
for (var i = 0; i < clickBoxs.length; i++){
clickBoxs[i].onclick = iteratorFactory(i)
}
const도 변수를 선언하는 데 사용되지만 상수입니다. 한번 선언된 상수의 값은 변경할 수 없습니다.
const PI = Math.PI

PI = 23 //모듈 빌드 실패: SyntaxError: /es6/app.js: "PI" is read-only
const로 선언된 상수를 변경하려고 하면 브라우저에서 오류가 발생합니다. 보고됩니다. Const는 좋은 애플리케이션 시나리오를 가지고 있습니다. 즉, 제3자 라이브러리를 참조할 때 선언된 변수입니다. const를 사용하여 선언하면 나중에 실수로 이름을 변경하여 발생하는 버그를 방지할 수 있습니다. +

const monent = require('moment')
/ / todo

let 키워드로 선언된 변수에는 변수 호이스팅 기능이 없습니다.
let 및 const 선언은 가장 가까운 블록(중괄호 내)에서만 유효합니다.
상수 const 선언을 사용할 때는 다음과 같은 대문자 변수를 사용하세요. CAPITAL_CASING
const는 선언 시 값을 할당해야 합니다.
Let:

변수 작업 방식을 변경할 수 있도록 ES6에서 추가된 새로운 키워드입니다. JavaScript:

var name = 'Max';
console.log (name;

let new_name = 'Max';
console.log(new_name);
Console:

"Max"
"Max"
여기서 let과 var가 모두 동일한 작업을 수행하는 것을 볼 수 있습니다. 차이점은 무엇입니까?

let을 사용하면 변수 범위 지정을 제어할 수 있습니다. 'if' 문

콘솔:

"error"
"참조 오류: 연령이 정의되지 않았습니다
또 다른 예로 for 루프에서 변수를 사용할 때 인덱스는 더 이상 루프 외부에서 사용되지 않습니다!

위 내용은 JavaScript--ES6 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!