ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript の事前解釈とは何ですか? JavaScript 事前解釈解析 (コード付き)

JavaScript の事前解釈とは何ですか? JavaScript 事前解釈解析 (コード付き)

不言
リリース: 2018-11-16 14:58:23
転載
1814 人が閲覧しました

この記事の内容は、JavaScript の事前解釈とは何ですか? JavaScript の事前解釈 (コード付き) の分析は、必要な友人に参考にしていただけると幸いです。

JavaScript はインタープリタ言語です。JavaScript コードの実行には 2 つのステージが必要です。

  • コンパイル ステージ: コンパイル ステージは、JavaScript の事前解釈 (前処理) ステージとよく呼ばれます。この段階で、JavaScript インタープリターは JavaScript スクリプト コードのバイトコードへの変換を完了します。

  • #実行段階: コンパイル段階で、JavaScript インタープリターは実行を利用してバイトコードをバイトコードに変換します。環境 機械的なコードを生成し、上から下に順番に実行します。

#この記事は、事前解釈に焦点を当てています。

## フレームワーク図は次のとおりです。 JavaScript の事前解釈とは何ですか? JavaScript 事前解釈解析 (コード付き)
#1. 事前解釈とは

事前解釈:

JavaScript コードが実行される前に、ブラウザーはデフォルトですべての変数と関数を事前に宣言または定義します

1. 宣言と定義を理解する

宣言 (declare): たとえば、var num;=> は、変数がグローバル スコープ内にあることをブラウザに伝えます。は宣言されているだけですが、割り当てはなく、デフォルト値は未定義です。

定義 (定義済み): たとえば、num=12;=> と変数に値を割り当てます。

2. var および function キーワードの場合、事前解釈時にのみ動作が異なります。 # function => 事前解釈中に、事前のすべての宣言と定義が完了します。

3 事前解釈は現在のスコープ内でのみ行われます。

例: 最初はウィンドウの下のコンテンツのみが事前解釈され、関数内の関数は関数が実行されるときにのみ事前解釈されます。

2 スコープ チェーン。

1 .プライベート変数とグローバル変数を区別するにはどうすればよいですか?

1) グローバル スコープで宣言された変数 (事前解釈された場合) はグローバル変数です

2) 関数の実行のみがプライベート効果を生成します。 for(){}、if(){}、switch(){} はプライベート スコープを生成しません

3) 「プライベート スコープ」(var 宣言) で宣言された変数「関数パラメータ」は両方ともプライベート変数です。プライベート スコープでは、コードが実行されて変数が見つかったときに、まずそれがプライベート変数であるかどうかを判断する必要があります。プライベート変数である場合、プライベート変数でない場合は、外部との関係がありません。現在のスコープの上位スコープを検索します。上位スコープがない場合は、ウィンドウが見つかるまで検索を続けます。

プライベート変数とグローバル変数を区別する例を見てみましょう:

//=>变量提升:var a;var b;var c;test=AAAFFF111;
var a=10,b=11,c=12;
function test(a){
//=>私有作用域:a=10 var b;
a=1;//=>私有变量a=1
var b=2;//=>私有变量b=2
c=3;//=>全局变量c=3
}
test(10);
console.log(a);//10
console.log(b);//11
console.log(c);//3
ログイン後にコピー

プライベート変数が関数内で var で宣言された変数および仮パラメータであるかどうかを判断する 1 つの基準関数のそれらはすべてプライベート変数です。この質問では、a はテスト関数の仮パラメータであり、var b で定義された変数 b はプライベート変数です。 2. 関数パラメータの受け渡し

これは、関数が実行されると、最初に新しいプライベート スコープが形成され、次に次の手順に従って実行されるためです。

1) 仮パラメータがある場合は、最初に仮パラメータに値を割り当てます

#2) プライベート スコープで事前解釈を実行します

3) プライベート スコープのコードは上から下に実行されます

例を見てみましょう

var total=0;
function fn(num1,num2){
console.log(total);//->undefined 外面修改不了私有的
var total=num1 +num2;
console.log(total);//->300
}
fn(100,200);
console.log(total);//->0 私有的也修改不了外面的
ログイン後にコピー
3。 #スタックメモリ:使用 JSコード実行のための環境、つまりスコープ(グローバルスコープ/プライベートスコープ)を提供します

ヒープメモリ:参照データ型の値を格納するために使用します。オブジェクトには属性名と属性値が格納され、関数にはコード文字列が格納されます。

3. グローバル スコープでの var ありと var なしの違い

まず次の 2 つの例を見てみましょう:

//例题1
console.log(num);//->undefined
var num=12;
ログイン後にコピー
//例题2
console.log(num2);//->Uncaught ReferenceError:num2 is not defined 
num2=12;//不能预解释
ログイン後にコピー
var num=12 が表示されると、それはただの発言だと思うかもしれません。しかし、JavaScript は実際には var num; と num=12; という 2 つの宣言ステートメントとして扱います。最初の定義ステートメントは解釈前の段階で作成されます。 2 番目の代入ステートメントは、実行フェーズ を待って所定の位置に残されます。 num2=12 は、num2 という属性名を window に追加することと同等で、属性値は 12 です。また、var num=12 は、グローバル変数 num をグローバル スコープに追加することと同等です。属性名は num2、属性値は 12 です。

この 2 つの最大の違い: var を使用したものは事前解釈できるため、代入前に実行してもエラーは報告されませんが、var を使用しないものは事前解釈できず、実行時にエラーが報告されます。 before;

次に例を示します:

//例题1
var total=0;
function fn(){
console.log(total);//undefined
var total=100;
}
fn();
console.log(total);//0
ログイン後にコピー
//例题2
var total=0;
function fn(){
console.log(total);//0
total=100;
}
fn();
console.log(total);//100
ログイン後にコピー

例 1 では、var 変数はプライベート スコープで事前に解釈できるため、最初のコンソールによって出力される値は次のようになります。未定義。 プライベート スコープに表示される変数がプライベートでない場合は、上位レベルのスコープを検索します。上位レベルのスコープがない場合は、ウィンドウが見つかるまで上方向に検索を続けます。

、var のない変数はプライベートではないため、上司に相談してください。

4. 非倫理的な行為の 5 つの主要な兆候を事前に説明します。

1 事前に説明するときは、条件に関係なく。 true かどうかに関係なく、事前に var を宣言する必要があります。 次の質問例をご覧ください:

if(!("num" in  window)){
var num=12;//这句话会被提到大括号之外的全局作用域:var num;->window.num; 
}
console.log(num);//undefined
ログイン後にコピー

2.预解释的时候只预解释”=”左边的,右边的值,不参与预解释

请看下面这道例题:

fn();//报错
var fn=function (){  //window下的预解释:var fn;
console.log("ok");
};
ログイン後にコピー

3.自执行函数:定义和执行一起完成了。

自执行函数定义的那个function在全局作用域下不进行预解释,当代码执行到这个位置的时候定义和执行一起完成了。常见有以下几种形式:

(function(num){})(10);
~function(num){}(10);
+function(num){}(10);
-function(num){}(10);
!function(num){}(10);
ログイン後にコピー

4.函数体中return下面的代码虽然不再执行了,但是需要进行预解释;return后面跟着的都是我们返回的值,所以不进行预解释;

function fn(){
//预解释:var num;
console.log(num);//->undefined
return function(){};
var num=100;
}
ログイン後にコピー

5.函数声明和变量声明都会被提升。但是一个值得注意的细节(这个细节可以出现在有多个“重复”声明的代码中)是函数会首先被提升,然后才是变量。在预解释的时候,如果名字已经声明过了,不需要从新的声明,但是需要重新的赋值;

我们先来看下两个简单的例子:

//例题1
 function a() {}
  var a
  console.log(typeof a)//'function'
ログイン後にコピー
//例题2
  var c = 1
  function c(c) {
    console.log(c)
    var c = 3
  }
  c(2)//Uncaught TypeError: c is not a function
ログイン後にコピー

当遇到存在函数声明和变量声明都会被提升的情况,函数声明优先级比较高,最后变量声明会被函数声明所覆盖,但是可以重新赋值,所以上个例子可以等价为

 function c(c) {
  console.log(c)
    var c = 3
  }
 c = 1
 c(2)
ログイン後にコピー

接下来我们看下两道比较复杂的题目:

//例题3
fn();
function fn(){console.log(1);};
fn();
var fn=10;
fn();
function fn(){console.log(2);};
fn();
ログイン後にコピー

1.一开始预解释,函数声明和赋值一起来,fn 就是function fn(){console.log(1);};遇到var fn=10;不会重新再声明,但是遇到function fn(){console.log(2);}就会从重新赋值,所以一开始fn()的值就是2

2.再执行fn();值不变还是2

3.fn重新赋值为10,所以运行fn()时报错,接下去的语句就没再执行。

//例题4
alert(a);
a();
var a=3;
function a(){
alert(10)
}
alert(a);
a=6;
a()
ログイン後にコピー

1.函数声明优先于变量声明,预解释时候,函数声明和赋值一起来,a就是function a(){alert(10)} ,后面遇到var a=3,也无需再重复声明,所以先弹出function a(){alert(10)}

2.a(),执行函数,然后弹出10

3.接着执行了var a=3; 所以alert(a)就是显示3

4.由于a不是一个函数了,所以往下在执行到a()的时候, 报错。


以上がJavaScript の事前解釈とは何ですか? JavaScript 事前解釈解析 (コード付き)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:segmentfault.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート