JavaScript - the hard parts, Yehonatan Daniv

Get Started. It's Free
or sign up with your email address
JavaScript - the hard parts, Yehonatan Daniv by Mind Map: JavaScript - the hard parts, Yehonatan Daniv

1. slides

1.1. ...

1.1.1. document reference to the DOM contained in window this isn't JS it's a reference to the HTML DOM elements

1.2. types

1.2.1. window the global scope (browser-based JS) implemented as JS object everything defined is there

1.2.2. local either function with

2. general

2.1. namespace of all things defined

2.2. JS engine goes over names to resolve them

2.3. scope is created once we define it

2.3.1. e.g. function

2.4. internally, engine creates a scope

2.4.1. allocates memory

2.5. when the function is called, the scope is initialized

2.6. nested scopes create scope chain

2.6.1. that's what the engine traverses when doing resolution

2.7. {} forms a scope in other languages, but not in JS

3. scopes & scope chains

3.1. Scope

3.1.1. Variable Object VO holds all *identifiers* declared in its context

3.1.2. For the global object it's window

3.1.3. there's a scope created when going over the definition, & there's an activation object when the function is invoked Execution context including parameters & context

3.2. Execution context

3.2.1. EC

3.2.2. VO + [[scope]] + the "this" value

3.2.3. Forms a closure the execution context state is kept alive with the function

3.3. Flow

3.3.1. (see diagrams on slides)

3.4. Q&A

3.4.1. JS is as ugly as PHP, in the sense that there isn't much difference between local & global variables It's very easy to override global variables when defining local variables & vice versa, define global variables in local scopes by mistake

4. about

4.1. Yehonatan Daniv

4.1.1. Django & Client-side developer

4.2. tag line

4.2.1. how I learned to stop worrying & love JS

4.3. the talk is on the high-level, not about internals

4.3.1. which are dry & boring

5. The parts

5.1. this

5.1.1. a property of the EC

5.1.2. immutable can't do: this = ...

5.1.3. a reference to a JS object or to null

5.1.4. assigned by the caller when EC is created & entered

5.1.5. determined by the current form of call expression engine checks what's left to the () reference type else examples function foo() { alert(this); } foo(); foo.prototype.constructor(); dynamic binding: in JS there are 9 types ..

5.1.6. call expressions examples Untitled ...

5.1.7. determination rule of thumb if a function is passed as a parameter

5.1.8. to change that use bind since ES5, it's in Function.prototype using the trick when we have a scope within scope or use global objects & always invoke methods of these global objects

5.2. prorotype & the __proto__ chain

5.2.1. The "OOP" in JS

5.2.2. history JS was developed in about 2 weeks was based on several paradigms Java, Python, Lisp &c

5.2.3. OOP in JS Instead of class -> Object Instead of instance -> Object Instead of super -> __proto__ implemented inly in some browsers

5.2.4. [[prototype]] Every Object in JS has an internal, accessible & Immutable property - [[prototype]] For Mozilla __proto__ For others ... Eince ES5 Object.create Object.getProtoytpeOf

5.2.5. functions have an attribute called prototype

5.2.6. Prototype chains resolution chain is like scope Object.property_name

5.2.7. ES3 syle Untitled enables us to create instances with given object as prototype

5.2.8. ES5 style Untitled Untitled

5.3. Q&A

5.3.1. ES5 (EcmaScript) supported in? IE >= 9 FF >= 3.5 Chrome Safari >= 5.1

5.3.2. JS will be killed next week by Google's Dart