JAvascript思考分析(一):var let const function宣言の違い


JAvascript思考分析(一):var let const function宣言の区別引用javascriptを学習する過程で、変数はいつでも使用されている.これに対応して、変数宣言方法も同様である.変数は自分で決定しますが、変数宣言方法はとっくに定義されています.変数を使用する前に、変数宣言方法を理解することが特に重要になります.ES 6が発売される前に、最もよく使われる宣言変数の方法はvarです.しかしvar自体の欠陥のため、ES 6はvarの代わりにletとconstを発売した.varの欠陥は修正されていますが、変えることはできません.以前varで何年も書いていたプロジェクトで、これらのプロジェクトはvarが取って代わられるにつれて簡単に変更することはできません.そのためvarを使用する会社やプロジェクトが依然として存在し、var、let、constの違いを理解する必要がある.一、varはvarを説明してコードを見る前に、私たちはまず構想を統一して、変数の宣言と使用過程を:作成→初期化→賦値→修正の4つのステップに分けます.
まずvarの声明と使用を見てみましょう.
function test(){/*を事前に解析し、付与からvar a=undefined//を初期化して変数aを作成し、undefinedに初期化します.このとき変数はすでに環境内*/console.log(a)/undefinedと存在します.
var a=0;//0 console.log(a);//0
a=1;//変数値console.log(a)/1}を変更できます.
test();
以上のコードから,varの実行環境における宣言および操作過程は,(作成→初期化)→付与→修正であることがわかる.
事前解析:環境の最上位に変数を作成し、undefinedに初期化します.変数の昇格です.変数に値を割り当てる.変数に対して操作を行い、後続の操作で変数値を修正することができる.
     console.log     ,            ——var           ,                     。       var     console.log  ,    undefined,        。
   var             ,       。

そして変数のアップグレードをもう一度言います
if判断における変数昇格
function test(){/*事前解析ifは実行していないと判断したがvarの変数昇格が発生した場合、実行環境にはすでに変数aが存在し、値はundefined;*/console.log(a)/undefined、変数昇格if(false){var a=1;console.log(a)/実行しない}
console.log(a);//undefined、変数に値が割り当てられていません
a=1;//注意、このときaの変数が上昇したため、宣言記号の付与値は加算されず、グローバル環境でconsole.log(a);//1}に上昇しなかった.
test();
console.log(a);//if中のaの変数が上昇するため、a=1の付与値はグローバルに存在しないとエラーが発生します.if判定の内容を注記すると、a=1は変数宣言記号を付けていないため、グローバルで宣言することに相当するため、最後のconsole.log(a)は1を印刷する
2.forサイクル中の変数リフトfunction test(){/*事前解析ifは実行していないと判断したが、varの変数リフトが発生した場合、実行環境にはすでに変数aが存在し、値はundefined;*/console.log(a)/undefined、変数リフトconsole.log(i);//undefined、変数リフトfor(var i=0;i<0;i++){var a=1;console.log(a)/未実行}console.log(i);//1,forの初期化文が実行されました
console.log(a);//undefined、変数に値が割り当てられていません
a = 1; console.log(a); }
test();console.log(a);//エラー、変数は存在しません
             , var     if for    ,         ,                     。

最後にvarの欠陥について説明します.
function test() {   var a = 0; var a = 1; var a = 2;
console.log(a);//2 }
test();
            ,var       ,                     →   →  ,                。                     ,        ,                       ,       。

二、let
まずvarの声明と使用を見てみましょう.
function test(){/*プリ解析、変数アップグレードなし、何もありません.作成、初期化と付与を同時に*/
console.log(a);//エラー、変数はまだ作成されていません
let a = 0; //     a,       0.     ,  undefined;
console.log(a); // 0

a = 2; //        
console.log(a); // 2

}
test();
同様に、まずプロシージャを解析します:(作成→初期化→値付け)→変更
事前に解析して、何もありません;環境の最上位で、変数を作成して、undefinedに初期化します——変数の昇格;
変数を作成し、初期化し、値を割り当てます.変数を操作し、後続の操作で変数値を変更できます.
         ,      let     ,(   →   →   )       ,          。   let   console.log(a),  a is not defined,    a      。 let                。

次に、letの繰り返し宣言の表現を見てみましょう.
function test() {   let a = 1; let a = 2; let a = 3;
console.log(a);//エラー}
test();
        let   var      ——      。      ,   let     ,             ,    Identifier 'a' has already been declared;

最後にletとvarの最大の違いであるブロックレベルの役割ドメイン
       ,        ——    ,{}            ,         。           (          ,           )。
      let  ,JS                  。         ,  for    var  i。

function a(){for(var i=1;i<5;i++){console.log(i);for(var i=10;i<20;i+){console.log(i);}}a()//内部ループはvar宣言のため、実行後i値が11となり、外部ループ判定後、実行されません
function testA(){/*事前解析iを作成してundefinedに値を付けます.この場合、実際には2つのiの変数が*/console.log(i);//undefinedに昇格します.
var i=0;//賦値i=0 console.log(i);//0;
{console.log(i);//0、最初のi var i=10//付与i=10にアクセスし、最初のi console.log(i);//10を上書きし、2番目のiにアクセスする}
console.log(i);//10、2番目のiにアクセスし、iはすでに上書きされている}testA();
       ,  testA  ,       a        。      ,     var     。
        let         :

function b(){for(let i=0;i<5;i++){console.log(i);for(let i=10;i<20;i+){console.log(i);}}b()//ブロックレベルの役割ドメインが存在するため、2つのループのiは互いに影響せず、すべてのループ回数が実行されます.実際に使用する場合は、同じ変数名を使用しないことをお勧めします.
function testB(){/*事前解析は何もありません*/console.log(i);//エラーを報告し、デッドゾーンを一時保存
let i=0;//賦値i=0 console.log(i);//0;
{console.log(i);//エラーを報告し、ブロックに変数iが宣言されているため、デッドゾーンを一時保存します.ブロックにlet iがない場合は、役割ドメインチェーンで上を検索し、外部i値0 let i=10//賦値i=10を印刷し、最初のi console.log(i)//10を上書きせず、2番目のiにアクセスします.
console.log(i);//0、最初のiにアクセスし、2つのiは互いに影響しない}testB();
       ,  testB  ,       b        。      ,   let           ,     let var     。

三、const function test(){/*事前解析は何もなく、作成、初期化と付与を同時に行う*/console.log(a);//エラーを報告し、変数はまだ作成されていない
const a={name:“Lyu”//オブジェクトaを作成し、オブジェクトアドレス}console.log(a);//{name:“Lyu”}console.log(a.name);//Lyu
a=1;//エラー、定数値は変更不可
a.name = “Jack”;   console.log(a);//{name: “Jack”} console.log(a.name);//Jack }
test();
分析プロセス:(作成→初期化→代入)→修正
事前解析、何もありません;事前解析は環境の最上位で、変数を作成して、undefinedに初期化します——変数の昇格;
変数を作成し、初期化し、値を付与する必要があります.値を付与しないとエラーが報告されます.変数を操作すると、後続の操作で変数値を変更することができ、変数を変更することはできませんが、変数の属性を変更することができます.
       const   ,         。    var let     ,   const     ,    (   →   →   )    ,const let      。       →  。          , a = 1     Assignment to constant variable。   constant  const     ,        、   、  。          ,  const     ,      ,       。     a = 1    a   ,  。
     a        ,  a   ,    ,  a         。           。a.name       "Jack"。   const       。
    let   ,const              ,      。

四、function
まずfunctionの声明と使用を見てみましょう.
/*funtcion test(){...}事前解析、作成、初期化、付与の三位一体この時点で関数は変数宣言のすべての操作を完了し、実行環境の任意の場所で関数*/を呼び出すことができます.
test();//関数を呼び出します.関数が確かに存在し、使用可能であれば、実行環境のどこでも呼び出すことができます.
function test() {…}
分析プロセス:(作成→初期化→代入)→実行/変更
環境の最上位で、関数を作成し、関数定義に初期化し、値を割り当てます.関数がどこにあるかにかかわらず、使用可能であれば呼び出すことができます.
   function            ,        ,     。function     ,               、   、         。    ,          ,             。           。

次にfunctionはvarと同様に変数宣言の特性があります.
if判断における変数昇格
function test(){/*事前解析ifは実行していないと判断したが、functionの変数リフトが発生した場合、実行環境にはすでに変数aが存在し、値はundefined;*/console.log(a)/undefined、変数リフトif(false){function a(){}//変数リフトconsole.log(a)/実行しない}
console.log(a);//undefined、変数に値が割り当てられていません
a=1;//注意、このときaの変数が上昇したため、宣言記号の付与値は加算されず、グローバル環境でconsole.log(a);//1}に上昇しなかった.
test();
console.log(a);//エラー.ifのaの変数が上昇したため、a=1の付与値はグローバルに存在しない.if判断の内容を注釈すると、a=1は変数宣言記号を付けていないため、グローバルに宣言することに相当する.最後のconsole.log(a)は1を印刷する
forサイクルでの変数のアップグレード
function test(){/*事前解析ifは実行していないと判断したが、functionの変数アップグレードが発生した場合、実行環境にはすでに変数aが存在し、値はundefined;*/console.log(a)/undefined、変数はconsole.log(i);//エラーを報告し、デッドゾーンfor(let i=0;i<0;i+){function a(){};//変数昇格console.log(a)/未実行}console.log(i);//エラー、let変数昇格は存在しません
console.log(a);//undefined、変数に値が割り当てられていません
a = 1; console.log(a); }
test();console.log(a);//エラー、変数は存在しません
最後にfunctionはvarと同様に、同じ変数を繰り返し宣言することもでき、後の関数定義は前の関数定義を上書きします.
test();//2
function test() {   console.log(1);   }
function test() {   console.log(2); }
       2,                 。

五、総括は以上のように、以下の点にまとめることができる:1.varとlet、constの違いは変数の昇格、および変数の一意性にある;2.constとletの違いは、変数値が修正できない以外、その他の性質は同じである;3.functionはそれ自身の需要のため、作成→初期化→賦値三位一体、環境の最上位で完成する;このような性質のため、手紙数の声明の関数はいかなる位置で呼び出すことができます;4.もしできるならば、できるだけlet、constを使ってvarに取って代わります;本文はただ簡単に関数の声明と操作の方面で羅列して、var、let、const、functionの区別、初心者のために概念の偏差を整理して、回り道を少なくして、そして学習を理解することを通じて(通って)、できるだけ早くJSの敷居に入ります.批判指摘~
リンクに転載:https://www.jianshu.com/p/e6908920e63d