本筆記匯總了作者認為“JavaScript高級程序設計”這本書的前7章知識重點,僅供參考。
小結:
對象在JavaScript中被稱為援用類型的值,而且有1些內置的援用類型可以用來創建特定的對象,現扼要總結以下:
- 援用類型與傳統面向對象程序設計中的類類似,但實現不同;
- Object是1個基礎類型,其他所有類型都從Object繼承了基本的行動;
- Array類型是1組值得有序列表,同時還提供了操作和轉換這些值的功能;
- Date類型提供了有關日期和時間的信息,包括當前日期和時間和相干的計算功能;
- RegExp類型是ECMAScript支持正則表達式的1個接口,提供了最基本的和1些高級的正則表達式工功能。
函數實際上是Function類型的實例,因此函數也是對象;而這1點正是JavaScript最有特點的地方。由于函數是對象,所以函數也具有方法,可以用來增強其行動。
由于有了基本包裝類型,所以JavaScript中的基本類型值可以被當作對象來訪問。3種基本包裝類型分別是:Boolean、Number和String。以下是他們共同的特點:
- 每一個包裝類型都映照到同名的基本類型;
- 在讀取模式下訪問基本類型值時,就會創建對應的基本包裝類型的1個對象,從而方便了數據的操作;
- 操作基本類型值的語句1經履行終了,就會立即燒毀新創建的對象。
在所有代碼履行之前,作用域中就已存在兩個內置對象:Global和Math。在大多數ECMAScript實現中都不能直接訪問Global對象;不過,Web閱讀器實現了承當該角色的window對象。全局變量和函數都是Global對象的屬性。Math對象提供了很多屬性和方法,用于輔助完成復雜的數學計算任務。
ECMAScript從技術上講是1門面向對象語言,但它不具有傳統的面向對象語言所支持的類和接口等基本結構。援用類型有時也被稱為對象定義,由于它們描寫的是1類對象所具有的屬性和方法。對象是某個特定援用類型的實例。
大多數援用類型值都是Object類型的實例,Object是ECMAScript中使用最多的1個類型。創建Object實例的方式有兩種。第1種是使用new操作符后跟Object構造函數,如
var person = new Object();
person.name = "Nicholas";
person.age = 29;
另外一種是使用對象字面量表示法,如
var person = {
name : "Nicholas",
age : 29
};
1般來講,訪問對象屬性時使用的都是點表示法,JavaScript中也能夠使用方括號表示法來訪問對象的屬性。如
alert(person["name"]); //"Nicholas"
alert(person.name); //"Nicholas"
ECMAScript中的數組與其他多數語言中的數組有著很大的區分。雖然ECMAScript數組與其他語言中的數組都是數據的有序列表,但與其他語言不同的是,ECMAScript數組的每項可以保存任何類型的數據。
表示方法
創建數組的基本方式有兩種。第1種是使用Array構造函數,如果預先知道數組要保存的項目數量,也能夠給構造函數傳遞該數量,而該數量會自動變成length屬性的值;給構造函數傳遞值也能夠創建數組。如
var colors = new Array();//空數組
var colors = new Array(20);//創建1個包括3項的數組
var colors = new Array("red", "blue", "green");//創建1個包括3個字符串值的數組
var names = Array("Greg");//創建1個包括1個字符串值的數組
第2種是使用數組字面量表示法。如
var colors = ["red", "blue", "green"];//創建1個包括3個字符串的數組
var names = [];//創建1個空數組
var values = [1,2,];//忌諱,會創建1個包括2或3項的數組
var options = [, , , , ,];//忌諱,會創建1個包括5或6項的數組
length屬性
數組length的屬性不是只讀的,通過設置這個屬性,可以從數組的末尾移除項或向數組中添加新項。
檢測數組
自從ECMAScript3作出規定后,就出現了肯定某個對象是否是數組的經典問題。對1個網頁,或1個全局作用域而言,使用instanceof操作符就可以得到滿意結果。
if (value instanceof Array) {
//對數組履行某些操作
}
如果網頁中包括多個框架,那實際上就存在兩個以上不同的全局履行環境,從而存在兩個以上不同版本的Array構造函數。如果從1個框架向另外一個框架傳入1個數組,那末傳入的數組與第2個框架中原生創建的數組分別具有各自不同的構造函數。為了解決這個問題,ECMAScript5新增了Array.isArray()方法。
if (Array.isArray(value)) {
//對數組履行某些操作
}
轉換方法
toLocaleString() :
toString() :
valueOf() :
ECMAScript提供了1種讓數組的行動類似于其他數據結構的方法。
實現棧的方式(LIFO)
push()
: 棧中項插入pop()
:棧中項移除實現隊列的方法(FIFO)
push()
:向數組末端添加項shift()
:從數組前段獲得項數組中已存在兩個可以直接用來重排序的方法:reverse()
和sort()
方法。
reverse()
方法會反轉數組項的順序。
默許情況下,sort()
方法按升序排列數組項。為了實現排序,sort()
方法會調用每一個數組項的toString()
轉型方法,然后比較得到的字符串,以肯定如何排序。
另外,sort()
方法可以接收1個比較函數作為參數。比較函數接受兩個參數,如果第1個參數應當位于第2個之前則返回1個負數,如果兩個參數相等則返回0,如果第1個參數應當位于第2個以后則返回1個正數。實際操作可以根據需要自行定義。如最簡單的1個例子
function compare(value1, value2) {
if (value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0;
}
}
只需將其作為參數傳遞給sort()
方法便可。
var values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values); //0, 1, 5, 10, 15
另外,對數值類型或其valueOf()
方法會返回數值類型的對象類型,可使用1個更簡單的比較函數。
function compare(value1, value2) {
return value2 - value1;
}
ECMAScript為操作已包括在數組中的項提供了很多內置方法。
concat()
:
該方法基于當前數組的所有項創建1個新數組。在沒有參數時返回副本,接收參數會添加到數組末尾,如果接收的是數組,則數組每項添加到末尾。如
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()
:
該方法能夠基于當前數組的1或多個項創建1個新數組。slice()
方法接收1或兩個參數,即要返回項的起始和結束位置。
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
splice()
:
該方法非常強大,用法很多。它的主要用處是向數組的中部插入項,使用方式有3中:
splice(0, 2)
會刪除數組中的前兩項。splice(2, 0, "red", "green")
會從當前數組的位置2開始插入字符串”red”和”green”。splice(2, 1, "red", "green")
會刪除當前數組位置2的項,然后再從當前數組的位置2開始插入字符串”red”和”green”。splice()
方法始終都會返回1個數組,該數組中包括從原始數組中刪除的項(如果沒有刪除任何項,則返回1個空數組)。下面的代碼展現了上述3中用法:
var colors = ["red", "green", "blue"];
var removed = colors.splice(0, 1); //刪除第1項
alert(colors); //green, blue
alert(removed); //red, 返回的數組中只包括1項
removed = colors.splice(1, 0, "yellow", "orange"); //從位置1開始插入兩項
alert(colors); //green, yellow, orange, blue
alert(removed); //返回的是1個空數組
removed = colors.splice(1, 1, "red", "purple"); //插入兩項,刪除1項
alert(colors); //green, red, purple, orange, blue
alert(removed); //yellow, 返回的數組中只包括1項
ECMAScript5為數組實例添加了兩個位置方法:indexOf()
和lastIndexOf()
。這兩個方法都接受兩個參數:要查找的項和(可選的)表示查找出發點位置的索引。不同的是,indexOf()
方法從數組的開頭向后查找,laseIndexOf()
方法則從數組的末尾開始向前查找。
這兩個方法都返回要查找的項在數組中的位置,沒找到返回⑴.在比較第1個參數與數組中的每項時,會使用全等操作符;也就是說,要查找的項必須嚴格相等。
var person = { name: "Nicholas" };
var people = [{ name: "Nicholas" }];
var morePeople = [person];
alert(people.indexOf(person)); //⑴
alert(morePeople.indexOf(person)); //0
ECMAScript5為數組定義了5個迭代方法。每一個方法都接受兩個參數:要在每項上運行的函數和(可選的)運行該函數的作用域——影響this的值。傳入這些方法中的函數會接收3個參數:數組項的值、該想在數組中的位置和數組對象本身。根據使用的方法不同,這個函數履行后的返回值可能會也可能不會影響方法的返回值。以下是這5個迭代方法的作用。
every()
:對數組中的每項運行給定函數,如果該函數對每項都返回true,則返回true。some()
:對數組中的每項運行給定函數,如果該函數對任1項返回true,則返回true。filter()
:對數組中的每項運行給定函數,返回該函數會返回true的項組成的數組。forEach()
:對數組中的每項運行給定函數。這個方法沒有返回值。map()
:對數組中的每項運行給定函數,返回每次函數調用的結果組成的數組。以上方法都不會修改數組中的包括的值。
其中,every()
和filter()
方法最類似。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
var everyResult = numbers.every(function(item, index, array) {
return (item > 2);
});
alert(everyResult); //false
var someResult = numbers.some(function(item, index, array) {
return (item > 2);
});
alert(someResult); //true
filter()
簡稱為濾波器,作用也有點類似濾波器。可以用來過濾出符合條件項。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
var filterResult = numbers.filter(function(item, index, array) {
return (item > 2);
});
alert(filterResult); //[3, 4, 5, 4, 3]
map()
可以用來創建包括的項與另外一個數組逐一對應的項。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
var mapResult = numbers.filter(function(item, index, array) {
return item * 2;
});
alert(mapResult); //[2, 4, 6, 8, 10, 8, 6, 4, 2]
forEach()
本質上和使用for循環迭代數組1樣。
var numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1];
numbers.forEach(function(item, index, array) {
//履行某些操作
});
ECMAScript5還新增了兩個歸并數組的方法:reduce()
和reduceRight()
。這兩個方法都會迭代數組的所有項,然后構建1個終究返回的值。reduce()
從前到后,reduceRight()
從后到前。
這兩個方法都接收兩個參數:1個在每項上調用的函數和(可選的)作為歸并基礎的初始值。傳給reduce()
和reduceRight()
的函數接收4個參數:前1個值、當前值、項的索引和數組對象。這個函數返回的任何值都會作為第1個參數自動傳給下1項。第1次迭代產生在數組的第2項上,因此第1個參數是數組的第1項,第2個參數就是數組的第2項。
使用reduce()
方法可以履行數組中所有值求和操作。
var values = [1, 2, 3, 4, 5];
var sum = values.reduce(function(prev, cur, index, array) {
return prev + cur;
});
alert(sum); //15
ECMAScript中的Date類型是在初期Java中的java.util.Date類基礎上構建的。為此,Date類型使用自UTC(Coordinated Universal Time,國際調和時間)1970年1月1日午夜(零時)開始經過的毫秒數來保存日期。
創建日期對象,使用new操作符和Date構造函數便可。
var now = new Date()
無參數傳遞時自動獲得系統當前日期和時間。如果想根據特定日期時間創建日期對象,傳入該日期毫秒數。為簡化計算進程,ECMPScript提供兩個方法:Date.parse()
和Date.UTC()
。
其中, Date.parse()
接收1個表示日期的字符串。ECMA⑵62沒有定義 Date.parse()
應當支持哪一種日期格式,因此這個方法的行動因實現而異,而且通過時因地區而異。將地區設置為美國的閱讀器通常都接受以下日期格式:
例如:
var someDate = new Date(Date.parse("May 25, 2004"));
如果傳入Date.parse()
方法的字符串不能表示日期,那末它會返回NaN。實際上,如果直接講字符串傳遞給Date構造函數,也會在后臺調用Date.parse()
。
Date.UTC()
方法一樣也返回表示日期的毫秒數。 Date.UTC()
的參數分別是年份、基于0的月份(0⑴1)、月中的哪1天、小時數(0⑵3)、分鐘、秒和毫秒數。前兩個參數是必須的,其他默許為0。
//GMT時間2000年1月1日午夜零時
var y2k = new Date(Date.UTC(2000, 0));
//GMT時間2005年5月5日下午5:55:55
var allFives = new Date(Date.UTC(2005, 4, 5, 17, 55, 55));
與其他援用類型1樣,日期類型繼承了toLocaleString()
、toString()
和valueOf()
方法。Date類型的toLocaleString()
方法會依照與閱讀器設置的地區相適應的格式返回日期和時間。valueOf()
不返回字符串,而是返回日期的毫秒表示。
Date類型還有1些專門用于將日期格式化為字符串的方法,以下:
toDateString()
——以特定于實現的格式顯示星期幾、月、日和年;toTimeString()
——以特定于時間的格式顯示時、分、秒和時區;toLocaleDateString()
——以特定于地區的格式顯示星期幾、月、日和年;toLocaleTimeString()
——以特定于實現的格式顯示時、分、秒;toUTCString()
——以特定于實現的格式顯示完全的UTC日期。其他相干日期/時間組件方法,可參考w3cschool的JavaScript Date對象
ECMAScript通過RegExp類型來支持正則表達式。
var expression = / pattern / flags ;
其中的模式(pattern)部份可以是任何簡單或復雜的正則表達式,可以包括字符類、限定符、分組、向前查找和反向援用。每一個正則表達式都可帶有1或多個標志(flags),用以表明正則表達式的行動。正則表達式匹配模式支持3個標志。
與其他語言中的正則表達式類似,模式中使用的所有元字符都必須轉義。
關于正則表達式的基本介紹,參考菜鳥教程上的正則表達式教程。
另外,關于RegExp對象的介紹,可以參考w3cschool上的JavaScript RegExp對象。在這里,就不贅述了。不管哪1門語言,在對字符串的處理上,正則表達式都是1個強大的工具,1定需要掌握。
ECMAScript中最特殊確當屬函數了,由于,函數實際上是對象!每一個函數都是Function類型的實例,而且和其他援用類型1樣具有屬性和方法。由于函數是對象,因此函數名實際上也是1個指向函數對象的指針,不會與某個函數綁定。
函數聲明與函數表達式
解析器在向履行環境中加載數據時,對函數聲明和函數表達式并不是1視同仁。解析器會率先讀取函數聲明,并使其履行代碼之前可用(可以訪問);至于函數表達式,則必須等到解析器履行到它所在的代碼行,才會真正被解析履行。因此,除甚么時候可以通過變量訪問函數這1點區分外,函數聲明與函數表達式的語法實際上是等價的。
//使用函數聲明
alert(sum(10, 10));
function sum(num1, num2) {
return num1 + num2;
}
上例能夠正常運行,由于在代碼履行前,解析器就已通過1個名為函數聲明提升(function declaration hoisting)的進程,讀取并將函數聲明添加到履行環境中。對代碼求值時,JavaScript引擎在第1遍會聲明函數并將他們放到源代碼樹的頂部。所以,即便聲明函數的代碼在調用它的帶碼后面,JavaScript引擎也能把函數聲明提升到頂部。而下例函數表達式則不能運行
//使用函數表達式
alert(sum(10, 10));
var sum = function(num1, num2) {
return num1 + num2;
}
沒有重載!
由于函數是對象,函數名實際上是1個指向函數對象的指針,不會與某個函數綁定,這正是ECMAScript中沒有函數重載概念的緣由。個人理解,除此以外,由于ECMAScript中的變量為疏松類型,因此對傳入函數的參數類型沒法加以限制,因此沒法像C++或Java那樣根據傳入參數類型或數量選擇調用函數,這也是造成ECMAScript沒法重載的緣由之1。
//函數聲明
function addSomeNumber(num) {
return num + 100;
}
function addSomeNumber(num) {
return num + 200;
}
var result = addSomeNumber(100); //300
該例聲明兩個同名函數,結果是后面的函數覆蓋了前面的。該例與下面的代碼幾近沒有區分:
var addSomeNumber = function (num) {
return num + 100;
};
addSomeNumber = function (num) {
return num + 200;
};
var result = addSomeNumber(100); //300
作為返回值的函數
由于ECMAScript中的函數名本身就是變量,因此函數也能夠作為值來使用。便可以作為參數或返回值。
//函數作為參數
function callSomeFunction (someFunction, someArgument) {
return somFunction (someArgument);
}
function add10 (num) {
return num + 10;
}
var result1 = callSomeFunction (add10, 10);
alert(result1); //20
function getGreeting (name) {
return "Hello, " + name;
}
var result2 = callSomeFunction (getGreeting, "Nicholas");
alert(result2); //"Hello, Nicholas"
函數作為返回值是極有用的技術,是“閉包”技術的基礎之1。
比較典型的如數組sort()方法的比較函數,它需要接收兩個參數,比較它們的值。可使假定有1個對象數組,要根據某個對象屬性排序,怎樣辦呢?
function createComparisonFunction (propertyName) {
return function (object1, object2) {
var value1 = object1[propertyName];
var value2 = object2[propertyName];
if (value1 < value2) {
return -1;
} else if (value1 > value2) {
return 1;
} else {
return 0;
}
};
}
該函數接收1個屬性名,然后根據這個屬性名來創建1個比較函數。使用以下
var data = [{name: "Zachary", age: 28}, {name: "Nicholas", age: 29}];
data.sort(createComparisonFunction("name"));
alert(data[0].name); //Nicholas
data.sort(createComparisonFunction("age"));
alert(data[0].name); //Zachary
函數內部屬性(重點)
在函數內部,有兩個特殊的對象:arguments
和this
。
arguments的主要用處是保存函數參數,這個對象還有1個名叫callee
的屬性,該屬性是1個指針,指向具有這個arguments
對象的函數。它可以完成函數體與函數名的解耦,以下面這個階乘函數的利用:
//與函數名牢牢耦合
function factorial (num) {
if (num <= 1) {
return 1;
} else {
return num * factorial (num - 1)
}
}
//使用arguments.callee替換函數名,消除耦合
function factorial (num) {
if (num <= 1) {
return 1;
} else {
return num * arguments.callee (num - 1)
}
}
這樣,不管援用函數時使用的是甚么名字,都可以保證正常完成遞歸調用。如
var trueFactorial = factorial;
factorial = function () {
return 0;
};
alert(trueFactiorial(5)); //120
alert(factorial(5)); //0
函數內部另外一個特殊對象是this
,其行動與Java和C#中的this
大致類似。即,this
援用的是函數據以履行的環境對象——或也能夠說是this
值(當在網頁的全局作用域中調用函數時,this
對象援用的就是window
)。以下例
window.color = "red";
var o = { color: "blue"};
function sayColor() {
alert(this.color);
}
sayColor(); //"red"
o.sayColor = sayColor;
o.sayColor(); //"blue"
sayColor()
在全局域中定義,當在全局域中調用時,this
援用的是全局對象window
;當把這個函數賦給對象o
并調用o.sayColor()
是,this
援用的是對象o
。
ECMAScript 5也規范化了另外一個函數對象的屬性:caller
。這個屬性保存著調用當前函數的函數的援用,如果是在全局域中調用當前函數,它的值為null
。使用方式類似于callee
,在此不贅述。
函數屬性和方法(重點)
ECMAScript中函數是對象,因此也有屬性和方法。
每一個函數都包括兩個屬性:length
和prototype
。其中,length
表示函數希望接收的命名參數的個數;對ECMAScript中的援用類型來講,prototype
是保存他們所有實例方法的真正所在。
諸如toString()
和valueOf()
等方法實際上都保存在prototype
名下,只不過是通過各自對象的實例訪問它們罷了。在創建自定義援用類型和實現繼承時,prototype
屬性的作用極其重要。在ECMAScript 5中,prototype
屬性是不可枚舉的,因此使用for-in
沒法發現。
每一個函數都包括兩個非繼承而來的方法:apply()
和call()
。這兩個方法都是在特定的作用域中調用函數,實際上等于設置函數體內this
對象的值。
apply()
方法接收兩個參數,1個是在其中運行函數的作用域,另外一個是參數數組。其中,第2個參數可以是Array
的實例,也能夠是arguments
對象。例如
function sum(num1, num2) {
return num1 + num2;
}
function callSum1(num1, num2) {
return sum.apply(this, arguments); //傳入arguments對象
}
function callSum2(num1, num2) {
return sum.apply(this, [num1, num2]); //傳入數組
}
alert(callSum1(10, 10)); //20
alert(callSum2(10, 10)); //20
call()
方法與apply()
方法的作用相同,他們的區分僅在于接收參數的方式不同。對call()
方法而言,第1個參數是this
值沒有變化,變化的是其余參數都直接傳遞給函數。即,在使用call()
方法時,傳遞給函數的參數必須逐一羅列出來,以下:
function sum(num1, num2) {
return num1 + num2;
}
function callSum(num1, num2) {
return sum.call(this, num1, num2);
}
alert(callSum(10, 10)); //20
事實上,傳遞參數并不是apply()
和call()
真正用武之地,它們真正強大的地方是能夠擴充函數賴以運行的作用域。例如
window.color = "red";
var o = { color: "blue" };
function sayColor() {
alert(this.color);
}
sayColor(); //red
sayColor.call(this); //red
sayColor.call(window); //red
sayColor.call(o); //blue
ECMAScript 5還定義了1個方法:bind()
。這個方法會創建1個函數的實例,其this
值會被綁定到傳給bind()
函數的值。例如
window.color = "red";
var o = { color: "blue" };
function sayColor() {
alert(this.color);
}
var objectSayColor = sayColor.bind(o);
objectSayColor(); //blue
和Java類似,為了便于操作基本類型值,ECMAScript也提供了3個特殊的援用類型:Boolean
、Number
和String
。每當讀取1個基本類型值的時候,后臺就會創建1個對應的基本包裝類型的對象,從而讓我們能夠調用1些方法來操作這些數據。有點類似于Java的自動拆裝箱進程,以String
類型為例
var s1 = "some text";
var s2 = s1.substring(2);
在訪問s1
時,訪問進程處于讀取模式,后臺自動完成以下處理:
String
類型的1個實例;以上3個步驟可以想象成以下代碼
var s1 = new String("some text");
var s2 = s1.substring(2);
s1 = null;
以上3個步驟一樣適用于Boolean
和Number
類型對應的布爾值和數字值。
援用類型與基本包裝類型主要區分就是對象的生存期。使用new
操作符創建的援用類型的實例,在履行流離開當前援用域之前1直都保存在內存中。而自動創建的基本包裝類型的對象,則只存在1行代碼的履行瞬間,然后立即燒毀。這意味著不能在運行時為基本類型值添加屬性和方法。
Boolean
類型是與布爾值對應的援用類型,建議永久不要使用Boolean
對象。
除繼承的方法外,Number
類型還提供了1些用于將數值格式化為字符串的方。
- toFixed()
:按指定小數位返回數值的字符串表示。
- toExponential()
:返回以指數表示法表示的數值的字符串情勢。
- toPrecision()
:返回固定大小格式,也可能返回指數格式,具體規則是看哪一種格式比較適合。該方法接收1個參數指定表示數值的所有數字的位數。
String
類型提供了很多方法,用于輔助完成對ECMAScript中字符串的解析和操作。
字符方法
兩個用于訪問字符串中特定字符的方法時:charAt()
和charCodeAt()
。兩個方法都接收1個參數,即基于0餓字符位置。charAt()
返回指定位置字符,charCodeAt()
返回指定位置字符編碼。
字符串操作方法
concat()
:
用于將1或多個字符串拼接起來,接受任意多個參數。
slice()
、substr()
和substring()
:
這3個方法基于字符串創建新字符串。它們都會返回被操作字符串的1個子字符串,而且也都接受1或兩個參數。第1個參數指定子字符串的開始位置,第2個參數(在指定的情況下)表示子字符串到哪里結束。具體來講,slice()
和substr()
的第2個參數指定的是子字符串最后1個字符后面的位置。而substr()
的第2個參數指定的則是返回的字符數。如果沒有給這些方法傳遞第2個參數,則將字符串的長度作為結束位置。
var StringObject = "hello world";
alert(StringObject .slice(3)); //輸出 "lo world"
alert(StringObject .substring(3)); //輸出 "lo world"
alert(StringObject .substr(3)); //輸出 "lo world"
alert(StringObject .slice(3, 7)); //輸出 "lo w"
alert(StringObject .substring(3, 7)); //輸出 "lo w"
alert(StringObject .substr(3, 7)); //輸出 "lo worl"
當傳遞的參數是負值時,它們的行動就不盡相同了。其中,slice()
方法會將傳入的賦值與字符串長度相加,substr()
方法將負的第1個參數加上字符串的長度,而將負的第2個參數轉換為0.最后,substring()
方法會把所有負值參數都轉換為0.
var StringObject = "hello world";
alert(StringObject .slice(-3)); //輸出 "rld"
alert(StringObject .substring(-3)); //輸出 "hello world"
alert(StringObject .substr(-3)); //輸出 "rld"
alert(StringObject .slice(3, -4)); //輸出 "lo w"
alert(StringObject .substring(3, -4)); //輸出 "hel"
alert(StringObject .substr(3, -4)); //輸出 "" 空字符串
字符串位置方法
有兩個可以從字符串中查找子字符串的方法:indexOf()
和lastIndexOf()
。前者從前往后搜索,后者反之。
兩個方法都可接收可選的第2個參數,表明從字符串哪一個位置開始搜索。
在使用第2個參數的情況下,可以通過循環調用indexOf()
或lastIndexOf()
來找到所有匹配的子字符串。以下:
var stringValue = "Lorem ipsum dolor sit amet, consectetur adipisicing elit";
var positions = new Array();
var pos = stringValue.indexOf("e");
while (pos > -1) {
positions.push(pos);
pos = stringValue.indexOf("e", pos + 1);
}
alert(positions); //"3, 24, 32, 35, 52"
trim()方法
該方法創建1個字符串的副本,刪除前置及后綴的所有空格,然后返回結果。
字符串大小寫轉換方法
ECMAScript中觸及字符串大小寫轉換的方法有4個:toLowerCase()
、toLocaleLowerCase()
、toUpperCase()
和toLocaleUpperCase()
。
字符串的模式匹配方法
match()
:
在字符串上調用這個方法,本質上與調用RegExp
的exec()
方法相同。match()
只接受1個參數,正則表達式或RegExp
對象。和RegExp
對象的exec()
方法1樣,match()
方法會返回1個數組:數組的第1項是與全部模式匹配的字符串,以后的每項(如果有)保存著與正則表達式中的捕獲組匹配的字符串。
var text = "cat, bat, sat, fat";
var pattern = /.at/;
//與pattern.exec(text)相同
var matches = text.match(pattern);
alert(matches.index); //0
alert(matches[0]); //"cat"
alert(pattern.lastIndex); //0
search()
:
參數與match()
方法相同,返回字符串中第1個匹配項的索引,如果沒有返回⑴。
var text = "cat, bat, sat, fat";
var pos = text.search(/at/);
alert(pos); //1
replace()
:
接受兩個參數,第1個參數可以是1個RegExp
對象或1個字符串(這個字符串不會被轉換為正則表達式),第2個參數可以是1個字符串或1個函數。如果第1個參數是字符串,那末只會替換第1個字符串,想替換所有字符串只能提供1個正則表達式,并且要指定全局(g)標志。
var text = "cat, bat, sat, fat";
var result = text.replace("at", "ond");
alert(result); //"cond, bat, sond, fond"
如果第2個參數是字符串,那末還可使用1些特殊的字符序列,將正則表達式操作得到的值插入到結果字符串中。下表列出了ECMAScript提供的這些特殊的字符序列。
字符序列 | 替換文本 |
---|---|
$$ | $ |
$& | 匹配全部模式的子字符串。與RegExp.lastMatch的值相同 |
$’ | 匹配的子字符串之前的子字符串。與RegExp.leftContext的值相同 |
$` | 匹配的子字符串之前的子字符串。與RegExp.rightContext的值相同 |
$n | 匹配第n個捕獲組的子字符組,其中nn等于0~9。例如,$1是匹配第1個捕獲組的子字符串,$2是匹配第2個捕獲組的子字符串,以此類推。如果正則表達式中沒有定義捕獲組,則使用空字符串 |
$nn | 匹配第nn個捕獲組的子字符串,其中nn等于01~99。例如$01是匹配第1個捕獲組的子字符串,$02是匹配第2個捕獲組的子字符串,以此類推。如果正則表達式中沒有定義捕獲組,則使用空字符串 |
通過這些特殊的字符序列,可使用最近1次匹配結果中的內容,以下
var text = "cat, bat, sat, fat";
result = text.replace(/(.at)/g, "word ($1)");
alert(result); //word (cat), word (bat), word(sat), word (fat)
replace()
方法的第2個參數也能夠是1個函數。在只有1個匹配項(即與模式匹配的字符串)的情況下,會向這個函數傳遞3個參數:模式的匹配項、模式匹配項在字符串中的位置和原始字符串。在正則表達式定義了多個捕獲組的情況下,傳遞給函數的參數1次是模式的匹配項、第1個捕獲組的匹配項、第2個捕獲組的匹配項……,但最后兩個參數依然分別是模式的匹配項在字符串中的位置和原始字符串。這個函數應當返回1個字符串,表示應當被替換的匹配項使用函數作為replace()
方法的第2個參數可以實現更加精細的替換操作,以下例
\\返回html實體
function htmlEscape(text) {
return text.replace(/[<>"&]/g, function(match, pos, originalText) {
switch(match) {
case "<":
return "<";
case ">":
return ">";
case "&":
return "&";
case "\"":
return """
}
});
}
alert(htmlEscape("<p class=\"greeting\">Hello world!</p>"));
//<p class="greeting">Hello world!</p>
split()
:
該方法可以基于指定的分隔符將1個字符串分割成多個子字符串,并將結果放在1個數組中。分隔符可以是字符串,也能夠是1個RegExp
對象(這個方法不會將字符串看成正則表達式)。split()
方法可以接受可選的第2個參數,用于指定數組的大小,以便確保返回的數組不會超過既定大小。
var colorText = "red, blue, green, yellow";
var colors1 = colorText.split(","); //["red", "blue", "green", "yellow"]
var colors2 = colorText.split(",", 2); //["red", "blue"]
var colors3 = colorText.split(/[^\,]+/); //["", ",", ",", ",", ""]
localeCompare()方法
該方法比較兩個字符串,并返回以下值中的1個:
var stringValue = "yellow";
alert(stringValue.localeCompare("brick")); //1
alert(stringValue.localeCompare(
下一篇 Linux 計劃任務布控