addeventlistener 的第三個參數

在Mozilla的網頁上 我們可以看到 addeventlistenter的定義是

Syntax

target.addEventListener(type, listener[, useCapture]);

type

A string representing the event type to listen for.

listener

The object that receives a notification when an event of the specified type occurs. This must be an object implementing theEventListener interface, or simply a JavaScript function.

useCapture Optional

If true, useCapture indicates that the user wishes to initiate capture. After initiating capture, all events of the specified type will be dispatched to the registered listener before being dispatched to any EventTarget beneath it in the DOM tree. Events which are bubbling upward through the tree will not trigger a listener designated to use capture. See DOM Level 3 Events for a detailed explanation. Note that this parameter is not optional in all browser versions. If not specified, useCapture is false.

但到底什麼是useCapture呢，其實就是說，我們新加的event，要在哪一個Phase下被呼叫

Event呼叫分成三個步驟

1.Capture phase

2.Target phase (Found target object)

3.Bubbling phase

如下圖

當useCapture = false代表要在Bubbling phase才呼叫event，因此，新加的event會等他所有children的event handlers做完後，才會被呼叫。

反之，當useCapture = true代表要在Capture phase呼叫event，因此，新加的event會在他child event handler被呼叫前，先被呼叫。

=== vs ==

The == operator will compare for equality after doing any necessary type conversions. The === operator will not do the conversion, so if two values are not the same type === will simply return false. It's this case where === will be faster, and may return a different result than ==. In all other cases performance will be the same.

To quote Douglas Crockford's excellent JavaScript: The Good Parts,

JavaScript has two sets of equality operators: === and !==, and their evil twins == and !=. The good ones work the way you would expect. If the two operands are of the same type and have the same value, then === produces true and !== produces false. The evil twins do the right thing when the operands are of the same type, but if they are of different types, they attempt to coerce the values. the rules by which they do that are complicated and unmemorable. These are some of the interesting cases:

'' == '0'           // false
0 == ''             // true
0 == '0'            // true
false == 'false'    // false
false == '0'        // true
false == undefined  // false
false == null       // false
null == undefined   // true
' \t\r\n ' == 0     // true

The lack of transitivity is alarming. My advice is to never use the evil twins. Instead, always use === and!==. All of the comparisons just shown produce false with the === operator.

Reference:
  http://stackoverflow.com/questions/359494/javascript-vs-does-it-matter-which-equal-operator-i-use

typeof function

typeof(para)  會回傳 para 的型別

可能的回傳值有 "number"、"string"、"boolean"、"object"、"function" 和 "undefined"

以下是例子

document.writeln(typeof(1)); // number
document.writeln(typeof("str")); // string
document.writeln(typeof(true)); // boolean
document.writeln(typeof({})); // object
document.writeln(typeof([])); // object
document.writeln(typeof(function(){})); // function


document.writeln(typeof(new Number(1))); // object
document.writeln(typeof(new String("str"))); // object
document.writeln(typeof(new Boolean(true))); // object
document.writeln(typeof(new Object())); // object
document.writeln(typeof(new Array())); // object
document.writeln(typeof(new Function())); // function


document.writeln(1 == new Number(1)); // true
document.writeln("str" == new String("str")); // true
document.writeln(true == new Boolean(true)); // true


document.writeln(typeof(new Number(1) + 0)); // number
document.writeln(typeof(new Number(1).valueOf())); // number
document.writeln(typeof(new String("str").valueOf())); // string
document.writeln(typeof(new Boolean(true).valueOf())); // boolean


Reference:

  http://www.jb51.net/article/16342_2.htm

  http://ticore.blogspot.tw/2008/05/javascript-typeof-oddity.html