1. Javascript - Core

2. object
• Javascript ( int)
object
• function object
• object拥 组properties 为
null prototype

3. object
• 义 var foo = { x:10, y: 20 };
• 读 foo.x OR foo[‘x’]
• 设 foo.x = 123 OR foo[‘x’] = 123
• 动态获 时

4. object
• prototype object
• 过__proto__ prototype
• foo.__proto__ OR
foo[‘__proto__’]

5. prototype chain
• object 过__proto__
实现继 property
• property 查 规则
• __proto__为null为
• property

6. prototype chain
• var a = { x: 10,
calculate: function(z) {
return this.x + this.y + z
}};
var b = { y: 20, __proto__: a };
var c = { y: 30, __proto__: a };
b.calculate(30); //60
c.calculate(40); //80
• “对 ”调 时 this 对

7. prototype chain
• object 认prototype
Object.prototype
• 认为Object Class
object Object
instance
• 实际 Object function

8. Constructor
• function Foo(y) { this.y = y; }
Foo.prototype.x = 10;
Foo.prototype.calculate = function(z) {
return this.x + this.y + z;
}
var b = new Foo(20);
var c = new Foo(30);
b.calculate(30); //60
c.calculate(40); //80
• 这样 new Foo(20);
• var new_instance = { __proto__: Foo.prototype };
Foo.call(new_instance, 20);
• Foo function Function instance __proto__
Function.prototype
• call Function.prototype 义 this

9. Constructor

10. String literal
• Instance • Constructor
• {} • Object
• [] • Array
• function() {} • Function
• 2 • Number
• true • Boolean

11. Quiz
• typeof Function ?
• typeof Function.__proto__ ?
• typeof Function.prototype ?
• Function.__proto__ == Function.prototype ?
• var Foo = function() {};
typeof Foo
typeof Foo.prototype ?
typeof Foo.__proto__ ?
typeof Foo.prototype.constructor ?

12. Execution Context
Stack
• global, function, eval (EC)
• global EC
• function EC 执

13. Execution Context
• EC object

14. Variable Object
• global EC VO
• var foo = 10;
function bar() {};
• function EC VO
• function foo(x, y) {
var z = 30;
function bar() {}
}
foo(10, 20);

15. Scope Chain
• prototype chain 查
询“member variables” path
• scope chain 查询“lexical
variables” path

16. Scope Chain
• var x = 10;
(function foo() {
var y = 20;
(function bar() {
var z = 30;
console.log(x + y + z);
})();
})();

17. __parent__
• __parent__ function 时
• global 义 __parent__ global
VO
• function 义 __parent__
function VO

18. Closures
• var foo = function() {
var x = 10;
}
foo();
• foo() VO 这
VO 对 foo()执
结 x

19. Closures
• var foo = function() {
var x = 10;
return function() { console.log(x) };
}
var boo1 = foo();
var boo2 = foo();
• 这 foo 执 function boo1 boo2
VO __parent__ foo VO 实
boo1 boo2 应 foo VO

20. Closures - Quiz
• var x = 10;
function foo() { console.log(x, y); }
(function (funArg) {
var x = 20;
var y = 30;
funArg();
})(foo);

21. Closures - Quiz
• function baz() {
var x = 1;
return {
foo: function foo() { return ++x; },
bar: function bar() { return --x; }
};
}
var closures = baz();
closures.foo();
closures.bar();

22. Closures

23. this
• function() this global
• obj.function() this obj
• function.call(obj) this obj
• new function() this obj

24. Q &A

25. The End