龙空技术网

JavaScript-预编译

前端Cold 149

前言:

如今大家对“js代码编译”大约比较重视,我们都需要了解一些“js代码编译”的相关知识。那么小编在网摘上网罗了一些关于“js代码编译””的相关内容,希望小伙伴们能喜欢,咱们快快来了解一下吧!

什么是预编译?

预编译发生在函数作用域创建的阶段在函数执行之前。

函数、形参、变量的优先级别:

函数 > 形参 > 变量

全局作用域预编译

创建GO对象(Global Object)查找变量声明,将变量名作为GO对象的属性名,只为 undefined查找函数声明,值为函数体

函数作用域预编译

创建AO对象(Active Object)查找函数形参以及函数内部的变量声明,形参名及变量名作为AO对象的属性,值为 undefined实参和形参相统一,实参值赋给形参查找函数声明,函数名作为AO对象的属性,如果函数名称和变量名称相同时会覆盖变量声明

function fn(a){    console.log(a,1);  // ƒ a () {} 1    var a = 2222;    console.log(a,2); // 2222 2    function a () {}    console.log(a,3); // 2222 3}fn(1,2)
示例
function fn(a, c) {    console.log(a);    var a = 123;    console.log(a);    console.log(c);    function a() { }    if (false) {        var d = 678    }    console.log(d);    console.log(b);    var b = function () { }    console.log(b);    function c() { }    console.log(c);}fn(1, 2)

第一阶段:创建 AO 对象,查找函数形参以及函数内部的变量声明,实参和形参相统一,如果没有传递实参,那么值为 undefined

AO : {    a : undefined -> 1    c : undefined -> 2    b : undefined    d : undefined}

第二阶段:查找函数声明

AO : {    a : undefined -> 1 -> function a() { }    c : undefined -> 2 -> function c() { }    b : undefined -> function () { }    d : undefined}

执行代码

function fn(a, c) {    console.log(a); // function a() { }    var a = 123;    console.log(a); // 123    console.log(c); // function c() { }    function a() { }    if (false) {        var d = 678    }    console.log(d); // undefined    console.log(b); // undefined    var b = function () { }    console.log(b);  // function () { }    function c() { }    console.log(c); // function c() { }}fn(1, 2)

标签: #js代码编译