Your SlideShare is downloading. ×
  • Like
Javascript - The core
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Now you can save presentations on your phone or tablet

Available for both IPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Javascript - The core

  • 292 views
Published

 

Published in Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to like this
No Downloads

Views

Total Views
292
On SlideShare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
3
Comments
1
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n

Transcript

  • 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