溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

JavaScript中有哪些常用的對象

發(fā)布時間:2022-02-07 14:52:09 來源:億速云 閱讀:225 作者:iii 欄目:web開發(fā)

本篇內(nèi)容主要講解“JavaScript中有哪些常用的對象”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“JavaScript中有哪些常用的對象”吧!

JavaScript中的常用對象有:1、數(shù)組對象(Array);2、字符串對象(String);3、日期時間對象(Date);4、Globle對象;5、window對象;6、Math對象。

本教程操作環(huán)境:windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。

Array

數(shù)組創(chuàng)建方式

  • 跟object創(chuàng)建對象一樣,使用Array構(gòu)造函數(shù)方式創(chuàng)建,如下代碼

    var colors = new Array();
  • 使用字面量方式創(chuàng)建數(shù)組

    var colors = [];

檢測數(shù)組

確定某個值到底是否是數(shù)組

var colors = ['red','green','blue'];
if(Array.isArray(colors)){
    //對數(shù)組執(zhí)行某些操作
}

轉(zhuǎn)換方法

調(diào)用數(shù)組的toString()方法會返回由數(shù)組中每個值的字符串形式拼接而成的一個以逗號分隔的字符串。

var colors = ['red','green','blue'];
alert(colors.toString());//red,green,blue

另外,toLocalString()方法經(jīng)常也會返回與toString()方法相同的值,但也不總是如此。例如:

var person1 = {
    toLocaleString : function () {
        return '馬大帥';
    },
    toString : function () {
        return '馬小帥';
    }
}
var person2 = {
    toLocaleString : function () {
        return '隔壁老王';
    },
    toString : function () {
        return '隔壁老李';
    }
}
var people = [person1,person2];
alert(people);//馬小帥,隔壁老李
alert(people.toString());//馬小帥,隔壁老李
alert(people.toLocaleString()); //馬大帥,隔壁老王

定義了兩個對象: person1和person2。分別為每個對象定義了一個toString()方法和toLocalString()方法,各個方法返回不同的值。然后,創(chuàng)建一個包含前面定義的兩個對象的數(shù)組。將數(shù)組傳遞給alert()時,輸出結(jié)果為馬小帥,隔壁老李。因?yàn)檎{(diào)用數(shù)組每一項(xiàng)的toString()方法(同樣,這與下一行顯示調(diào)用toString())方法得到的結(jié)果相同。而當(dāng)調(diào)用數(shù)組的每一項(xiàng)的toLocalString()方法.

分割字符串

toLocalString()方法和toString()方法,在默認(rèn)情況下都會以逗號分割的字符串的形式返回。而如果使用join()方法,join()方法只接收一個參數(shù)。

var colors = ['red','blue','green'];
colors.join('||'); //red||blue||green

棧方法

數(shù)組也可以想棧一樣,既可以插入和刪除項(xiàng)的數(shù)據(jù)結(jié)構(gòu)。棧是一種LIFO(Last-In-First-Out,后進(jìn)先出)的數(shù)據(jù)結(jié)構(gòu),也就是最新添加的那項(xiàng)元素最早被刪除。而棧中項(xiàng)的插入(叫做推入)和移除(叫做彈出),只發(fā)生在一個位置——棧的頂部。數(shù)組專門提供了push()pop()方法,以便實(shí)現(xiàn)類似棧的行為。

push()方法

可以接收任意數(shù)量的參數(shù),把它們逐個添加到數(shù)組末尾,并返回修改后數(shù)組的長度。

var colors = [];
var count = colors.push('red','blue','green');
alert(count); //3

pop()方法

從數(shù)組末尾移除最后一項(xiàng),減少數(shù)組的 length 值,然后返回移除的項(xiàng) 。

var item = colors.pop(); //取最后一項(xiàng)
alert(item); //green
alert(colors.length); //2

隊(duì)列方法

棧數(shù)據(jù)結(jié)構(gòu)的訪問規(guī)則是 LIFO(后進(jìn)先出),而隊(duì)列數(shù)據(jù)結(jié)構(gòu)的訪問規(guī)則是 FIFO(First-In-First-Out, 先進(jìn)先出)。隊(duì)列在列表的末端添加項(xiàng),從列表的前端移除項(xiàng)。由于 push()是向數(shù)組末端添加項(xiàng)的方法, 因此要模擬隊(duì)列只需一個從數(shù)組前端取得項(xiàng)的方法。實(shí)現(xiàn)這一操作的數(shù)組方法就是 shift(),它能夠移 除數(shù)組中的第一個項(xiàng)并返回該項(xiàng),同時將數(shù)組長度減 1。結(jié)合使用 shift() push()方法,可以像使 用隊(duì)列一樣使用數(shù)組。

shift()方法

var colors = ['red','blue','green'];
var item = colors.shift();//取得第一項(xiàng)
alert(item); //"red"
alert(colors.length); //2

unshift()方法

ECMAScript 還為數(shù)組提供了一個 unshift()方法。顧名思義,unshift() shift()的用途相反: 它能在數(shù)組前端添加任意個項(xiàng)并返回新數(shù)組的長度。因此,同時使用 unshift()pop()方法,可以 12 從相反的方向來模擬隊(duì)列,即在數(shù)組的前端添加項(xiàng),從數(shù)組末端移除項(xiàng) 。

var colors = [];
var count  = colors.unshift('red','green'); //推入兩項(xiàng)
alert(count); //2
console.log(colors); // ["red", "green"]

重排序方法

數(shù)組中已經(jīng)存在兩個可以直接用來重排序的方法:reverse()sort()。

reverse()方法

reverse翻轉(zhuǎn)數(shù)組項(xiàng)的順序

var values = [1,2,3,4,5];
values.reverse();
alert(values); // 5,4,3,2,1

sort()方法

  默認(rèn)情況下,sort()方法按升序排列——即最小的值位于最前面,最大的值排在最后面。 為了實(shí)現(xiàn)排序,sort()方法會調(diào)用每個數(shù)組項(xiàng)的 toString()轉(zhuǎn)型方法,然后比較得到的字符串,以確定如何排序 。即使數(shù)組中的每一項(xiàng)都是數(shù)值,sort()方法比較的也是字符串。如下所示。

var values = [0,1,5,10,15];
varlus.sort();
alert(values); //0,1,10,15,5

  可見,即使例子中值的順序沒有問題,但 sort()方法也會根據(jù)測試字符串的結(jié)果改變原來的順序。 因?yàn)閿?shù)值 5 雖然小于 10,但在進(jìn)行字符串比較時,"10"則位于"5"的前面,于是數(shù)組的順序就被修改了。 不用說,這種排序方式在很多情況下都不是最佳方案。

  因此 sort()方法可以接收一個比較函數(shù)作為參數(shù),以便我們指定哪個值位于哪個值的前面。 以完成數(shù)組中數(shù)值的升序降序功能

  比較函數(shù)接收兩個參數(shù),如果第一個參數(shù)位于第二個參數(shù)之前則返回一個負(fù)數(shù),如果兩個參數(shù)相等則返回0,如果第一個參數(shù)位于第二個參數(shù)之后則返回正數(shù)。舉例:

function compare(v1,v2){
    if(v1 < v2){
        return -1;
    }else if (v1 > v2){
        return 1;
    }else{
        return 0;
    }
}

  這個比較函數(shù)可以適用于大多數(shù)數(shù)據(jù)類型,只要將其作為參數(shù)傳遞給sort()方法即可,如下面例子所示。

var values = [0,1,5,10,15];
values.sort(compare);
alert(values); //0,1,5,10,15

  在將比較函數(shù)傳遞到sort()方法之后,數(shù)值仍然保持了正確的升序。當(dāng)然,也可以通過比較函數(shù)產(chǎn)生降序排序的結(jié)果,只要交換比較函數(shù)返回的值即可。

function compare(v1,v2){
    if(v1 < v2){
        return 1;
    }else if (v1 > v2){
        return -1;
    }else{
        return 0;
    }
}
var values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values);    // 15,10,5,1,0

  比較函數(shù)在第一個值應(yīng)該位于第二個之后的情況下返回 1,而在第一個值 應(yīng)該在第二個之前的情況下返回-1。交換返回值的意思是讓更大的值排位更靠前,也就是對數(shù)組按照降 序排序。當(dāng)然,如果只想反轉(zhuǎn)數(shù)組原來的順序,使用 reverse()方法要更快一些。

操作方法

ECMAScript為操作已經(jīng)包含在數(shù)據(jù)中項(xiàng)提供了許多方法。其中包含了像concat()slice()、splice()來對數(shù)組的項(xiàng)進(jìn)行操作。

concat()方法

數(shù)組合并方法,一個數(shù)組調(diào)用concat()方法去合并另一個數(shù)組,返回一個新的數(shù)組。concat()接收的參數(shù)是可以是任意的。

  • 參數(shù)為一個或多個數(shù)組,則該方法會將這些數(shù)組中每一項(xiàng)都添加到結(jié)果數(shù)組中。

  • 參數(shù)不是數(shù)組,這些值就會被簡單地添加到結(jié)果數(shù)組的末尾

var colors = ['red','blue','green'];
colors.concat('yello');//["red", "blue", "green", "yello"]
colors.concat({'name':'張三'});//["red", "blue", "green", {…}]
colors.concat({'name':'李四'},['black','brown']);// ["red", "blue", "green", {…}, "black", "brown"]

slice()方法

slice()方法,它能夠基于當(dāng)前數(shù)組中一個或多個項(xiàng)創(chuàng)建一個新數(shù)組。slice()方法可以接受一或兩個參數(shù),既要返回項(xiàng)的起始和結(jié)束位置。

  • 一個參數(shù)的情況下,slice()方法會返回從該參數(shù)指定位置開始到當(dāng)前數(shù)組默認(rèn)的所有項(xiàng)

  • 兩個參數(shù)的情況下,該方法返回起始和結(jié)束位置之間的項(xiàng)——但不包括結(jié)束位置的項(xiàng)。

注意: slice()方法不會影響原始數(shù)組

var colors = ['red','blue','green','yellow','purple'];
colors.slice(1);//["blue", "green", "yellow", "purple"]
colors.slice(1,4);// ["blue", "green", "yellow"]

      如果slice()方法的參數(shù)中有一個負(fù)數(shù),則用數(shù)組長度加上該數(shù)來確定響應(yīng)的位置。例如,在一個包含5項(xiàng)的數(shù)組上調(diào)用slice(-2,-1)與調(diào)用slice(3,4)得到的結(jié)果相同。如果技術(shù)位置小于起始位置,則返回空數(shù)組

var colors = ['red','blue','green','yellow','purple'];
colors.slice(-2,-1);//["yellow"] 
colors.slice(-1,-2);//[]

splice()方法

splice()方法這個恐怕要算是最強(qiáng)大的數(shù)組的方法了,它有很多種用法。

splice()的主要用途是向數(shù)組的中路插入想。使用這種方法的方式則有3中。

  • 刪除:可以刪除任意數(shù)量的項(xiàng),只需指定2個參數(shù):要刪除的第一項(xiàng)的位置和要刪除的個數(shù)。例如splice(0,2)會刪除數(shù)組中的前兩項(xiàng)

  • 插入:可以向指定位置插入任意數(shù)量的項(xiàng),只需提供3個參數(shù):起始位置、0(要刪除的個數(shù))要插入的項(xiàng)。如果要插入多個項(xiàng),可以再傳入第四、第五、以至任意多個項(xiàng)。例如,splice(2,0,'red','green')會從當(dāng)前數(shù)組的位置2開始插入字符串'red''green'

  • 替換:可以向指定位置插入任意數(shù)量的項(xiàng),且同時刪除任意數(shù)量的項(xiàng),只需指定 3 個參數(shù):起始位置、要刪除的項(xiàng)數(shù)要插入的任意數(shù)量的項(xiàng)。插入的項(xiàng)數(shù)不必與刪除的項(xiàng)數(shù)相等。例如, splice (2,1,"red","green")會刪除當(dāng)前數(shù)組位置 2 的項(xiàng),然后再從位置 2 開始插入字符串 "red""green"

splice()方法始終都會返回一個數(shù)組,該數(shù)組中包含從原始數(shù)組中刪除的項(xiàng)(如果沒有刪除任何 項(xiàng),則返回一個空數(shù)組)。

var colors = ["red", "green", "blue"];
var removed = colors.splice(0,1); 
alert(colors); // green,blue 
alert(removed); // red,返回的數(shù)組中只包含一項(xiàng)
removed = colors.splice(1, 0, "yellow", "orange"); 
alert(colors); // green,yellow,orange,blue alert(removed); // 返回的是一個空數(shù)組
removed = colors.splice(1, 1, "red", "purple"); 
alert(colors); // green,red,purple,orange,blue alert(removed); // yellow,返回的數(shù)組中只包含一項(xiàng)

位置方法

ECMAScript 5 為數(shù)組實(shí)例添加了兩個位置方法:indexOf()lastIndexOf()。這兩個方法都接收兩個參數(shù):要查找的項(xiàng)和(可選的)表示查找起點(diǎn)位置的索引。其中,indexOf()方法從數(shù)組的開頭(位置 0)開始向后查找,lastIndexOf()方法則從數(shù)組的末尾開始向前查找

這兩個方法都返回要查找的那項(xiàng)在數(shù)組中的位置,或者在沒找到的情況下返回-1。在比較第一個參數(shù)與數(shù)組中的每一項(xiàng)時,會使用全等操作符;也就是說,要求查找的項(xiàng)必須嚴(yán)格相等(就像使用===一樣)。舉個栗子:

var numbers = [1,2,3,4,5,4,3,2,1];
alert(numbers.indexOf(4)); //3
alert(numbers.lastIndexOf(4));// 5
alert(numbers.indexOf(4,4));// 5
alert(numbers.lastIndexOf(4,4));//3

var person = {name:"mjj"};
var people = [{name:'mjj'}];
var morePeople = [person];
alert(people.indexOf(person)); //-1
alert(morePeople.indexOf(person));// 0

迭代方法

ECMAScript 5 為數(shù)組定義了 5 個迭代方法。

  • every()

  • some()

  • filter()

  • map()

  • forEach()

在這里常用的是后三個,我們只介紹后三個。

filter()方法

filter()函數(shù),它利用指定的函數(shù)確定是否在返回的數(shù)組中包含某一項(xiàng)。例如要返回一個所有數(shù)值都大于2的數(shù)組,可以使用如下代碼。

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()方法

map()方法也返回一個數(shù)組,而這個數(shù)組的每一項(xiàng)都是在原始數(shù)組中的對應(yīng)項(xiàng)上運(yùn)行輸入函數(shù)的結(jié)果。例如,可以給數(shù)組中的每一項(xiàng)乘以2,然后返回這些乘積組成的數(shù)組,如下所示

var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.map(function(item, index, array){
    return item * 2;
});
alert(filterResult); //[2,4,6,8,10,8,6,4,2]

forEach()方法

它只是對數(shù)組中的每一項(xiàng)運(yùn)行傳入的函數(shù)。這個方法沒有返回值, 本質(zhì)上與使用 for 循環(huán)迭代數(shù)組一樣。來看一個例子 。

//執(zhí)行某些操作 10
var numbers = [1,2,3,4,5,4,3,2,1];
numbers.forEach(function(item, index, array){
});

這些數(shù)組方法通過執(zhí)行不同的操作,可以大大方便處理數(shù)組的任務(wù)

String

String 類型的每個實(shí)例都有一個 length 屬性,表示字符串中包含多個字符

var stringValue = "hello world"; 
alert(stringValue.length);     //"11"

這個例子輸出了字符串"hello world"中的字符數(shù)量,即"11"

1.字符方法

兩個用于訪問字符串中特定字符的方法是:charAt()charCodeAt()。這兩個方法都接收一個 參數(shù),即基于 0 的字符位置。其中,charAt()方法以單字符字符串的形式返回給定位置的那個字符 (ECMAScript 中沒有字符類型)。

例如:

var stringValue = "hello world"; 
alert(stringValue.charAt(1));   //"e"

字符串"hello world"位置 1 處的字符是"e",因此調(diào)用 charAt(1)就返回了"e"。如果你想得到 的不是字符而是字符編碼,那么就要像下面這樣使用 charCodeAt()了。

var stringValue = "hello world";
alert(stringValue.charCodeAt(1)); //輸出"101"

這個例子輸出的是"101",也就是小寫字母"e"的字符編碼。

ECMAScript 5 還定義了另一個訪問個別字符的方法。在支持此方法的瀏覽器中,可以使用方括號加數(shù) 字索引來訪問字符串中的特定字符,如下面的例子所示。

var stringValue = "hello world";
alert(stringValue[1]);   //"e"

2.字符串操作方法

下面介紹與操作字符串有關(guān)的幾個方法。

concat()

用于將一或多個字符串拼接起來, 7 返回拼接得到的新字符串。先來看一個例子。

var stringValue = "hello ";
var result = stringValue.concat("world"); 
alert(result); //"hello world" 
alert(stringValue); //"hello"

在這個例子中,通過 stringValue 調(diào)用 concat()方法返回的結(jié)果是"hello world"——但 stringValue 的值則保持不變。實(shí)際上,concat()方法可以接受任意多個參數(shù),也就是說可以通過它來拼接任意多個字符串。再看一個例子:

var stringValue = "hello ";
var result = stringValue.concat("world", "!");
alert(result); //"hello world!" 
alert(stringValue); //"hello"

這個例子將"world"和"!"拼接到了"hello"的末尾。雖然 concat()是專門用來拼接字符串的方法,但實(shí)踐中使用更多的還是加號操作符(+)。而且,使用加號操作符在大多數(shù)情況下都比使用 concat() 方法要簡便易行(特別是在拼接多個字符串的情況下)。

ECMAScript 還提供了三個基于子字符串創(chuàng)建新字符串的方法:slice()substr()substring()。 這三個方法都會返回被操作字符串的一個子字符串,而且也都接受一或兩個參數(shù)。第一個參數(shù)指定字符串的開始位置,第二個參數(shù)(在指定的情況下)表示字符串到哪里結(jié)束。

具體來說,slice()substring()的第二個參數(shù)指定的是字符串最后一個字符后面的位置。

substr()的第二個參數(shù)指定的則是返回的字符個數(shù)。如果沒有給這些方法傳遞第二個參數(shù),則將字符串的長度作為結(jié)束位置。

與 concat()方法一樣,slice()、substr()和 substring()也不會修改字符串本身的值——它們只是 返回一個基本類型的字符串值,對原始字符串沒有任何影響。請看下面的例子。

ar stringValue = "hello world";
alert(stringValue.slice(3));//"lo world"
alert(stringValue.substring(3));//"lo world"
alert(stringValue.substr(3));//"lo world"
alert(stringValue.slice(3, 7));//"lo w"
alert(stringValue.substring(3,7));//"lo w"
alert(stringValue.substr(3, 7));//"lo worl"

這個例子比較了以相同方式調(diào)用 slice()substr()substring()得到的結(jié)果,而且多數(shù)情 況下的結(jié)果是相同的。在只指定一個參數(shù)3的情況下,這三個方法都返回"lo world",因?yàn)?code>"hello" 中的第二個"l"處于位置 3。而在指定兩個參數(shù) 3 和 7 的情況下,slice()substring()返回"lo w" ("world"中的"o"處于位置 7,因此結(jié)果中不包含"o"),但 substr()返回"lo worl",因?yàn)樗牡诙?個參數(shù)指定的是要返回的字符個數(shù)。

在傳遞給這些方法的參數(shù)是負(fù)值的情況下,它們的行為就不盡相同了。其中,slice()方法會將傳 入的負(fù)值與字符串的長度相加,substr()方法將負(fù)的第一個參數(shù)加上字符串的長度,而將負(fù)的第二個 參數(shù)轉(zhuǎn)換為 0。最后,substring()方法會把所有負(fù)值參數(shù)都轉(zhuǎn)換為 0。下面來看例子

var stringValue = "hello world";
alert(stringValue.slice(-3));//"rld" 
alert(stringValue.substring(-3));//"hello world"
alert(stringValue.substr(-3)); //"rld"
alert(stringValue.slice(3, -4));//"lo w" 
alert(stringValue.substring(3, -4));//"hel"
alert(stringValue.substr(3, -4)); //""(空字符串)

這個例子清晰地展示了上述三個方法之間的不同行為。在給 slice()和 substr()傳遞一個負(fù)值 參數(shù)時,它們的行為相同。這是因?yàn)?3 會被轉(zhuǎn)換為 8(字符串長度加參數(shù) 11+(?3)=8),實(shí)際上相當(dāng) 于調(diào)用了 slice(8)和 substr(8)。但 substring()方法則返回了全部字符串,因?yàn)樗鼘?3 轉(zhuǎn)換 成了 0。

當(dāng)?shù)诙€參數(shù)是負(fù)值時,這三個方法的行為各不相同。slice()方法會把第二個參數(shù)轉(zhuǎn)換為 7,這 就相當(dāng)于調(diào)用了 slice(3,7),因此返回"lo w"。substring()方法會把第二個參數(shù)轉(zhuǎn)換為 0,使調(diào) 用變成了 substring(3,0),而由于這個方法會將較小的數(shù)作為開始位置,將較大的數(shù)作為結(jié)束位置, 因此最終相當(dāng)于調(diào)用了 substring(0,3)。substr()也會將第二個參數(shù)轉(zhuǎn)換為 0,這也就意味著返回 包含零個字符的字符串,也就是一個空字符串。

3.字符串位置方法

有兩個可以從字符串中查找子字符串的方法:indexOf()lastIndexOf()。這兩個方法都是從 一個字符串中搜索給定的子字符串,然后返回子字符串的位置(如果沒有找到該子字符串,則返回-1)。 這兩個方法的區(qū)別在于:indexOf()方法從字符串的開頭向后搜索子字符串,而 lastIndexOf()方法 是從字符串的末尾向前搜索子字符串

indexOf()和lastIndexOf()

var stringValue = "hello world";
alert(stringValue.indexOf("o"));             //4
alert(stringValue.lastIndexOf("o"));         //7
alert(stringValue.indexOf("o", 6));         //7
alert(stringValue.lastIndexOf("o", 6));     //4

4.trim()方法

ECMAScript 5 為所有字符串定義了 trim()方法,刪除字符串的前后空格.

var stringValue = "   hello world   ";
var trimmedStringValue = stringValue.trim();
alert(stringValue);            //"   hello world   "
alert(trimmedStringValue);     //"hello world"

5.字符串大小寫轉(zhuǎn)換方法

ECMAScript 中涉及字符串大小寫轉(zhuǎn)換的方法有四個.toLowerCase()、toLocaleLowerCase()、toUpperCase()toLocaleUpperCase()。 其中,toLowerCase()toUpperCase()是兩個經(jīng)典的方法 ,而 toLocaleLowerCase()和 toLocaleUpperCase()方法則是針對特定地區(qū)的實(shí)現(xiàn)。對有些地 區(qū)來說,針對地區(qū)的方法與其通用方法得到的結(jié)果相同,但少數(shù)語言(如土耳其語)會為 Unicode 大小 寫轉(zhuǎn)換應(yīng)用特殊的規(guī)則,這時候就必須使用針對地區(qū)的方法來保證實(shí)現(xiàn)正確的轉(zhuǎn)換.

var stringValue = "hello world";
alert(stringValue.toLocaleUpperCase());  //"HELLO WORLD"
alert(stringValue.toUpperCase());        //"HELLO WORLD"
alert(stringValue.toLocaleLowerCase());  //"hello world"
alert(stringValue.toLowerCase());        //"hello world"

Date日期

ECMAScript 中的 Date 類型是在早期 Java 中的 java.util.Date 類基礎(chǔ)上構(gòu)建的。為此,Date 類型使用自 UTC(Coordinated Universal Time,國際協(xié)調(diào)時間)1970 年 1 月 1 日午夜(零時)開始經(jīng)過 的毫秒數(shù)來保存日期。在使用這種數(shù)據(jù)存儲格式的條件下,Date 類型保存的日期能夠精確到 1970 年 1 月 1 日之前或之后的 285 616 年。

要創(chuàng)建一個日期對象,使用 new 操作符和 Date 構(gòu)造函數(shù)即可,如下所示

var now = new Date([parameters]);

前邊的語法中的參數(shù)(parameters)可以是一下任何一種:

  • 無參數(shù) : 創(chuàng)建今天的日期和時間,例如: var today = new Date();.

  • 一個符合以下格式的表示日期的字符串: "月 日, 年 時:分:秒." 例如: var Xmas95 = new Date("December 25, 1995 13:30:00")。如果你省略時、分、秒,那么他們的值將被設(shè)置為0。

  • 一個年,月,日的整型值的集合,例如: var Xmas95 = new Date(1995, 11, 25)。

  • 一個年,月,日,時,分,秒的集合,例如: var Xmas95 = new Date(1995, 11, 25, 9, 30, 0);.

Date對象的方法

JavaScript中有哪些常用的對象

日期格式化方法

Date 類型還有一些專門用于將日期格式化為字符串的方法,這些方法如下。

  • toDateString()——以特定于實(shí)現(xiàn)的格式顯示星期幾、月、日和年;

  • toTimeString()——以特定于實(shí)現(xiàn)的格式顯示時、分、秒和時區(qū);

  • toLocaleDateString()——以特定于地區(qū)的格式顯示星期幾、月、日和年;

  • toLocaleTimeString()——以特定于實(shí)現(xiàn)的格式顯示時、分、秒;

  • toUTCString()——以特定于實(shí)現(xiàn)的格式完整的 UTC 日期。

var myDate = new Date();

toDateString()

myDate.toDateString();//"Mon Apr 15 2019"

toTimeString()

myDate.toTimeString();//"10:11:53 GMT+0800 (中國標(biāo)準(zhǔn)時間)"

toLocaleDateString()

myDate.toLocaleDateString();//"2019/4/15"

toLocaleTimeString()

myDate.toLocaleTimeString();//"上午10:11:53"

toUTCString()

myDate.toUTCString();//"Mon, 15 Apr 2019 02:11:53 GMT"

栗子:返回了用數(shù)字時鐘格式的時間

var time = new Date();
var hour = time.getHours();
var minute = time.getMinutes();
var second = time.getSeconds();
var temp = "" + ((hour > 12) ? hour - 12 : hour);
if (hour == 0)
    temp = "12";
temp += ((minute < 10) ? ":0" : ":") + minute;
temp += ((second < 10) ? ":0" : ":") + second;
temp += (hour >= 12) ? " P.M." : " A.M.";
alert(temp);

字符串和數(shù)值之間轉(zhuǎn)換

字符串轉(zhuǎn)數(shù)值

var str = '123.0000111';
console.log(parseInt(str));
console.log(typeof parseInt(str));
console.log(parseFloat(str));
console.log(typeof parseFloat(str));
console.log(Number(str));

數(shù)值轉(zhuǎn)字符串

var num  = 1233.006;
// 強(qiáng)制類型轉(zhuǎn)換
console.log(String(num));
console.log(num.toString());

// 隱式轉(zhuǎn)換
console.log(''.concat(num));

// toFixed()方法會按照指定的小數(shù)位返回數(shù)值的字符串 四舍五入
console.log(num.toFixed(2));

Globle對象

Global(全局)對象可以說是 ECMAScript 中最特別的一個對象了,因?yàn)椴还苣銖氖裁唇嵌壬峡矗?這個對象都是不存在的。ECMAScript 中的 Global 對象在某種意義上是作為一個終極的“兜底兒對象” 來定義的。換句話說,不屬于任何其他對象的屬性和方法,最終都是它的屬性和方法。事實(shí)上,沒有全 局變量或全局函數(shù); 所有在全局作用域中定義的屬性和函數(shù),都是 Global 對象的屬性。本書前面介紹 過的那些函數(shù),諸如 isNaN()、isFinite()、parseInt()以及 parseFloat(),實(shí)際上全都是 Global 對象的方法。除此之外,Global 對象還包含其他一些方法。

URI 編碼方法

Global 對象的 encodeURI()encodeURIComponent()方法可以對 URI(Uniform Resource  Identifiers,通用資源標(biāo)識符)進(jìn)行編碼,以便發(fā)送給瀏覽器。有效的 URI 中不能包含某些字符,例如 5 空格。而這兩個 URI 編碼方法就可以對 URI 進(jìn)行編碼,它們用特殊的 UTF-8 編碼替換所有無效的字符, 從而讓瀏覽器能夠接受和理解。

其中,encodeURI()主要用于整個 URI(例如,[http://www.apeland/web index.html](http://www.apeland/web index.html)),而 encodeURIComponent()主要用于對 URI 中的某一段(例如前面 URI 中的 web index.html)進(jìn)行編碼。 它們的主要區(qū)別在于,encodeURI()不會對本身屬于 URI 的特殊字符進(jìn)行編碼,例如冒號、正斜杠、 問號和井字號;而 encodeURIComponent()則會對它發(fā)現(xiàn)的任何非標(biāo)準(zhǔn)字符進(jìn)行編碼 ,看個例子

var url = `http://www.apeland/web index.html`;
console.log(encodeURI(url));//http://www.apeland/web%20index.html
console.log(encodeURIComponent(url));//http%3A%2F%2Fwww.apeland%2Fweb%20index.html

使用 encodeURI()編碼后的結(jié)果是除了空格之外的其他字符都原封不動,只有空格被替換成了 %20。而 encodeURIComponent()方法則會使用對應(yīng)的編碼替換所有非字母數(shù)字字符

一般來說,我們使用 encodeURIComponent()方法的時候要比使用 encodeURI()更多,因?yàn)樵趯?shí)踐中更常見的是對查詢字符串參數(shù)而不是對基礎(chǔ) URI 進(jìn)行編碼。

encodeURI()encodeURIComponent()方法對應(yīng)的兩個方法分別是 decodeURI()decodeURIComponent()。其中,decodeURI()只能對使用 encodeURI()替換的字符進(jìn)行解碼。例如, 它可將%20 替換成一個空格,但不會對%23 作任何處理,因?yàn)?23 表示井字號(#),而井字號不是使用 encodeURI()替換的。同樣地,decodeURIComponent()能夠解碼使用 encodeURIComponent()編碼

window對象

ECMAScript 雖然沒有指出如何直接訪問 Global 對象,但 Web 瀏覽器都是將這個全局對象作為 window 對象的一部分加以實(shí)現(xiàn)的。因此,在全局作用域中聲明的所有變量和函數(shù),就都成為了 window 對象的屬性。來看下面的例子。

var color = "red";
function sayColor(){
    alert(window.color);
}
window.sayColor();  //"red"

Math對象

ECMAScript 還為保存數(shù)學(xué)公式和信息提供了一個公共位置,即 Math 對象.與我們在 JavaScript 直 接編寫的計算功能相比,Math 對象提供的計算功能執(zhí)行起來要快得多。Math 對象中還提供了輔助完成 這些計算的屬性和方法。

1.Math 對象的屬性

Math 對象包含的屬性大都是數(shù)學(xué)計算中可能會用到的一些特殊值。下表列出了這些屬性

屬性說明
Math.E自然對數(shù)的底數(shù),即常量e的值
Math.LN1010的自然對數(shù)  ln(10)
Math.LN22的自然對數(shù)
Math.LOG2E以2為底e的對數(shù)
Math.LOG10E以10為底e的對數(shù)
Math.PIπ的值
Math.SQRT1_21/2的平方根(即2的平方根的倒數(shù))
Math.SQRT22的平方根

2.min()和 max()方法

Math 對象還包含許多方法,用于輔助完成簡單和復(fù)雜的數(shù)學(xué)計算。

其中,min()和 max()方法用于確定一組數(shù)值中的最小值和最大值。這兩個方法都可以接收任意多 個數(shù)值參數(shù),如下面的例子所示

var max = Math.max(3, 54, 32, 16);
alert(max);    //54
var min = Math.min(3, 54, 32, 16);
alert(min);    //3

這兩個方法經(jīng)常用于避免多 余的循環(huán)和在 if 語句中確定一組數(shù)的最大值。

例子:

要找到數(shù)組中最大或最小值,可以像下面這樣用apply()方法

var values = [1,2,36,23,43,3,41];
var max = Math.max.apply(null, values);

這個技巧的關(guān)鍵是把 Math 對象作為 apply()的第一個參數(shù),從而正確地設(shè)置 this 值。然后,可以將任何數(shù)組作為第二個參數(shù)。

3.舍入方法

將小數(shù)值舍入為整數(shù)的幾個方法:Math.ceil()Math.floor() Math.round()。 這三個方法分別遵循下列舍入規(guī)則:

  • Math.ceil()執(zhí)行向上舍入,即它總是將數(shù)值向上舍入為最接近的整數(shù);

  • Math.floor()執(zhí)行向下舍入,即它總是將數(shù)值向下舍入為最接近的整數(shù);

  • Math.round()執(zhí)行標(biāo)準(zhǔn)舍入,即它總是將數(shù)值四舍五入為最接近的整數(shù)(這也是我們在數(shù)學(xué)課上學(xué)到的舍入規(guī)則)。

var num = 25.7;
var num2 = 25.2;
alert(Math.ceil(num));//26
alert(Math.floor(num));//25
alert(Math.round(num));//26
alert(Math.round(num2));//25

4.random()方法

Math.random()方法返回大于等于 0 小于 1 的一個隨機(jī)數(shù)

例子1:獲取min到max的范圍的整數(shù)

function random(lower, upper) {
	return Math.floor(Math.random() * (upper - lower)) + lower;
}

例子2: 獲取隨機(jī)顏色

/**
 * 產(chǎn)生一個隨機(jī)的rgb顏色
 * @return {String}  返回顏色rgb值字符串內(nèi)容,如:rgb(201, 57, 96)
 */
function randomColor() {
	// 隨機(jī)生成 rgb 值,每個顏色值在 0 - 255 之間
	var r = random(0, 256),
		g = random(0, 256),
		b = random(0, 256);
	// 連接字符串的結(jié)果
	var result = "rgb("+ r +","+ g +","+ b +")";
	// 返回結(jié)果
	return result;
}

例子3: 獲取隨機(jī)驗(yàn)證碼

function createCode(){
    //首先默認(rèn)code為空字符串
    var code = '';
    //設(shè)置長度,這里看需求,我這里設(shè)置了4
    var codeLength = 4;
    //設(shè)置隨機(jī)字符
    var random = new Array(0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R', 'S','T','U','V','W','X','Y','Z');
    //循環(huán)codeLength 我設(shè)置的4就是循環(huán)4次
    for(var i = 0; i < codeLength; i++){
        //設(shè)置隨機(jī)數(shù)范圍,這設(shè)置為0 ~ 36
        var index = Math.floor(Math.random()*36);
        //字符串拼接 將每次隨機(jī)的字符 進(jìn)行拼接
        code += random[index]; 
    }
    //將拼接好的字符串賦值給展示的Value
    return code
}

到此,相信大家對“JavaScript中有哪些常用的對象”有了更深的了解,不妨來實(shí)際操作一番吧!這里是億速云網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI