JavaScript Internal Power Variable Object
##Directory
(Free learning recommendation:javascript video tutorial)
Preface
When programming JavaScript, we cannot avoid declaring functions and variables in order to successfully build our system, but how and where does the interpreter find these functions and variables? What exactly happens when we reference these objects? In the previous article "Execution Context in JavaScript" we mentioned part of it. When JavaScript code executes a piece of executable code (executable code), a corresponding execution context (execution context) will be created. For each execution context, there are three important attributes:1. Variable object
In the function context, we use the activation object (activation object, AO) to represent variable objects. Active objects and variable objectsActually are the same thing:
var VO = {}; // 变量对象
activeContext = { VO: { // 上下文数据(var, FD, function arguments) }};
var a = 10;function func(x){ var b = 20;}func(30);
// 全局变量对象VO(Global) = { a: 10, func: reference to function plus(){}}// func函数上下文的变量对象VO(func functionContext) = { x: 30, b: 20};
2. Global variable object
Let’s first understand a concept called global object. Also introduced in W3School:Global objects are predefined objects that serve as placeholders for JavaScript global functions and global properties. By using the global object, you can access all other predefined objects, functions, and properties.1. It can be referenced through this. In client-side JavaScript, the global object is the Window object.
console.log(this); //Window
console.log(this instanceof Object); // true
// 都能生效console.log(Math.random()); //随机数console.log(this.Math.random()); //随机数
var a = 1;console.log(this.a);// 1
var a = 1;console.log(window.a); // 1this.window.b = 2;console.log(this.b); // 2
variable objectin the global context is the global object!
3. Variable objects in function context
In the function execution context, VO cannot be accessed directly. At this time Theactivation object(activation object, abbreviated as AO) plays the role of
VO.
VO(functionContext) === AO
AO = { arguments:}
function foo(x, y, z) { // 声明的函数参数数量arguments (x, y, z) alert(foo.length); // 3 // 真正传进来的参数个数(only x, y) alert(arguments.length); // 2 // 参数的callee是函数自身 alert(arguments.callee === foo); // true // 参数共享 alert(x === arguments[0]); // true alert(x); // 10 arguments[0] = 20; alert(x); // 20 x = 30; alert(arguments[0]); // 30 // 不过,没有传进来的参数z,和参数的第3个索引值是不共享的 z = 40; alert(arguments[2]); // undefined arguments[2] = 50; alert(z); // 40 } foo(10, 20);
函数声明
变量声明
举个例子:
function foo(a) { var b = 2; function c() {} var d = function() {}; b = 3;}foo(1);
在进入执行上下文后,这时候的 AO 是:
AO = { arguments: { 0: 1, length: 1 }, a: 1, b: undefined, c: reference to function c(){}, d: undefined}
在代码执行阶段,会顺序执行代码,根据代码,修改变量对象的值
还是上面的例子,当代码执行完后,这时候的 AO 是:
AO = { arguments: { 0: 1, length: 1 }, a: 1, b: 3, c: reference to function c(){}, d: reference to FunctionExpression "d"}
到这里变量对象的创建过程就介绍完了,让我们简洁的总结我们上述所说:
思考题
最后让我们看几个例子:
1.第一题
function foo() { console.log(a); a = 1;}foo(); // ???function bar() { a = 1; console.log(a);}bar(); // ???
第一段会报错:Uncaught ReferenceError: a is not defined
。
第二段会打印:1
。
这是因为函数中的 “a” 并没有通过 var 关键字声明,所有不会被存放在 AO 中。
第一段执行 console 的时候, AO 的值是:
AO = { arguments: { length: 0 }}
没有 a 的值,然后就会到全局去找,全局也没有,所以会报错。
当第二段执行 console 的时候,全局对象已经被赋予了 a 属性,这时候就可以从全局找到 a 的值,所以会打印 1。
2.第二题
console.log(foo);function foo(){ console.log("foo");}var foo = 1;
会打印函数,而不是 undefined 。
这是因为在进入执行上下文时,首先会处理函数声明,其次会处理变量声明,如果如果变量名称跟已经声明的形式参数或函数相同,则变量声明不会干扰已经存在的这类属性。
相关免费学习推荐:javascript(视频)
The above is the detailed content of Variable objects in minimalist JavaScript. For more information, please follow other related articles on the PHP Chinese website!