摘要：將單個事件綁定在父對象上，利用冒泡機制監(jiān)聽來自子元素的事件。事件目標當?shù)竭_目標元素之后，執(zhí)行目標元素該事件相應的處理函數(shù)。函數(shù)對象當使用去調(diào)用構造函數(shù)時，相當于執(zhí)行了原型對象上都有個預定義的屬性，用來引用它的函數(shù)對象。

將單個事件綁定在父對象上，利用冒泡機制,監(jiān)聽來自子元素的事件。

優(yōu)點：解決子元素增加刪除時候的事件處理，防止內(nèi)存泄漏

事件捕獲：當某個元素觸發(fā)某個事件（如onclick），頂層對象document就會發(fā)出一個事件流，隨著DOM樹的節(jié)點向目標元素節(jié)點流去，直到到達事件真正發(fā)生的目標元素。在這個過程中，事件相應的監(jiān)聽函數(shù)是不會被觸發(fā)的。

事件目標：當?shù)竭_目標元素之后，執(zhí)行目標元素該事件相應的處理函數(shù)。如果沒有綁定監(jiān)聽函數(shù)，那就不執(zhí)行。

事件起泡：從目標元素開始，往頂層元素傳播。途中如果有節(jié)點綁定了相應的事件處理函數(shù)，這些函數(shù)都會被一次觸發(fā)。如果想阻止事件起泡，可以使用e.stopPropagation()（Firefox）或者e.cancelBubble=true（IE）來組織事件的冒泡傳播。

stackoverflow

在全局環(huán)境時

// this 表示window

function f(){
    return this //也是window
}

放在object方法里面時

this綁定到包含他的對象

var obj = {
    name: "obj",
    f: function () {
        return this + ":" + this.name;
    }
};
document.write(obj.f());

var obj = {
    name: "obj1",
    nestedobj: {
        name:"nestedobj",
        f: function () {
            return this + ":" + this.name;
        }
    }            
}

document.write(obj.nestedobj.f()); //[object Object]:nestedobj

即使你隱式的添加方法到對象，this仍然指向
立即父對象

var obj1 = {
    name: "obj1",
}

function returnName() {
    return this + ":" + this.name;
}

obj1.f = returnName; //add method to object
document.write(obj1.f()); //[object Object]:obj1

當調(diào)用一個無上下問的函數(shù)

當函數(shù)調(diào)用沒有包含上下文,this將綁定到global對象

var context = "global";

var obj = {  
    context: "object",
    method: function () {                  
        function f() {
            var context = "function";
            return this + ":" +this.context; 
        };
        return f(); //invoked without context
    }
};

document.write(obj.method()); //[object Window]:global 

當使用在構造函數(shù)時

即使用new關鍵字時，this指向剛創(chuàng)建的對象

var myname = "global context";
function SimpleFun()
{
    this.myname = "simple function";
}

var obj1 = new SimpleFun(); //adds myname to obj1
//1. `new` causes `this` inside the SimpleFun() to point to the
//   object being constructed thus adding any member
//   created inside SimipleFun() using this.membername to the
//   object being constructed
//2. And by default `new` makes function to return newly 
//   constructed object if no explicit return value is specified

document.write(obj1.myname); //simple function

當內(nèi)部對象定義在原型鏈時

當一個方法定義在對象原型鏈，this指向調(diào)用該方法的對象

var ProtoObj = {
    fun: function () {
        return this.a;
    }
};
//Object.create() creates object with ProtoObj as its
//prototype and assigns it to obj3, thus making fun() 
//to be the method on its prototype chain

var obj3 = Object.create(ProtoObj);
obj3.a = 999;
document.write(obj3.fun()); //999

//Notice that fun() is defined on obj3"s prototype but 
//`this.a` inside fun() retrieves obj3.a   

在 call(), apply() and bind() 函數(shù)內(nèi)部

fun.apply(obj1 [, argsArray])
fun.call(obj1 [, arg1 [, arg2 [,arg3 [, ...]]]]) 
設置this函數(shù)并執(zhí)行
fun.bind(obj1 [, arg1 [, arg2 [,arg3 [, ...]]]])
設置this

this在事件處理上

如果函數(shù)在eventHandler和onclick直接被調(diào)用 this指向元素(currentTarget)
否則執(zhí)行window

Using `this` "directly" inside event handler or event property
click() "assigned" using addEventListner() 

click() "assigned" using click() 

used `this` directly in click event property

Using `this` "indirectly" inside event handler or event property
`this` used indirectly, inside function 
 defined & called inside event property


`this` used indirectly, inside function 
 called inside event property 


IE only: click() "attached" using attachEvent() 

當定義一個函數(shù)對象的時候，會包含一個預定義的屬性，叫prototype，這就屬性稱之為原型對象。

function F(){};
console.log(F.prototype)
//F.prototype包含
//contructor構造函數(shù)

JavaScript在創(chuàng)建對象的時候，都會有一個[[proto]]的內(nèi)置屬性，用于指向創(chuàng)建它的函數(shù)對象的prototype。原型對象也有[[proto]]屬性。因此在不斷的指向中，形成了原型鏈。

//函數(shù)對象
function F(){};
F.prototype = {
    hello : function(){}
};
var f = new F();
console.log(f.__proto__)

當使用new去調(diào)用構造函數(shù)時，相當于執(zhí)行了

var o = {};
o.__proto__ = F.prototype;
F.call(o);

原型對象prototype上都有個預定義的constructor屬性，用來引用它的函數(shù)對象。這是一種循環(huán)引用。

function F(){};
F.prototype.constructor === F;

( new Foo ).__proto__ === Foo.prototype
( new Foo ).prototype === undefined

__proto__真正的原型鏈
prototype只存在與構造函數(shù)中

沒有加括號

null===null
undefined === undefined

函數(shù)閉包（function closures），是引用了自由變量的函數(shù)。這個被引用的自由變量將和這個函數(shù)一同存在，即使已經(jīng)離開了創(chuàng)造它的環(huán)境也不例外

回調(diào)

apply 第二個參數(shù)是數(shù)組
call 第二個以后的可變參數(shù)

寫script

XMLHttpRequest

通過在網(wǎng)頁中加入script標簽，是瀏覽器通過get方式加載一段js代碼

通過 var 聲明的變量在代碼執(zhí)行之前被js引擎提升到了當前作用域的頂部

一個事件被觸發(fā)，會發(fā)生先捕獲后冒泡的行為。
冒泡機制指一個事件從發(fā)生元素開始先父元素傳遞，直到達到根元素

js dom 對象擁有的property，property有很多類型
attribute是指html擁有的特性，類型是字符串

DomContentLoaded事件發(fā)生在domcument對象被初始化完成，css，圖片和frame還沒被加載的時候

load事件表示資源被全部加載

==會發(fā)生類型轉換
===不會發(fā)生類型轉換

同源策略限制從一個源加載的文檔或腳本如何與來自另一個源的資源進行交互

http://store.company.com/dir2... 成功
http://store.company.com/dir/... 成功
https://store.company.com/sec... 失敗 不同協(xié)議 ( https和http )
http://store.company.com:81/dir/etc.html 失敗 不同端口 ( 81和80)
http://news.company.com/dir/o... 失敗 不同域名 ( news和store

[1,2,3,4,5].duplicator(); // [1,2,3,4,5,1,2,3,4,5]
Arrry.prototype.duplicator = function(){
    return this.concat(this)
}

"use strict" 告訴js運行時以嚴格模式執(zhí)行javascript語句
使js以更安全的方式執(zhí)行，對某些行為直接報錯

for(let i=1;i<=100;i++){
    let word = ""
    if(i % 3 ==0){
        word += "fizz"
    }
    if(i % 5 ==0){
        word += "buzz"
    }
    if(word){
        console.log(word)
    }
}

單頁應用是指所有的資源交互都放在一個頁面，而不是交互的時候跳轉到另一個頁面。
使用ssr服務端渲染。

new Promise(resolve,reject)
Promise.resolve
Promise.reject

將回調(diào)轉換成鏈式調(diào)用

console.log
debuger

array array.foreach
object for var i in xx i是字符串

mutable
imuutable表示對象創(chuàng)建后就不再變化

可以比較對象，線程安全
缺點就是費內(nèi)存

同步是指順序執(zhí)行，會有阻塞
異步是指函數(shù)立即執(zhí)行并返回

主線程運行的時候，產(chǎn)生堆（heap）和棧（stack），棧中的代碼調(diào)用各種外部API，它們在"任務隊列"中加入各種事件（click，load，done）。只要棧中的代碼執(zhí)行完畢，主線程就會去讀取"任務隊列"，依次執(zhí)行那些事件所對應的回調(diào)函數(shù)。

javascript中的所有任務分為兩類，
一類是同步任務，另一種是一部任務。
所有的同步任務都在主線程上執(zhí)行，
當同步任務執(zhí)行完在執(zhí)行異步任務。

call stack 指主線線程執(zhí)行任務的地方，當調(diào)用棧為空的時候，
會去輪詢task queue，然后將隊列里的任務加入棧中執(zhí)行
tast queue 按照包含一系列任務的隊列

第一個表示生成一個命名的函數(shù)
第二個表示生成一個匿名函數(shù) ，并賦值給foo

let var const都表示申明一個變量

var的作用于是函數(shù)體的全部，會發(fā)生作用于提升
let，const是塊級作用域
let表示可以被多次賦值
const表示只能被一次賦值

js的加法只有兩種

字符串和字符串的相加

數(shù)字和數(shù)字的相加

加法運算會觸發(fā)三種轉換

原始值

數(shù)字

字符串

> [] + []
""
//[].toString()為空字符串,空字符串相加

> [] + {}
"[object Object]"

> {} + {}
"NaN" 
// 火狐下為NaN 因為第一個對象當作空代碼塊，實際執(zhí)行為 +{}