es 6学習ノート-let、constとブロックレベルの役割領域_v 1.0_byKL
4905 ワード
es 6学習ノート-let、constとブロックレベルの役割領域_v 1.0
ブロックレベルのスコープ javascriptはもとはブロックレベルのスコープがないので、大域的なスコープと関数のスコープ だけあります.
例1
ブロックレベルがないので、毎回のiは同じです.
ここでは前に中に閉包の例がありますと一緒に理解できます.
例3
ここで真実の応用に還元します.または関数のスコープを使用して、たとえば関数内で変数を再定義する .は、独立した変数 を使用するために、クローズドのような方法を使用します.
let letの役割は、変数をブロックレベルのスコープ内に保持することです.他のスコープと争うことはなくなります. varは変数が上昇する場合があります.(変数は声明の前に使用できます.)が、letは を持っていません.ステートメントの繰り返しは許されません.
letに変更しました
ブロックレベルのスコープと関数宣言 s 5は、関数が最上位のスコープと関数スコープの中でしか宣言できないと規定しています.ブロックレベルスコープ宣言はできません. s 6は、ブロックレベルのスコープ内の宣言関数 を明確にすることを規定している.
しかし、古いコードの問題を考慮して、このため発生した互換性のない問題を軽減するために、ES 6は付録Bに規定されています.ブラウザの実現は上記の規定を守らなくてもいいです.
環境による挙動の違いを考慮して、ブロックレベルのスコープ内で関数を宣言することを避けるべきである.必要であれば、関数宣言文ではなく関数表現にも書くべきです.
for循環はもう一つの特別なところがあります.循環語句の部分は父作用域です.循環体の内部は単独の副作用領域です.
コンサート
constは読み取り専用の定数を宣言します.一度声明したら定数の値は変更できません.
constが実際に保証しているのは、変数の値が変更されてはいけないのではなく、変数が指すメモリアドレスが変更されてはいけないのです.は、単純なタイプのデータ(数値、文字列、ブール値)に対して、変数が指すメモリアドレスに値を格納するので、定数に等しい. は複合タイプのデータ(主に対象と配列)であり、変数が指すメモリアドレスは、1つのポインタだけで保存されています.constはこのポインタが固定されていることを保証できます.データ構造が可変であるかどうかは、完全に制御できません. 一般的には、constを用いて値の格納容器(変数) を定義する.は、変数 を定義するために、値容器が明確に変更されると判断された場合にのみ、letを使用する.はvar を使用していません.
参照参照: s 6-関数の拡張 es実戦2015
ブロックレベルのスコープ
例1
ブロックレベルがないので、毎回のiは同じです.
var a = [];
for (var i = 0; i < 10; i++) {// i var ,
a[i] = function () {
console.log(i); // i , i 10
};
}
a[1](); // 10
a[6](); // 10
例2ここでは前に中に閉包の例がありますと一緒に理解できます.
function createFunctions() {
var result = new Array();
for (var i = 0; i < 10; i++) {
result[i] = function () { //
// createFunctions , (for ),
//i 10 , 10, , ,
return i;
};
}
return result; // , function
}
var test = createFunctions();
for (var i = 0; i < 10; i++) {
// function
console.log(test[i]());// 10
}
// ,
function createFunctions() {
var result = new Array();
for (var i = 0; i < 10; i++) {
result[i] = function (num) {// , num
return function () {// , num num, ,
return num; // , num
};
}(i);// , i num
}
return result; // , function
}
var test = createFunctions();
for (var i = 0; i < 10; i++) {
// function
console.log(test[i]());// 0-9
}
ここでは、クローズドバックが変数オブジェクト全体として保存され、iの値が変数オブジェクトとともに変化するということですが、ここではグローバルオブジェクトに置き換えて例を作ります.例3
ここで真実の応用に還元します.
// :Uncaught TypeError: Cannot read property 'innerText' of undefined
at HTMLButtonElement. (
var buttons = document.querySelectorAll('.button');
var output = document.querySelector('#output');
for(var i =0;i
総じて言えば、以前のjsの中でブロックレベルのスコープを実現すると:let
letに変更しました
var a = [];
for (let i = 0; i < 10; i++) {
a[i] = function () {
console.log(i);
};
}
a[1](); // 1
a[6](); // 6
他の例も簡単にvarの代わりにletを変更することができます.ブロックレベルのスコープと関数宣言
しかし、古いコードの問題を考慮して、このため発生した互換性のない問題を軽減するために、ES 6は付録Bに規定されています.ブラウザの実現は上記の規定を守らなくてもいいです.
環境による挙動の違いを考慮して、ブロックレベルのスコープ内で関数を宣言することを避けるべきである.必要であれば、関数宣言文ではなく関数表現にも書くべきです.
//
{
let a = 'secret';
function f() {
return a;
}
}
//
{
let a = 'secret';
let f = function () {
return a;
};
}
forサイクルfor循環はもう一つの特別なところがあります.循環語句の部分は父作用域です.循環体の内部は単独の副作用領域です.
for (let i = 0; i < 3; i++) { //i for
let i = 'abc'; // for i
console.log(i);
}
// abc
// abc
// abc
上記のコードは3回のabcを出力しています.これは関数内部の変数iと外部の変数iが分離されていることを示しています.コンサート
constは読み取り専用の定数を宣言します.一度声明したら定数の値は変更できません.
constが実際に保証しているのは、変数の値が変更されてはいけないのではなく、変数が指すメモリアドレスが変更されてはいけないのです.
const foo = {};
// foo , , ,
foo.prop = 123;
foo.prop // 123
// foo , ,
foo = {}; // TypeError: "foo" is read-only
オブジェクトを凍結する必要がある場合、本物の「定数」として保証するためには、Object.freeze
が必要であり、また、除外対象の中にオブジェクトが含まれていることを保証するためには、再帰的な凍結が必要である.//
const foo = Object.freeze({});
// , ;
// ,
foo.prop = 123;
//
var constantize = (obj) => {
Object.freeze(obj);
Object.keys(obj).forEach( (key, value) => {
if ( typeof obj[key] === 'object' ) {
constantize( obj[key] );
}
});
};
要するに:参照参照: