參考 學習網站
術語
- ECMAScript
European Computer Manufacturer's Association
歐洲計算機制造商協會 - DOM
Document Object Model
瀏覽器所開放的底層的文檔對象模型 - CSS
Cascading Style Sheet
級聯樣式表
前言
本文著重JavaSript語言的兩點特性，即函數和對象，其他如變量，運算符，語句
基本語法
- 分號 ;
JavaScript的語法和Java語言類似，每個語句以 ; 結束 ，
以//開頭直到行末的字符被視為行注釋 另一種塊注釋是用/.../把多行字符包裹起來
var x = 1;
"Hello world";
var x = 1; var y = 2; // 不建議一行寫多個語句!
/*
語句塊用{...}
{...}還可以嵌套，形成層級結構
*/
if (2 >1) {
x = 1;
y = 2;
z = 3;
if (x < y) {
z = 4;
}
if (x > y) {
z = 5;
}
}
變量
運算符
語句
函數
定義函數
在JavaScript中，定義函數的方式如下:
function abs(x) {
if (x >= 0) {
return x;
} else {
return -x;
}
}
上述 abs()函數的定義如下：
- function 指出這是一個函數定義
- abs 是函數的名稱
- (x) 括號內列出函數的參數， 多個參數以 , 分隔
- { ... }之間的代碼是函數體，可以包含若干語句，甚至可以沒有語句
請注意，函數體內部的語句在執行時，一旦執行到 return 時，函數就執行完畢，并將結果返回。因此，函數內部通過條件判斷和循環可以實現非常復雜的邏輯。
如果沒有return語句，函數執行完畢后也會返回結果，只是結果為undefined。
由于JavaScript的函數也是一個對象，上述定義的 abs() 函數實際上是一個函數對象，而函數名 abs 可以視為指向該函數的變量。
因此，第二種定義函數的方式如下：
var abs = function (x) {
if ( x >= 0) {
return x;
}else {
return -x;
}
};
在這種方式下， function (x) { ... } 是一個匿名函數，它沒有函數名。但是，這個匿名函數賦值給了變量 abs , 所以, 通過變量 abs 就可以調用該函數。
上述兩種定義完全等價，注意第二種方式按照完整語法需要在函數體末尾加一個; ， 表示賦值語句結束。
調用函數
調用函數時，按順序傳入參數即可:
abs(10); // 返回10
abs(-9); // 返回9
由于JavaScript允許傳入任意個參數而不影響調用，因此傳入的參數比定義的參數多也沒有問題
abs(10, 'hilohi'); // 返回10
abs(-9, 'hi','lo',null); //返回9
傳入的參數比定義的少也沒有問題
abs(); // 返回NaN
此時 abs(x) 函數的參數 x 將收到 undefined ,計算結果為 NaN。
要避免收到 undefined , 可以對參數進行檢查:
function abs ( x ) {
if (typeof x !== 'number') {
throw 'Not a number'
}
if (x >= 0) {
return x;
} else {
return -x;
}
}
arguments
JavsScript還有一個免費贈送的關鍵字arguments,它只在函數內部起作用，并且永遠指向當前函數的調用者傳入的所有參數。 arguments 類似 Array 但它不是一個Array
function foo (x) {
alert (x); // 10
for (var i =0; i < arguments.length; i++) {
arert(arguments[i]); // 10,20,30
}
}
foo(10,20,30);
利用arguments，你可以獲得調用者傳入的所有參數。也就是說，即使函數不定義任何參數，也是可以拿到參數的值
function abs() {
if (arguments.length === 0) {
return 0;
}
var x = arguments[0];
return x >= 0 ? x : -x;
}
abs(); // 0
abs(10); // 10
abs(-9); // 9
實際上arguments最常用于判斷傳入參數的個數。你可能回看到這樣的寫法:
//foo(a [, b],c)
//接收2-3個參數，b是可選參數，如果只傳2個參數，b默認為null:
function foo (a, b, c) {
if (arguments.length === 2) {
//實際拿到的參數是 a和b , c 為undefined
c = b; // 把 b 賦給 c
b = null; // b 變為默認值
}
// ...
}
要把中間的參數b變為'可選'參數，就只能通過arguments判斷，然后重新調整參數并賦值。
rest參數
由于JavaScript函數允許接收任意個參數，于是我們就不得不用arguments來獲取所有參數:
function foo (a , b) {
var i ,rest = [ ];
if (arguments.length > 2) {
for (i = 2; i < arguments.length ; i++) {
rest.push(arguments[i]);
}
}
console.log('a = ' + a);
console.log('b = ' + b);
console.log(rest);
}
為了獲取除了已定義參數a b之外的參數，我們不得不用arguments,并且循環要從索引2開始以便排除前兩個參數，這種寫法很別扭，只是為了獲得額外的rest參數，有沒有更好的方法？
ES6標準引入了rest參數，上面的函數可以改寫為：
function foo (a,b, ...rest) {
console.log('a = ' + a);
console.log('b = ' + b);
console.log(rest);
}
foo(1, 2, 3, 4, 5);
// 結果"
// a = 1
// b = 2
// Array [ 3, 4, 5]
foo(1);
//結果:
//a = 1
//b = undefined
//Array [ ]
rest參數只能寫在最后，前面用 ... 標識，從運行結果可知，傳入的參數先綁定a 、b，多余的參數以數組形式交給變量rest , 所以，不再需要arguments我們就獲取了全部參數。
如果傳入的參數連正常定義的參數都沒填滿，也不要緊，rest參數會接收一個空數組 （注意不是undefined）
小心你的return語句
前面我們講到了JavaScript引擎有一個行末自動添加分號的機制，這可能讓你栽到return語句的一個大坑
function foo() {
return { name : 'foo'};
}
foo(); //{name: 'foo'}
如果把return語句拆成兩行
function foo() {
return
{ name : 'foo'};
}
foo(); // undefined
要小心了，由于JavaScript引擎在行末自動添加分號的機制，上面的代碼實際變成了
function foo() {
return; //自動添加了分號，相當于return undefined;
{ name: 'foo'}; //這行語句已經沒法執行到了
}
所以正確的多行寫法是
function foo() {
return {
name : 'foo'
};
}
變量作用域
在JavaScript中，用 var 申明的變量實際上是有作用域的。
如果一個變量在函數體內部申明，則該變量的作用域為整個函數體，在函數體外不可引用該變量
'use strict';
function foo() {
var x = 1;
x = x + 1;
}
x = x + 2; // ReferenceError! 無法在函數體外引用變量x
如果兩個不同的函數各自申明了同一個變量，那么該變量只在各自的函數體內作用。換句話說，不同函數內部的同名變量互相獨立，互不影響
'use strict'
function foo() {
var x = 1;
x = x + 1;
}
function bar() {
var x = 'A';
x = x + 'B';
}
由于JavaScript的函數可以嵌套，此時，內部函數可以訪問外部函數定義的變量，反過來則不行：
'user strict';
function foo() {
var x = 1;
function bar() {
var y = x + 1; //bar 可以訪問foo的變量x!
}
var z = y + 1; //ReferenceError! foo不可以訪問bar的變量y!
}
如果內部函數和外部函數的變量重名怎么辦？
'use strict';
function foo( ) {
var x = 1;
function bar( ) {
var x = 'A';
alert('x in bar( ) = ' + x ); // 'A'
}
alert('x in foo( ) = ' + x); // 1
bar( );
}
這說明JavaScript的函數在查找變量時從自身函數定義開始，從"內"向"外"查找。如果內部函數定義了與外部函數重名的變量，則內部函數的變量將"屏蔽"外部函數的變量。
變量提升
JavaScript的函數定義有個特點，它會先掃描整個函數體的語句，把所有申明的變量"提升"到函數頂部：
'use strict'
function foo( ) {
var x = 'Hello' + y;
alert(x);
var y = 'Bob';
}
foo( );
雖然是strict模式，但語句 var x = 'Hello' + y; 并不報錯，原因是變量y在稍后申明了。但是alert顯示Hello undefied,說明變量y的值為udefined。這正是因為JavaScript引擎自動提升了變量y的聲明，但不會提升變量y的賦值。
對于上述 foo( )函數,JavaScipt引擎看到的代碼相當于：
function foo ( ) {
var y; //提升變量y的申明
var x ='Hello, ' + y;
alert(x);
y = 'Bob';
}
由于JavaScipt的這一怪異的“特性”，我們在函數內部定義變量時，請嚴格遵守“在函數內部首先申明所有變量”這一規則。最常見的做法是用一個 var 申明函數內部用到的所有變量：
function foo ( ) {
var
x = 1, // x 初始化為1
y = x + 1,// y 初始化為2
z,i; //z 和 i 為undefined
//其他語句
foo (i =0; i < 100;i ++){
...
}
}
全局作用域
不在任何函數內定義的變量就具有全局作用域。實際上，JavaScript默認有一個全局對象window,全局作用域的變量實際上被綁定到window的一個屬性:
'use strict';
var course = 'Learn JavaScript';
alert(course); // 'Learn JavaScript'
alert(window.course); // 'Learn JavaScript'
因此，直接訪問全局變量course和訪問window.course是完全一樣的。
你可能猜到了，由于函數定義有兩種方式，以變量方式var foo = function ( ) { } 定義的函數實際上也是一個全局變量，因此，頂層函數的定義也被視為一個全局變量，并綁定到window對象：
'use script'
function foo ( ) {
alert( 'foo' );
}
foo (); // 直接調用foo()
window.foo(); // 通過window.foo()調用
進一步大膽地猜測，我們每次直接調用的alert()函數其實也是 window的一個變量：
'use strict';
window.alert(' 調用window.alert( )');
//把alert保存到另一個變量：
var old_alert = window.alert;
//給alert賦一個新函數；
window.alert = function ( ) { }
alert( '無法用alert( )顯示了！');
//恢復alert
window.alert = old_alert;
alert('又可以用alert( )了！');
這說明JavaScript實際上只有一個全局作用域。任何變量(函數也視為變量)，如果沒有在當前函數作用域中找到，就會繼續往上查找，最后如果在全局作用域中也沒有找到，會報ReferenceError錯誤。
名字空間
全局變量會綁定到window上，不同的JavaScript文件如果使用了相同的全局變量，或者定義了相同名字的頂層函數，都會造成命名沖突，并且很難被發現。
減少沖突的一個方法就是把自己的所有變量和函數全部綁定到一個全局變量中。例如：
//唯一的全局變量MYAPP
var MYAPP = { };
//其他變量
MYAPP.name = ''myapp;
MYAPP.version = 1.0;
//其他函數；
MYAPP.foo = function ( ) {
return 'foo';
}
把自己的代碼全部放入唯一的名字空間 MYAPP 中，會大大減少全局變量沖突的可能。
許多著名的JavaScript庫都是這么干的：jQuery, YUI, underscore等等。
局部作用域
由于JavaScript的變量作用域實際上是函數內部，我們在 for 循環等語句塊中是無法定義具有局部作用域的變量的“
'use strict'
function foo ( ) {
for (var i=0; i<100; i++) {
//
}
i += 100; //仍然可以引用變量i
}
為了解決塊級作用域，ES6引入了新的關鍵字let,用let替代var可以申明一個塊級作用域的變量：
'use strict';
function foo( ) {
var sum = 0;
for (let i=0; i<100; i++){
sum += i;
}
i += 1; //SyntaxError
}
常量
由于var 和 let申明的是變量 ，如果要申明一個常量，在ES6之前是不行的，我們通常用全部大寫的變量來表示“這是一個常量，不要修改它的值”：
var PI = 3.14;
ES6標準引入了新的關鍵字 const 來定義常量， const 與 let都具有塊級作用域：
'use strict'
const PI = 3.14;
PI = 3; // 某些瀏覽器不報錯，但是無效果！
PI; //3.14
方法
在一個對象中綁定函數，稱為這個對象的方法。
在JavaScript中，對象的定義是這樣的：
var xiaoming = {
name: '小明',
birth:1990
}
但是，如果我們給 xiaoming 綁定一個函數，就可以做更多的事情。比如，寫個 age( ) 方法，返回 xiaoming 的年齡
var xiaoming = {
'name:'小明,
'birth':1990
age: function ( ) {
var y = new Date( ).getFullYear( )'
return y - this.birth;
}
}
xiaoming.age; //function xiaoming.age()
xiaoming.age(); //今年調用是25,明年調用就編程26了
綁定到對象上的函數成為方法，和普通函數也沒啥區別，但是它在內部使用了一個 this 關鍵字，這個東東是什么？
在一個方法內部，this 是一個特殊變量，它始終指向當前對象，也就是 xiaoming 這個變量。所以，this.birth可以拿到 xiaoming 的 birth屬性。
讓我們拆開寫
function getAge() {
var y = new Date().getFullYear();
return y - this.birth;
}
var xiaoming = {
name:'小明',
birth:1990;
age:getAge
}
xiaoming.age(); //25,正常結果
getAge(); // NaN
單獨調用函數getAge()怎么返回了NaN?請注意，我們已經進入到了JavsScript的一個大坑里。
JavaSript的函數內部如果調用了this,那么這個this到底指向誰？
答案是，視情況而定！
如果以對象的方法形式調用，比如xiaoming.age(),該函數的 this 指向被調用的對象，也就是xiaoming,這是符合我們預期的。
如果單獨調用函數，比如getAge()，此時，該函數的 this 指向全局對象，也就是 window.
坑爹啊！
更坑爹的是，如果這么寫
var fn = xiaoming.age; //先拿到xiaoming的age函數
fn();// NaN
也是不行的，要保證this指向正確，必須用obj.xxx()的形式調用！
由于這是一個巨大的設計錯誤，要想糾正可以沒那么簡單。ECMA決定，在 strict 模式下讓函數的 this 指向 undefined,因此，在strict模式下，你會得到一個錯誤：
'use scrict'
var xiaoming = {
name: '小明',
birth:'1990',
age: function(){
var y = new Date().getFullYear();
return y - this.birth;
}
}
var fn = xiaoming.age;
fn(); //Uncaught TypeError:Cannot read property 'birth' of undefined
這個決定只是讓錯誤及時暴露出來，并沒有解決 this 應該指向的正確位置。
有些時候，喜歡重構的你把方法重構了一下：
'use strict'
var xioaming = {
name:'小明',
birth:'1990'
age: function (){
function getAgeFromBirth(){
var y = new Date().getFullYear();
return y - this.birth;
}
return getAgeFromBirth();
}
}
xiaoming.age();//Uncaught TypeError:Cannot read the property 'birth' of undefiend
結果又報錯了！原因是 this 指針只在age方法的函數內指向xiaoming ,在函數內部定義的函數，this又指向 undefined 了，（在非strict模式下，它重新指向全局對象window!）
修復的辦法也不是沒有，我們用一個 that 變量首先捕獲 this：
'use strcit'
var xiaoming = {
name:'小明',
birth:1990,
age:function (){
var that = this // 在方法內部一開始就捕獲this
function getAgeFromBirth(){
var y = new Date().getFullYear();
retun y - that .birth ;// 用 that 而不是 this
}
retun getAgeFromBirth();
}
}
xiaoming.age(); //25
用var that = this;你就可以放心地在方法內部定義其他函數，而不是把所有語句都堆到一個方法中。
apply
雖然在一個獨立的函數調用中，根據是否是strict模式，this指向undefined或window,不過，我們還是可以控制 this 的指向的。
要指定函數的 this 指向哪個對象，可以用函數本身的 apply方法，它接收兩個參數，第一個參數就是需要綁定的 this 變量，第二個參數是 Array,表示函數本身的參數。
用apply修復getAge()調用：
function getAge() {
var y = new Date().getFulYear();
return y - this.birth;
}
var xiaoming = {
name: '小明',
birth: 1990,
age:getAge
}
xiaoming.age(); //25
getAge.apply(xiaoming,[ ]); //25,this指向xiao'ming,參數為空
另一個與apply()類似的方法是call(),唯一的區別是：
- apply()把參數打包成Array再傳入；
- call()把參數按順序傳入
比如調用Math.max(3,5,4),分別用apply()和call()實現如下：
Math.max.apply(null,[3,5,4]); //5
Math.max.call(null,3,5,4); //5
對普通函數調用，我們通常把 this 綁定為null.
裝飾器
利用apply(),我們還可以動態改變函數的行為。
Javascript的所有對象都是動態的，即使內置的函數，我們也可以重新指向新的函數。
現在假定我們想統計一下代碼一共調用了多少次 parseInt(),可以把所有的調用都找出來，然后手動加上count += 1,不過這樣做太傻了。最佳方案是用我們自己的函數替換掉默認的parseInt():
var count = 0;
var oldParseInt = parseInt; //保存原函數
window.parseInt = function (){
count += 1;
return oldParseInt.apply(null, arguments); //調用原函數
};
//測試：
parseInt('10');
parseInt('20');
parseInt('30');
count; //3
高階函數
高階函數英文叫Higher-order-function.那么什么是高階函數？
JavaScript的函數其實都指向某個變量。既然變量可以指向函數，函數的參數能接收變量，那么一個函數就可以接收另一個函數作為參數，這種函數就稱之為高階函數。
一個最簡單的高階函數
function add(x,y,f) {
return f(x) + f(y);
}
當我們調用 add(-5, 6, Math.abs)時，參數x, y和 f 分別接收-5 ,6和函數 Math.asb, 根據函數定義，我們可以推導計算過程為：
x = -5;
y = 6;
f = Math.abs;
f(x) + f(y) ==> Math.abs(-5) + Math.abs(6) ==> 11;
return 11;
用代碼驗證下
add(-5, 6, Math.abs); //11
編寫高階函數，就是讓函數的參數能夠接收別的函數。
map/reduce
如果你多過Google的那篇大名鼎鼎的論文"MapReduce:Simplified Data Processing on Large Clusters"，你就能大概明白map/reduce的概念。
map
舉例說明，比如我們有一個函數f(x)=x2
要把這個函數作用在一個數組[1,2,3,4,5,6,7,8,9]上，就可以用map實現如下：
由于map()方法定義在JavaScript的Array中，我們調用Array的map()方法，傳入我們自己的函數，就得到了一個新的array作為結果：
function pow(x){
return x * x;
}
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
arr.map(pow); // [1,4,9,16,25,36,49,64,81]
map()傳入的參數是pow,即函數對象本身。
你可能會想,不需要map(),寫一個循壞，也可以計算出結果：
var f = function(x){
return x*x;
}
var arr = [1,2,3,4,5,6,7,8,9];
var result = [ ];
for (var i = 0; i < arr.length; i ++){
result.push(f(arr[i]));
}
的確可以，但是，從上面的循壞代碼，我們無法一眼看明白“把f(x)作用在Array的每一個元素并把結果生成一個新的Array”。
所以，map() 作為高階函數，事實上它把運算規則抽象了，因此，我們不但可以計算簡單的f(x)=x2,還可以計算任意復雜的函數，比如，把Array的所有數字轉為字符串：
var arr = [1,2,3,4,5,6,7,8,9];
arr.map(String); //['1','2','3','4','5','6','7','8','9'];
只需一行代碼
reduce
再看reduce的用法。Array的reduce()把一個函數作用在這個Array的[x1,x2,x3... ] 上，這個函數必須接收兩個參數，reduce()把結果繼續和序列的下一個元素做累積計算，其效果是：
[x1,x2,x3,x4].reduce(f) = f(f(f(x1,x2),x3),x4)
比方說對一個Array求和，就可以用reduce實現：
var arr = [1,3,5,7,9];
arr.reduce(function (x ,y){
return x +y;
}); //25
要把[1,3,5,7,9]變換成整數13579,reduce()也能派上用場：
var arr = [1,3,5,7,9];
arr.reduce( function (x, y) {
return x*10 + y ;
} )
filter
filter也是一個常用的操作，它用于把Array的某些元素過濾掉，然后返回剩下的元素。
和map()類似，Array的filter()也接收一個函數。和map()不同的是，filter()把傳入的函數依次作用于每個元素，然后根據返回值是true還是false決定保留還是丟棄該元素。
例如，在一個Array中，刪掉偶數，只保留奇數，可以這么寫；
var arr = [1,2,4,5,6,9,10,15];
var r = arr.filter(function (x){
return x % 2 != 0;
});
r; //[1,5,9,15]
把一個Array中的空字符串刪掉，可以這么寫：
var arr = ['A','','B',null,undefined,'C',' '];
var r = arr.filter(function (s) {
return s && s.trim( ); //注意：IE9以下的版本沒有trim()方法
});
arr; //['A','B','C']
可見用filter()這個高階函數，關鍵在于正確實現一個“篩選”函數。
回調函數
filter()接收的回調函數，其實可以有多個參數。通常我們僅使用第一個參數，表示Array的某個元素。回調函數還可以接收另外兩個參數，表示元素的位置和數組本身：
var arr = ['A','B','C'];
var r = arr.filter(function(element,index,self){
console.log(element); //依次打印'A','B','C'
console.log(index); // 依次打印0，1，2
console.log(self); //self就是變量arr
return true;
});
利用 filter,可以巧妙地去除 Array 的重量元素
'use strict';
var arr = ['apple','starwberry','banana','pear','apple','orange','orange','strawberry'];
r = arr.filter(function(element,index,self){
return self.indexof(element) === index;
}
);
去除重復元素依靠的是indexof總是返回第一個元素的位置，后續的重復元素位置與indexof返回的位置不相等，因此被filter過濾掉了。
sort
排序算法
排序也是在程序中經常用到的算法。無論使用冒泡排序還是快速排序，排序的核心是比較兩個元素的大小。如果是數字，我們可以直接比較，但如果是字符串或者是兩個對象呢?直接比較數學上的大小是沒有意義的，因此，比較的過程必須通過函數抽象出來。通常規定，對于兩個元素x和y，如果認為x<y,則返回-1,如果認為x == y，則返回0,如果認為x > y，則返回1，這樣，排序算法就不用關心具體的比較過程了，而是根據比較結果直接排序。
JavaScript的Array的sort()方法就是用于排序的，但是排序結果可能讓你大吃一驚
//看上去正常的結果：
['Google','Apple','Microsoft'].sort( ); // ['Apple','Google','Microsoft'];
// apple排在了最后：
['Google','apple','Microsoft'].sort( ); //['Google','Micorsoft','apple'];
//無法理解的結果：
[10,20,1,2].sort( ); // [1, 10, 2, 20]
第二個排序把apple排在了最后，是因為字符串根據ASCII碼進行排序，而小寫字母a的ASCII碼在大寫字母之后。
第三個排序結果是什么鬼？簡單的數字排序都能錯？
這是因為Array的sort()方法默認把所有元素先轉換為String再排序，結果'10'排在了'2'的前面，因為字符'1'比字符'2'的ASCII碼小。
如果不知道sort()方法的默認排序規則,直接對數字排序，絕對載進坑里！
幸運的是，sort()方法也是一個高階函數，它還可以接收一個比較函數來實現自定義的排序。
要按數字大小排序，我們可以這么寫：
var arr = [10, 20, 1, 2];
arr.sort(function (x, y) {
if (x < y){
return -1;
}
if(x > y){
return 1;
}
return 0;
}); //[1, 2, 10 ,20]
如果要倒序排序，我們可以把大的數放前面:
var arr = [10,20,1,2];
arr.sort(function(x,y){
if (x < y){
return 1;
}
if (x > y){
return -1;
}
return 0;
}); // [20,10,2,1]
默認情況下，對字符串排序，是按照ASCII的大小比較的，現在，我們提出排序應該忽略大小寫，按照字母序排序，要實現這個算法，不必對現有代碼大加改動，只要我們能定義出忽略大小寫的比較算法就可以
var arr = ['Google','apple','Microsoft'];
arr.sort(function(s1,s2){
x1 = s1.toUpperCase();
x2 = s2.toUpperCase();
if(x1 < x2){
return -1;
}
if(x1 > x2){
return 1;
}
return 0;
}); //['apple','Google','Microsoft'];
忽略大小寫比較兩個字符串，實際上就是先把字符串都變成大寫（或者都變成小寫），再比較。從上述例子可以看出，高階函數的抽象能力是非常強大的，而且，核心代碼可以保持得非常簡潔。最后友情提示，sort()方法會直接對Array進行修改，它返回的結果仍是當前Array：
var a1 = ['B','A','C'];
var a2 = a1.sort();
a1; //['A','B','C']
a2; //['A','B','C']
a1 === a2; //true a1和a2是同一個對象
閉包
函數作為返回值
高階函數除了可以接受函數作為參數外，還可以把函數作為結果值返回。我們來實現一個對Array的求和。通常情況下，求和的函數式這樣定義的：
functin sum(arr){
return arr.reduce(
function(x,y){
return x +y;
}
);
}
sum([1,2,3,4,5]);//15
但是，如果不需要立刻求和， 而是在后面的代碼中，根據需要再計算怎么辦？可以不返回求和的結果，而是返回求和的函數!
function lazy_sum(arr) {
var sum = function(){
return arr.reduce (function (x,y){
return x + y;
});
}
return sum;
}
當我們調用lazy_sum時，返回的并不是求和結果，而是求和函數
var f = lazy_sum([1,2,3,4,5]); //function sum()
調用函數f時，才真正計算求和的結果
f(); //5
在這個例子中，我們在函數lazy_sum中又定義了函數sum,并且，內部函數sum可以引用外部函數lazy_sumd的參數和局部變量，當lazy_sum返回函數sum時，相關參數和變量都保存在返回的函數中，這種稱為“閉包（Closure）”的程序結構擁有極大的威力。
請再注意一點，當我們調用lazy_sum時，每次調用都會返回一個新的函數，即使傳入相同的參數：
var f1 = lazy_sum([1,2,3,4,5]);
var f2 = lazy_sum([1,2,3,4,5]);
f1 === f2; // false
f1() 和f2()的調用結果互不影響
閉包
注意到返回的函數在其定義內部引用了局部變量arr,所以，當一個函數返回了一個函數后，其內部的局部變量還被新函數引用，所以，閉包用起來簡單，實現起來可不容易。
另一個需要注意的問題是，返回的函數并沒有立刻執行，而是直到調用了f()才執行。我們來看一個例子：
function count() {
var arr = [ ];
for(var i = 1; i <=3; i++){
arr.push(function(){
return i *i;
}
);
return arr;
}
}
var results = count();
var f1 = results[0];
var f2 = results[1];
var f3 = results[2];
在上面的例子中，每次循環，都創建了一個新的函數，然后，
把創建的3個函數都添加到一個Array中返回了。
你可能認為調用f1(), f2()和f3() 結果應該是1，4，9，但實際結果是：
f1( ); // 16
f2( ); // 16
f3( ); // 16
全部都是16！ 原因就在于返回的函數引用了變量 i,但它并非立刻執行。等到三個函數都返回時，他們所引用的變量 i 已經變成了 4，因此最終結果為16.
返回閉包時牢記的一點就是：返回函數不要引用任何循環變量，或者后續會發生變化的變量。
如果一定要引用循環變量怎么辦？方法是再創建一個函數，用該函數的參數綁定循環變量當前的值，無論該循環變量后續如何更改，已綁定到函數參數的值不變：
function count ( ) {
var arr = [ ];
for (var i = 1; i <= 3; i++){
arr.push()
}
}
對象
對象
ECMA-262把對象（object）定義為“屬性的無序集合，每個屬性存放一個原始值、對象、或函數”。嚴格來說，這意味著對象是無特定順序的值的數組。
盡管ECAMScript如此定義對象，但它更通用的定義是基于代碼的名詞（人、地點、或事物）的表示。
類
每個對象都由類定義，可以把類看做對象的配方。類不僅要定義對象的接口（interface）（開發者訪問的屬性和方法），還要定義對象的內部工作（使屬性和方法發揮作用的代碼）。編譯器和解釋程序都根據類的說明創建對象。
實例
程序使用類創建對象時，生成的對象叫做類的實例（instance）
