當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
javascript高级程序设计 学习笔记 第五章 上
生活随笔
收集整理的這篇文章主要介紹了
javascript高级程序设计 学习笔记 第五章 上
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
? 第五章 ? 引用類型的值(對象)是引用類型的一個實例。在 ECMAScript 中,引用類型是一種數據結構, 用于將數據和功能組織在一起。它也常被稱為類,但這種稱呼并不妥當。盡管 ECMAScript 從技術上講是一門面向對象的語言,但它不具備傳統的面向對象語言所支持的類和接口等基本結構。引用類型有時候也被稱為對象定義,因為它們描述的是一類對象所具有的屬性和方法。 ? 對象是某個特定引用類型的實例。新對象是使用 new 操作符后跟一個構造函數來創建的。 構造函數本身就是一個函數,只不過該函數是出于創建新對象的目的而定義的。 ? ECMAScript 提供了很多原生引用類 型(例如 Object),以便開發人員用以實現常見的計算任務。 ? 5.1 Object類型 到目前為止,我們看到的大多數引用類型值都是 Object 類型的實例;而且,Object 也是 ECMAScript 中使用最多的一個類型。 創建 Object 實例的方式有兩種。第一種是使用 new 操作符后跟 Object 構造函數。 eg: var person = new Object();
person.name = "Nicholas";
person.age = 29; 另一種方式是使用對象字面量表示法。對象字面量是對象定義的一種簡寫形式,目的在于簡化創建 包含大量屬性的對象的過程。 eg: var person = { name : "Nicholas", age : 29
}; 在最后一個屬性后面添加逗號,會在 IE7 及更早版本和Opera 中導致錯誤。 ? 在這個例子中,左邊的花括號({)表示對象字面量的開始,因為它出現在了表達式上下文 (expression context)中。ECMAScript 中的表達式上下文指的是能夠返回一個值(表達式)。賦值操作 符表示后面是一個值,所以左花括號在這里表示一個表達式的開始。同樣的花括號,如果出現在一個語句上下文(statement context)中,例如跟在 if 語句條件的后面,則表示一個語句塊的開始。 ? 在使用對象字面量語法時,屬性名也可以使用字符串。 eg: var person = {"name" : "Nicholas", "age" : 29, 5 : true
}; 這個例子會創建一個對象,包含三個屬性:name、age 和 5。但這里的數值屬性名會自動轉換為字符串。 ? 對象字面量也是向函數傳遞大量可選參 數的首選方式。 eg: ? 這種傳遞參數的模式最適合需要向函數傳入大量可選參數的情形。一般來講,命名參數雖然容易處理,但在有多個可選參數的情況下就會顯示不夠靈活。最好的做法 是對那些必需值使用命名參數,而使用對象字面量來封裝多個可選參數。 ? 一般來說,訪問對象屬性時使用的都是點表示法,這也是很多面向對象語言中通用的語法。不過, 在 JavaScript 也可以使用方括號表示法來訪問對象的屬性。在使用方括號語法時,應該將要訪問的屬性 以字符串的形式放在方括號中。 eg: alert(person["name"]); //"Nicholas"
alert(person.name); //"Nicholas" 從功能上看,這兩種訪問對象屬性的方法沒有任何區別。但方括號語法的主要優點是可以通過變量 來訪問屬性。 eg: var propertyName = "name";
alert(person[propertyName]); //"Nicholas" 如果屬性名中包含會導致語法錯誤的字符,或者屬性名使用的是關鍵字或保留字,也可以使用方括 號表示法。 eg: person["first name"] = "Nicholas"; 由于"first name"中包含一個空格,所以不能使用點表示法來訪問它。然而,屬性名中是可以包 含非字母非數字的,這時候就可以使用方括號表示法來訪問它們。 ? 通常,除非必須使用變量來訪問屬性,否則我們建議使用點表示法。 ? 5.2 Array類型 數據的有序列表,但與其他語言不同的是,ECMAScript 數組的每一項可以保存任何類型的數據。而且,ECMAScript 數組的大小是可以動態調整的,即可以隨著數據的添加自動增長以容 納新增數據。 ? 創建數組的基本方式有兩種。第一種是使用 Array構造函數。 eg: var colors = new Array(); 如果預先知道數組要保存的項目數量,也可以給構造函數傳遞該數量,而該數量會自動變成 length 屬性的值。 eg: var colors = new Array(20); 也可以向 Array 構造函數傳遞數組中應該包含的項。以下代碼創建了一個包含 3 個字符串值的數組: var colors = new Array("red", "blue", "green"); 給構造函數傳遞值:如果傳遞的是數 值,則會按照該數值創建包含給定項數的數組;而如果傳遞的是其他類型的參數,則會創建包含那個值 的只有一項的數組。 ? 另外,在使用 Array 構造函數時也可以省略 new 操作符。如下面的例子所示,省略 new 操作符的 結果相同: var colors = Array(3); // 創建一個包含 3 項的數組
var names = Array("Greg"); // 創建一個包含 1 項,即字符串"Greg"的數組 創建數組的第二種基本方式是使用數組字面量表示法。數組字面量由一對包含數組項的方括號表 示,多個數組項之間以逗號隔開。 var colors = ["red", "blue", "green"]; // 創建一個包含 3 個字符串的數組
var names = []; // 創建一個空數組
var values = [1,2,]; // 不要這樣!這樣會創建一個包含 2 或 3 項的數組
var options = [,,,,,]; // 不要這樣!這樣會創建一個包含 5 或 6 項的數組 分析: 在 IE 中,values 會成為一個包含 3 個項且每 項的值分別為 1、2 和 undefined 的數組;在其他瀏覽器中,values 會成為一個包含 2 項且值分別為 1 和 2 的數組。原因是 IE8 及之前版本中的 ECMAScript 實現在數組字面量方面存在 bug。由于這個 bug導致的另一種情況如最后一行代碼所示,該行代碼可能會創建包含 5 項的數組(在 IE9+、Firefox、Opera、Safari 和 Chrome 中),也可能會創建包含 6 項的數組(在 IE8 及更早版本中)。在像這種省略值的情況下, 每一項都將獲得undefined值;這個結果與調用Array構造函數時傳遞項數在邏輯上是相同的。但是 由于 IE 的實現與其他瀏覽器不一致,因此我們強烈建議不要使用這種語法。 ? 在讀取和設置數組的值時,要使用方括號并提供相應值的基于 0 的數字索引,如下所示: var colors = ["red", "blue", "green"]; // 定義一個字符串數組 alert(colors[0]); // 顯示第一項 colors[2] = "black"; // 修改第三項 colors[3] = "brown"; // 新增第四項 如果設 置某個值的索引超過了數組現有項數,如這個例子中的 colors[3]所示,數組就會自動增加到該索引 值加 1 的長度(就這個例子而言,索引是 3,因此數組長度就是 4)。 ? 數組的 length 屬性很有特點——它不是只讀的。因此,通過設置這個屬性,可以從數組的末尾移 除項或向數組中添加新項。請看下面的例子: var colors = ["red", "blue", "green"]; // 創建一個包含 3 個字符串的數組
colors.length = 2;
alert(colors[2]); //undefined 如果將其 length屬性設置為大于數組 項數的值,則新增的每一項都會取得 undefined 值,如下所示: var colors = ["red", "blue", "green"]; // 創建一個包含 3 個字符串的數組
colors.length = 4;
alert(colors[3]); //undefined 利用 length 屬性也可以方便地在數組末尾添加新項,如下所示: var colors = ["red", "blue", "green"]; // 創建一個包含 3 個字符串的數組
colors[colors.length] = "black"; //(在位置3)添加一種顏色
colors[colors.length] = "brown"; //(在位置4)再添加一種顏色 數組最多可以包含 4 294 967 295 個項. 5.2.1 檢測數組 對于一個網頁,或者一個全局作用域而言,使用 instanceof 操作符就能得到滿意的結果: if (value instanceof Array){
//對數組執行某些操作
} instanceof 操作符的問題在于,它假定只有一個全局執行環境。如果網頁中包含多個框架,那實 際上就存在兩個以上不同的全局執行環境,從而存在兩個以上不同版本的 Array構造函數。如果你從 一個框架向另一個框架傳入一個數組,那么傳入的數組與在第二個框架中原生創建的數組分別具有各自 不同的構造函數。 ? 為了解決這個問題,ECMAScript 5 新增了 Array.isArray()方法。這個方法的目的是最終確定某 個值到底是不是數組,而不管它是在哪個全局執行環境中創建的。這個方法的用法如下。 if (Array.isArray(value)){
//對數組執行某些操作
} 支持 Array.isArray()方法的瀏覽器有 IE9+、Firefox 4+、Safari 5+、Opera 10.5+和 Chrome。 5.2.2 轉換方法 所有對象都具有 toLocaleString()、toString()和 valueOf()方法。其中,調用 數組的 toString()方法會返回由數組中每個值的字符串形式拼接而成的一個以逗號分隔的字符串。而 調用 valueOf()返回的還是數組。實際上,為了創建這個字符串會調用數組每一項的 toString()方 法。 ? 當調用數組的 toLocaleString()方法時,它也會創建一個數組值的以逗號分隔的字符 串。而與前兩個方法唯一的不同之處在于,這一次為了取得每一項的值,調用的是每一項的 toLocale- String()方法,而不是 toString()方法。 eg: var person1 = { toLocaleString : function () { return "Nikolaos"; }, toString : function() { return "Nicho";
} };
var person2 = { toLocaleString : function () { return "Grigorios"; }, toString : function() { return "Greg";
} };
var people = [person1, person2];
alert(people); //Nicho,Greg
alert(people.toString()); //Nicho,Greg
alert(people.toLocaleString()); //Nikolaos,Grigorios 數組繼承的 toLocaleString()、toString()和 valueOf()方法,在默認情況下都會以逗號分隔的字 符串的形式返回數組項。而如果使用 join()方法,則可以使用不同的分隔符來構建這個字符串。join()方 法只接收一個參數,即用作分隔符的字符串,然后返回包含所有數組項的字符串。 eg: var colors = [1, "green", "blue"];colors.join("||"); // "1||green||blue" 我們使用 join()方法重現了 toString()方法的輸出。在傳遞逗號的情況下,得到了以 逗號分隔的數組值。 var colors = [1, "green", "blue"];
colors.toString(); //"1,green,blue"
//colors.join(",") //"1,green,blue" 如果不給 join()方法傳入任何值,或者給它傳入 undefined,則使用逗號作為分隔 符。IE7 及更早版本會錯誤的使用字符串"undefined"作為分隔符。 eg: var colors = [1, "blue","red"];//colors.join() //"1,blue,red"
//colors.join("undefined") //"1undefinedblueundefinedred"
colors.join(undefined) //"1,blue,red"
//colors.join(null) //"1nullbluenullred" 如果數組中的某一項的值是 null 或者 undefined,那么該值在 join()、 toLocaleString()、toString()和 valueOf()方法返回的結果中以空字符串表示。 eg: var colors = [1, undefined, "blue",null];//colors.join(",") //"1,,blue,"
//colors.toString() //"1,,blue,"
colors.valueOf() //[1, undefined, "blue", null]
//colors.toLocaleString() //"1,,blue," colors.valueOf()結果并未預想的以空字符串表示??? eg: var nobody = [1,,"red"];
var color = [1,2,"red"];
var nullArr = [1,null,"red"];
var undefinedArr = [1,undefined,"red"];//nobody.valueOf() //[1, undefined, "red"]
//nobody.join(",") //"1,,red"
//nobody.toString() //"1,,red"
//nobody instanceof Array //true//color.valueOf() //[1, 2, "red"]
//color.join(",") //"1,2,red"
//color.toString() //"1,2,red"
//color instanceof Array //true//nullArr.valueOf() //[1, null, "red"]
//nullArr.join(",") //"1,,red"
//nullArr.toString() //"1,,red"
//nullArr instanceof Array //true//undefinedArr.valueOf() //[1, undefined, "red"]
//undefinedArr.join(",") //"1,,red"
undefinedArr.toString() //"1,,red"
//undefinedArr instanceof Array //true 分析:當數組某一項為空時,valueOf結果為undefined,其他情況都返回原來值(null的valueOf結果為null,undefined的valueOf結果為undefined); 而當數組某項為空或null或nudefined:join(",")和toString()的結果都為空。 5.2.3 棧方法 棧是一種 LIFO(Last-In-First-Out, 后進先出)的數據結構,也就是最新添加的項最早被移除。而棧中項的插入(叫做推入)和移除(叫做 彈出),只發生在一個位置——棧的頂部。ECMAScript 為數組專門提供了 push()和 pop()方法,以便 實現類似棧的行為。 ? push()方法可以接收任意數量的參數,把它們逐個添加到數組末尾,并返回修改后數組的長度。而 pop()方法則從數組末尾移除最后一項,減少數組的 length 值,然后返回移除的項。 eg: var colors = new Array();
var count = colors.push("red", "green");console.log(count); //2
count = colors.push("black");console.log(count); //3
console.log(colors); // ["red", "green", "black"]var item = colors.pop();console.log(item); //black
console.log(colors.length); //2
console.log(colors); // ["red", "green"] 5.2.4 隊列方法 隊列數據結構的訪問規則是 FIFO(First-In-First-Out, 先進先出)。隊列在列表的末端添加項,從列表的前端移除項。shift(),它能夠移除數組中的第一個項并返回該項,同時將數組長度減 1。結合使用 shift()和 push()方法,可以像使 用隊列一樣使用數組。 eg: var colors = new Array();
var count = colors.push("red", "green");console.log(count); //2
count = colors.push("black");console.log(count); //3
console.log(colors); // ["red", "green", "black"]var item = colors.shift();console.log(item); //red
console.log(colors.length); //2
console.log(colors); // ["green", "black"] unshift()與 shift()的用途相反: 它能在數組前端添加任意個項并返回新數組的長度。因此,同時使用 unshift()和 pop()方法,可以從相反的方向來模擬隊列,即在數組的前端添加項,從數組末端移除項。 eg: var colors = new Array();
var count = colors.unshift("red", "green");console.log(count); //2
count = colors.unshift("black");console.log(count); //3
console.log(colors); // ["black", "red", "green"]var item = colors.pop();console.log(item); //green
console.log(colors.length); //2
console.log(colors); // ["black", "red"] ? ? 5.2.5 重排序方法 數組中已經存在兩個可以直接用來重排序的方法:reverse()和 sort()。有讀者可能猜到了, reverse()方法會反轉數組項的順序。 eg: var values = [1, 2, 3, 4, 5];
values.reverse(); alert(values); //5,4,3,2,1 在默認情況下,sort()方法按升序排列數組項——即最小的值位于最前面,最大的值排在最后面。 為了實現排序,sort()方法會調用每個數組項的 toString()轉型方法,然后比較得到的字符串,以 確定如何排序。即使數組中的每一項都是數值,sort()方法比較的也是字符串。 eg: var values = [0, 1, 5, 10, 15];
values.sort();
alert(values); //0,1,10,15,5 sort()方法也會根據測試字符串的結果改變原來的順序。 因為數值 5 雖然小于 10,但在進行字符串比較時,"10"則位于"5"的前面,于是數組的順序就被修改了。 sort()方法可以接收一個比較函數作為參 數,以便我們指定哪個值位于哪個值的前面。 eg: function compare(){return -1;} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [0, 10, 2, 15] 函數返回-1時,順序不變。 eg2: function compare(){return 1;} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [15, 2, 10, 0] 函數返回1時,順序相反。 eg3: function compare(){return 0;} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [0, 10, 2, 15] 函數返回0時,順序不變。 eg4: function compare(value1, value2) {if (value1 < value2) {return -1;} else if (value1 > value2) {return 1;} else {return 0; }} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [0, 2, 10, 15] 在將比較函數傳遞到 sort()方法之后,數值仍然保持了正確的升序。 eg5: function compare(value1, value2) {if (value1 < value2) {return 1;} else if (value1 > value2) {return -1;} else {return 0; }} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [15, 10, 2, 0] 通過比較函數產生降序排序的結果,只要交換比較函數返回的值即可。 ? 對于數值類型或者其 valueOf()方法會返回數值類型的對象類型,可以使用一個更簡單的比較函數。這個函數只要用第二個值減第一個值即可 function compare(value1, value2){ return value2 - value1; } 由于比較函數通過返回一個小于零、等于零或大于零的值來影響排序結果,因此減法操作就可以適 當地處理所有這些情況。 ? 5.2.6 操作方法 concat()方法可以基于當前數 組中的所有項創建一個新數組。具體來說,這個方法會先創建當前數組一個副本,然后將接收到的參數 添加到這個副本的末尾,最后返回新構建的數組。在沒有給 concat()方法傳遞參數的情況下,它只是 復制當前數組并返回副本。如果傳遞給 concat()方法的是一或多個數組,則該方法會將這些數組中的 每一項都添加到結果數組中。如果傳遞的值不是數組,這些值就會被簡單地添加到結果數組的末尾。 eg: var colors = ["red", "green", "blue"]; var colors2 = colors.concat("yellow", ["black", "brown"]); alert(colors); //red,green,blue alert(colors2); //red,green,blue,yellow,black,brown ? slice(),它能夠基于當前數組中的一或多個項創建一個新數組。slice()方法可以 接受一或兩個參數,即要返回項的起始和結束位置。在只有一個參數的情況下,slice()方法返回從該 參數指定位置開始到當前數組末尾的所有項。如果有兩個參數,該方法返回起始和結束位置之間的項— —但不包括結束位置的項。注意,slice()方法不會影響原始數組。 eg: var colors = ["red", "green", "blue", "yellow", "purple"]; var colors2 = colors.slice(1); var colors3 = colors.slice(1,4); alert(colors2); //green,blue,yellow,purple alert(colors3); //green,blue,yellow 如果 slice()方法的參數中有一個負數,則用數組長度加上該數來確定相應的位 置。例如,在一個包含 5 項的數組上調用 slice(-2,-1)與調用 slice(3,4)得到的 結果相同。如果結束位置小于起始位置,則返回空數組。 ? splice()方法,這個方法恐怕要算是最強大的數組方法了,它有很多種用法。 splice()的主要用途是向數組的中部插入項,但使用這種方法的方式則有如下 3 種。
if (num <=1) {return 1;} else {return num * factorial(num-1)} };var trueFactorial = factorial;factorial = function(){ return 0; };console.log(trueFactorial(5)); //0 console.log(factorial(5)); //0 2.this 函數內部的另一個特殊對象是 this,其行為與 Java 和 C#中的 this 大致類似。換句話說,this 引用的是函數據以執行的環境對象——或者也可以說是 this 值(當在網頁的全局作用域中調用函數時, this 對象引用的就是 window)。 eg: window.color = "red"; var o = { color: "blue" }; function sayColor(){ console.log(this.color); } sayColor(); // red o.sayColor = sayColor; o.sayColor(); // blue 分析:函數 sayColor()是在全局作用域中定義的,它引用了 this 對象。當在全局作用域中調用 sayColor()時,this 引用的是全局對象 window;而當把這個函數賦給對象 o 并調用 o.sayColor() 2 時,this 引用的是對象 o。 函數的名字僅僅是一個包含指針的變量而已。因此,即使是 在不同的環境中執行,全局的 sayColor()函數與 o.sayColor()指向的仍然是同一 個函數。 ? ECMAScript 5 也規范化了另一個函數對象的屬性:caller。除了 Opera 的早期版本不支持,其他 4 瀏覽器都支持這個 ECMAScript 3 并沒有定義的屬性。這個屬性中保存著調用當前函數的函數的引用, 如果是在全局作用域中調用當前函數,它的值為 null。 eg: function outer(){ inner(); }; function inner(){ alert(inner.caller); }; outer(); //function outer(){inner();} 分析:因為 outer()調用了 inter(),所以inner.caller 就指向 outer()。為了實現更松散的耦合,也可以通過 arguments.callee.caller來訪問相同的信息。 eg: function outer(){ inner();}
function inner(){ alert(arguments.callee.caller); } outer(); // function outer(){inner();} IE、Firefox、Chrome 和 Safari 的所有版本以及 Opera 9.6 都支持 caller 屬性。 當函數在嚴格模式下運行時,訪問 arguments.callee 會導致錯誤。ECMAScript 5 還定義了 arguments.caller 屬性,但在嚴格模式下訪問它也會導致錯誤,而在非嚴格模式下這個屬性始終是 undefined。定義這個屬性是為了分清 arguments.caller 和函數的 caller 屬性。以上變化都是為 了加強這門語言的安全性,這樣第三方代碼就不能在相同的環境里窺視其他代碼了。 嚴格模式還有一個限制:不能為函數的 caller 屬性賦值,否則會導致錯誤。 ? 5.5.5 函數屬性和方法 ? ?
values.reverse(); alert(values); //5,4,3,2,1 在默認情況下,sort()方法按升序排列數組項——即最小的值位于最前面,最大的值排在最后面。 為了實現排序,sort()方法會調用每個數組項的 toString()轉型方法,然后比較得到的字符串,以 確定如何排序。即使數組中的每一項都是數值,sort()方法比較的也是字符串。 eg: var values = [0, 1, 5, 10, 15];
values.sort();
alert(values); //0,1,10,15,5 sort()方法也會根據測試字符串的結果改變原來的順序。 因為數值 5 雖然小于 10,但在進行字符串比較時,"10"則位于"5"的前面,于是數組的順序就被修改了。 sort()方法可以接收一個比較函數作為參 數,以便我們指定哪個值位于哪個值的前面。 eg: function compare(){return -1;} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [0, 10, 2, 15] 函數返回-1時,順序不變。 eg2: function compare(){return 1;} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [15, 2, 10, 0] 函數返回1時,順序相反。 eg3: function compare(){return 0;} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [0, 10, 2, 15] 函數返回0時,順序不變。 eg4: function compare(value1, value2) {if (value1 < value2) {return -1;} else if (value1 > value2) {return 1;} else {return 0; }} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [0, 2, 10, 15] 在將比較函數傳遞到 sort()方法之后,數值仍然保持了正確的升序。 eg5: function compare(value1, value2) {if (value1 < value2) {return 1;} else if (value1 > value2) {return -1;} else {return 0; }} var values = [0, 10,2,15];values.sort(compare);console.log(values); // [15, 10, 2, 0] 通過比較函數產生降序排序的結果,只要交換比較函數返回的值即可。 ? 對于數值類型或者其 valueOf()方法會返回數值類型的對象類型,可以使用一個更簡單的比較函數。這個函數只要用第二個值減第一個值即可 function compare(value1, value2){ return value2 - value1; } 由于比較函數通過返回一個小于零、等于零或大于零的值來影響排序結果,因此減法操作就可以適 當地處理所有這些情況。 ? 5.2.6 操作方法 concat()方法可以基于當前數 組中的所有項創建一個新數組。具體來說,這個方法會先創建當前數組一個副本,然后將接收到的參數 添加到這個副本的末尾,最后返回新構建的數組。在沒有給 concat()方法傳遞參數的情況下,它只是 復制當前數組并返回副本。如果傳遞給 concat()方法的是一或多個數組,則該方法會將這些數組中的 每一項都添加到結果數組中。如果傳遞的值不是數組,這些值就會被簡單地添加到結果數組的末尾。 eg: var colors = ["red", "green", "blue"]; var colors2 = colors.concat("yellow", ["black", "brown"]); alert(colors); //red,green,blue alert(colors2); //red,green,blue,yellow,black,brown ? slice(),它能夠基于當前數組中的一或多個項創建一個新數組。slice()方法可以 接受一或兩個參數,即要返回項的起始和結束位置。在只有一個參數的情況下,slice()方法返回從該 參數指定位置開始到當前數組末尾的所有項。如果有兩個參數,該方法返回起始和結束位置之間的項— —但不包括結束位置的項。注意,slice()方法不會影響原始數組。 eg: var colors = ["red", "green", "blue", "yellow", "purple"]; var colors2 = colors.slice(1); var colors3 = colors.slice(1,4); alert(colors2); //green,blue,yellow,purple alert(colors3); //green,blue,yellow 如果 slice()方法的參數中有一個負數,則用數組長度加上該數來確定相應的位 置。例如,在一個包含 5 項的數組上調用 slice(-2,-1)與調用 slice(3,4)得到的 結果相同。如果結束位置小于起始位置,則返回空數組。 ? splice()方法,這個方法恐怕要算是最強大的數組方法了,它有很多種用法。 splice()的主要用途是向數組的中部插入項,但使用這種方法的方式則有如下 3 種。
- 刪除:可以刪除任意數量的項,只需指定 2 個參數:要刪除的第一項的位置和要刪除的項數。 例如,splice(0,2)會刪除數組中的前兩項。
- 插入:可以向指定位置插入任意數量的項,只需提供 3 個參數:起始位置、0(要刪除的項數) 和要插入的項。如果要插入多個項,可以再傳入第四、第五,以至任意多個項。例如, splice(2,0,"red","green")會從當前數組的位置 2 開始插入字符串"red"和"green"。
- 替換:可以向指定位置插入任意數量的項,且同時刪除任意數量的項,只需指定 3 個參數:起 始位置、要刪除的項數和要插入的任意數量的項。插入的項數不必與刪除的項數相等。例如, splice (2,1,"red","green")會刪除當前數組位置 2 的項,然后再從位置 2 開始插入字符串 "red"和"green"。
- splice()方法始終都會返回一個數組,該數組中包含從原始數組中刪除的項(如果沒有刪除任何 項,則返回一個空數組)。
- every():對數組中的每一項運行給定函數,如果該函數對每一項都返回 true,則返回 true。
- filter():對數組中的每一項運行給定函數,返回該函數會返回 true 的項組成的數組。
- forEach():對數組中的每一項運行給定函數。這個方法沒有返回值。
- map():對數組中的每一項運行給定函數,返回每次函數調用的結果組成的數組。
- some():對數組中的每一項運行給定函數,如果該函數對任一項返回 true,則返回 true。
- “月/日/年”,如 6/13/2004;
- “英文月名 日,年”,如 January 12,2004;
- “英文星期幾 英文月名 日 年 時:分:秒 時區”,如 Tue May 25 2004 00:00:00 GMT-0700。
- ISO 8601 擴展格式 YYYY-MM-DDTHH:mm:ss.sssZ(例如 2004-05-25T00:00:00)。只有兼容
- toDateString()——以特定于實現的格式顯示星期幾、月、日和年;
- toTimeString()——以特定于實現的格式顯示時、分、秒和時區;
- toLocaleDateString()——以特定于地區的格式顯示星期幾、月、日和年;
- toLocaleTimeString()——以特定于實現的格式顯示時、分、秒;
- toUTCString()——以特定于實現的格式完整的 UTC 日期。
- ?g:表示全局(global)模式,即模式將被應用于所有字符串,而非在發現第一個匹配項時立即 停止;
- ?i:表示不區分大小寫(case-insensitive)模式,即在確定匹配項時忽略模式與字符串的大小寫;
- ?m:表示多行(multiline)模式,即在到達一行文本末尾時還會繼續查找下一行中是否存在與模式匹配的項。
- global:布爾值,表示是否設置了 g 標志。
- ignoreCase:布爾值,表示是否設置了 i 標志。
- lastIndex:整數,表示開始搜索下一個匹配項的字符位置,從 0 算起。
- multiline:布爾值,表示是否設置了 m 標志。
- source:正則表達式的字符串表示,按照字面量形式而非傳入構造函數中的字符串模式返回。
- ?input 屬性返回了原始字符串;
- ?leftContext 屬性返回了單詞 short 之前的字符串,而 rightContext 屬性則返回了 short
- ?lastMatch 屬性返回最近一次與整個正則表達式匹配的字符串,即 short;
- ?lastParen 屬性返回最近一次匹配的捕獲組,即例子中的 s。
- 匹配字符串開始和結尾的\A 和\Z 錨;但支持以插入符號(^)和美元符號($)來匹配字符串的開始和結尾。
- 向后查找(lookbehind);但完全支持向前查找(lookahead)。
- 并集和交集類
- 原子組(atomic grouping)
- Unicode 支持(單個字符除外,如\uFFFF)
- 命名的捕獲組;但支持編號的捕獲組。
- s(single,單行)和 x(free-spacing,無間隔)匹配模式
- 條件匹配
- 正則表達式注釋
if (num <=1) {return 1;} else {return num * factorial(num-1)} };var trueFactorial = factorial;factorial = function(){ return 0; };console.log(trueFactorial(5)); //0 console.log(factorial(5)); //0 2.this 函數內部的另一個特殊對象是 this,其行為與 Java 和 C#中的 this 大致類似。換句話說,this 引用的是函數據以執行的環境對象——或者也可以說是 this 值(當在網頁的全局作用域中調用函數時, this 對象引用的就是 window)。 eg: window.color = "red"; var o = { color: "blue" }; function sayColor(){ console.log(this.color); } sayColor(); // red o.sayColor = sayColor; o.sayColor(); // blue 分析:函數 sayColor()是在全局作用域中定義的,它引用了 this 對象。當在全局作用域中調用 sayColor()時,this 引用的是全局對象 window;而當把這個函數賦給對象 o 并調用 o.sayColor() 2 時,this 引用的是對象 o。 函數的名字僅僅是一個包含指針的變量而已。因此,即使是 在不同的環境中執行,全局的 sayColor()函數與 o.sayColor()指向的仍然是同一 個函數。 ? ECMAScript 5 也規范化了另一個函數對象的屬性:caller。除了 Opera 的早期版本不支持,其他 4 瀏覽器都支持這個 ECMAScript 3 并沒有定義的屬性。這個屬性中保存著調用當前函數的函數的引用, 如果是在全局作用域中調用當前函數,它的值為 null。 eg: function outer(){ inner(); }; function inner(){ alert(inner.caller); }; outer(); //function outer(){inner();} 分析:因為 outer()調用了 inter(),所以inner.caller 就指向 outer()。為了實現更松散的耦合,也可以通過 arguments.callee.caller來訪問相同的信息。 eg: function outer(){ inner();}
function inner(){ alert(arguments.callee.caller); } outer(); // function outer(){inner();} IE、Firefox、Chrome 和 Safari 的所有版本以及 Opera 9.6 都支持 caller 屬性。 當函數在嚴格模式下運行時,訪問 arguments.callee 會導致錯誤。ECMAScript 5 還定義了 arguments.caller 屬性,但在嚴格模式下訪問它也會導致錯誤,而在非嚴格模式下這個屬性始終是 undefined。定義這個屬性是為了分清 arguments.caller 和函數的 caller 屬性。以上變化都是為 了加強這門語言的安全性,這樣第三方代碼就不能在相同的環境里窺視其他代碼了。 嚴格模式還有一個限制:不能為函數的 caller 屬性賦值,否則會導致錯誤。 ? 5.5.5 函數屬性和方法 ? ?
轉載于:https://www.cnblogs.com/xmyun/p/6415296.html
總結
以上是生活随笔為你收集整理的javascript高级程序设计 学习笔记 第五章 上的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: [转载]如何做到 jQuery-free
- 下一篇: 【ExtJS】FormPanel 布局(