This books is published on 2012, some information is outdated. But it is still a good start to get deeper understand on javascript, not only the language itself, also the implementation in different browsers. The book spent certain pages to explain the workaround in IE, we can just skip them. This book skips some JavaScript specification which does not implemented by any browser (at that time). We may need to get up-to-date information from other place

Chapter 1: What is JavaScript?

• ECMAScript != JavaScript
  • ECMAScript is part of JavaScript
  • JavaScript include
    • The Core (ECMAScript)
    • The Document Object Model
    • The Browser Object Model

The Document Object Model

• DOM provides methods and interfaces for working with the content of a web page
• Allow programmer change the page appearance without reload the page
• DOM is also implement in other language
• DOM levels
  • Level 1
    • DOM core: map xml based document to data structure which is easy to access
      • Should be DOM tree, but I don’t know does it provide extra feature
    • DOM HTML: extended DOM core by adding HTML-specific objects and method
  • Level 2
    • DOM View
    • DOM Events
    • DOM style
    • DOM Traversal and Range
  • Level 3
    • DOM Load and Save
    • DOM Validation
    • Extended DOM core to support all XML 1.0
• Other DOMs
  • SVG
  • MathML
  • Synchronized Multimedia Integration Language (SMIL)

The Browser Object Model (BOM)

• BOM provides methods and interfaces for interacting with the browser
  • pop up new windows
  • move, resize and close browser windows
  • navigator object
  • location object
• It is not standardize for a long time, until HTML5

Chapter 2: JavaScript in HTML

• Traditionally, we put JavaScript on header
  • It is download and parsed before content (blocking)
  • Use async and defer attributes in <script>
• Or put it at the end of body, so the html content is parsed first

Defer

• The purpose of defer is to indicate that a script won’t be changing the structure of the page as it executes.
  • Even the HTML5 specific defer script will run in order, but this may not happen in real world.
  • So keep at most one defer script
• Script can be loaded before DOMContentLoaded

Async

• async, run immediately after download, can run before or after DOMContentloaded, but guaranteed before loaded

Inline script in XHTML

• Less than sign make in script tag make XHTML broken, as it is consider as an open tag
  • Use <
  • Use CDATA section

External script is better

• Maintainable
• Caching
• Future-proof
  • Don’t need to use the hack for XHTML
  • Same script work in both HTML and XTHML

Chapter 3: Language Basics

• variable not declared by var will be global
• typeof null return object
• typeof regex is object (chrome 7 have a bug, which return function)
• variable not declared !== undefined variable
  • using variables not declared throw error (reference error)
• typeof variables not declared return undefined

Number

• octal number start with 0
• octal number is invalid in strict mode
• octal number can be tricky: 078-077 = 15
• number large than max value or small than smallest value will become (negative) infinity
• typeof NaN is number
• NaN will make the computation return NaN
• NaN not equal to any value
  • so we have to use isNaN()

Number vs Parser Int

• be careful when parsing number with leading 0
  • number start with 0 will be consider as octal number
  • always include 10 in second parameter

Built in object method

• null and undefined don’t have toString()
• String() alway return string, it is good when you don’t know the value whether null or undefined
• Can also convert to string by concatenating empty string
  • I think it is more straight forward.
• hasOwnProperty('propertyName') checks the property exist (do not check prototype)
• propertyIsEnumerable('propertyName'), whether can use for-in
• toLocateString() return localization string
• valueOf(), toString() will be called if apply operator on object

Notice that BOM and DOM is not included in ES standard, they may or may not follow the ES object standard

Other

• bitwise operator
  • value converted to number by Number() (32 bit numbers)
• arguments is an array-like object, but it is not array
• string is not object in JavaScript, unlike other language
• ECMA-262 specifies that any object implementing the internal [[Call]] method should return “function” from typeof
  • user defined call() seems does not works

Chapter 4: Variables, Scope, and Memory

• In browser, global context = windows
• 5 types of scope in browser
  • global, function, eval(), catch block, with block
• browser optimized variable look up, don’t worry about access variable from different scope
• Circular reference no longer leak memory, in browser
• Garbage collect can be trigger by code in some browser, but it is not recommended
• Release memory by dereference them (set variable to null)

Chapter 5 Reference Types

• Function interface
  • The best approach is to use named arguments for those that are required arguments
  • And an object literal to encompass multiple optional arguments.
• Use {} and [] create object and array, the Object() and Array() constructor is not called
• Arrays can contain a maximum of 4,294,967,295 items.
  • If you try to add more than that number, an exception occurs.
  • A long-running script error may be thrown before you reach the arrays’ maximum.
• instanceof assumes a single global execution context.
  • Different frames in a web page haves distinct global execution contexts and therefore two versions of the Array constructor.
  • If you were to pass an array from one frame into a second frame, that array has a different constructor function than an array created natively in the second frame.
  • To solve this problem, ECMAScript 5 introduced the Array.isArray() method
• toString() of date object of different browser return stings with different format
• use string to define regex, need to escape the slash as it is escape character in string (not regex)
  • source property in regex object does not have slash
  • Better not to use string to create REGEX
• function constructor is not recommended, as it caused performance issue.
• strict mode does not support callee and caller
  • Using arguments.callee can decouple recursive functions
  • arguments.callee.caller return parent function
• length property of a function is # of named arguments
• In strict mode, the this value of a function called without a context object is not coerced to window.
  • this becomes undefined unless explicitly set by either attaching the function to an object or using apply() or call().
• Primitive type cannot have custom properties
  • Can workaround by using constructor to create primitive type wrapper
    • var j = new Number(1234);
  • typeof return Object for primitive type wrapper
• There was method to format HTML dynamically, but it is not implemented by browsers now.
• Singleton object
  • global scope and Math
• In strict mode, the variable created in eval() cannot be access from outside