日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 前端技术 > javascript >内容正文

javascript

JS 内置对象

發布時間:2023/12/10 javascript 44 豆豆
生活随笔 收集整理的這篇文章主要介紹了 JS 内置对象 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

對象,是任何一個開發者都無法繞開和逃避的話題,她似乎有些深不可測,但如此偉大和巧妙的存在,一定值得你去摸索、發現、征服。

我們都知道,JavaScript有3大對象,分別是本地對象、內置對象和宿主對象。

在此引用ECMA-262(ECMAScript的制定標準)對于他們的定義:

  • 本地對象

    • 與宿主無關,獨立于宿主環境的ECMAScript實現提供的對象。
    • 簡單來說,本地對象就是 ECMA-262 定義的類(引用類型)。
    • 這些引用類型在運行過程中需要通過new來創建所需的實例對象。
    • 包含:Object、Array、Date、RegExp、Function、Boolean、Number、String等。
  • 內置對象

    • 與宿主無關,獨立于宿主環境的ECMAScript實現提供的對象。
    • 在 ECMAScript 程序開始執行前就存在,本身就是實例化內置對象,開發者無需再去實例化。
    • 內置對象是本地對象的子集。
    • 包含:Global和Math。
    • ECMAScript5中增添了JSON這個存在于全局的內置對象。
  • 宿主對象

    • 由 ECMAScript 實現的宿主環境提供的對象,包含兩大類,一個是宿主提供,一個是自定義類對象。
    • 所有非本地對象都屬于宿主對象。
    • 對于嵌入到網頁中的JS來說,其宿主對象就是瀏覽器提供的對象,瀏覽器對象有很多,如Window和Document等。
    • 所有的DOM和BOM對象都屬于宿主對象。

關于專業名詞:本地對象也經常被叫做原生對象或內部對象,包含Global和Math在內的內置對象在《JavaScript高級程序設計》里也被叫做單體內置對象,很多時候,干脆也會直接把本地對象和內置對象統稱為“內置對象”,也就是說除了宿主對象,剩下的都是ECMAScript的內部的“內置”對象。

聲明:本文也將采取這種統稱為“內置對象”的方式,比如文章標題。

Object類型

屬性

constructor
prototype

實例方法

1、toString()

功能:返回當前對象的字符串形式,返回值為String類型。

示例:

[1,'2',true].toString(); //"1,2,true" (new Date()).toString(); //"Sun Sep 24 2017 14:52:20 GMT+0800 (CST)" ({name:'ryan'}).toString(); //"[object Object]"

該方法屬于Object對象,由于所有的對象都"繼承"了Object的對象實例,因此幾乎所有的實例對象都可以使用該方法。

JavaScript的許多內置對象都重寫了該函數,以實現更適合自身的功能需要。

2、toLocaleString

功能:返回當前對象的"本地化"字符串形式,以便于當前環境的用戶辨識和使用,返回值為String類型。

示例:

(1234567).toLocaleString(); //"1,234,567" (6.37588).toLocaleString(); //"6.376" (new Date()).toLocaleString(); //"2017/9/24 下午2:58:21"

3、valueOf()

功能:返回指定對象的原始值。

JavaScript的許多內置對象都重寫了該函數,以實現更適合自身的功能需要。因此,不同類型對象的valueOf()方法的返回值和返回值類型均可能不同。

靜態方法

1、Object.assign(target, ...sources)

功能:把一個或多個源對象的可枚舉、自有屬性值復制到目標對象中,返回值為目標對象。
參數:

  • 目標對象(必須)
  • 至少一個源對象(可選)

示例:

var target = {a:1 }; var source1 = { b:2 }; var source2 = { c:function(){ console.log('c'); } }; Object.assign(target,source1,source2); console.log(target); //{a: 1, b: 2, c: ?}

拓展:自定義實現一個assign方法

//自定義一個assign方法function copy(target){ if(target == null){ throwError('出錯:Cannot convert undefined or null to object'); } var target = new Object(target); for(var i = 1;i < arguments.length;i ++){ var source = arguments[i]; for(var key in source){ if(source.hasOwnProperty(key)){ //若當前屬性為源對象自有屬性,則拷貝至目標對象 target[key] = source[key]; } } } return target; }

2、Object.create(proto [,propertiesObject])

功能:創建一個對象,其原型為prototype,同時可添加多個屬性。
參數:

  • proto(必須):原型對象,可以為null表示沒有原型。
  • descriptors(可選):包含一個或多個屬性描述符的對象。

propertiesObject參數詳解:

  • 數據屬性

    • value:值
    • writable:是否可修改屬性的值
    • configurable:是否可通過delete刪除屬性,重新定義
    • enumerable:是否可for-in枚舉
  • 訪問屬性

    • get():訪問
    • set():設置

示例:

function Person(name){ this.name = name; } Person.prototype.say = function(){console.log('my name is ' + this.name +',my age is ' + this.age);} var person = new Person('ryan'); var p = Object.create(person,{ age:{ value: 23, writable: true, configurable: true }, sex:{ configurable: true, get:function(){return sex + '士';}, set:function(value){sex = value;} } }); p.sex = '男'; p.say(); //'my name is ryan,my age is 23' console.log(p.sex); //'男士' p.sex = '女'; console.log(p.sex); //'女士'

總結:Object.create(proto [,propertiesObject]) 是E5中提出的一種新的對象創建方式,第一個參數是要繼承的原型,如果不是一個子函數,可以傳一個null,第二個可選參數是對象的屬性描述符。

3、Object.defineProperty(obj, prop, descriptor)

功能:在一個對象上定義一個新屬性或修改一個現有屬性,并返回該對象。

參數:

  • obj(必須):被操作的目標對象
  • prop(必須):被定義或修改的目標屬性
  • descriptor(必須):屬性的描述符

示例:

var obj = {}; Object.defineProperty(obj,'name',{writable: true, configurable: true, enumerable: false, value: '張三' }); console.log(obj.name); //'張三' for(var key in obj){ console.log(obj[key]); //無結果 }

總結:在參數 descriptor中,如果不指定configurable, writable, enumerable ,則這些屬性默認值為false,如果不指定value, get, set,則這些屬性默認值為undefined。

4、Object.defineProperties(obj, props)

功能:在一個對象上定義一個或多個新屬性或修改現有屬性,并返回該對象。

參數:

  • obj(必須):被操作的目標對象
  • props(必須):該對象的一個或多個鍵值對定義了將要為對象添加或修改的屬性的具體配置

示例:

var obj = {}; Object.defineProperties(obj,{ name:{ writable: true, configurable: true, enumerable: false, value: '張三' }, age:{ writable: true, configurable: true, enumerable: true, value: 23 } }); console.log(obj.name); //'張三' console.log(obj.age); //23 for(var key in obj){ console.log(obj[key]); //23 }

5、Object.seal(obj) / Object.isSealed(obj)
功能:密封對象,阻止其修改現有屬性的配置特性,即將對象的所有屬性的configurable特性設置為false(也就是全部屬性都無法重新配置,唯獨可以把writable的值由true改為false,即凍結屬性),并阻止添加新屬性,返回該對象。

參數:

  • obj(必須):被密封的對象

示例:

var obj = {name:'張三'};Object.seal(obj); console.log(Object.isSealed(obj)); //true obj.name = '李四'; //修改值成功 console.log(obj.name); //'李四' obj.age = 23; //無法添加新屬性 console.log(obj.age); //undefined Object.defineProperty(obj,'name',{ writable: true, configurable: true, enumerable: true }); //報錯:Cannot redefine property: name

補充:Object.isSealed(obj)用于判斷目標對象是否被密封,返回布爾值。

將一個對象密封后僅能保證該對象不被擴展且全部屬性不可重配置,但是原屬性值卻是可以被修改的。

6、Object.freeze(obj) / Object.isFrozen(obj)

功能:完全凍結對象,在seal的基礎上,屬性值也不可以修改,即每個屬性的wirtable也被設為false。

參數:

  • obj(必須):被凍結的對象

示例:

var obj = {name:'張三'};Object.freeze(obj); console.log(Object.isFrozen(obj)); //true obj.name = '李四'; //修改值失敗 console.log(obj.name); //'張三' obj.age = 23; //無法添加新屬性 console.log(obj.age); //undefined Object.defineProperty(obj,'name',{ writable: true, configurable: true, enumerable: true }); //報錯:Cannot redefine property: name

補充:Object.isFrozen(obj)用于判斷目標對象是否被凍結,返回布爾值。

7、getOwnPropertyDescriptor(obj, prop)

功能:獲取目標對象上某自有屬性的配置特性(屬性描述符),返回值為配置對象。

參數:

  • obj(必須):目標對象
  • prop(必須):目標自有屬性

示例:

var obj = {};Object.defineProperty(obj,'name',{ writable: true, configurable: false, enumerable: true, value: '張三' }); var prop = Object.getOwnPropertyDescriptor(obj,'name'); console.log(prop); //{value: "張三", writable: true, enumerable: true, configurable: false}

8、Object.getOwnPropertyNames(obj)

功能:獲取目標對象上的全部自有屬性名(包括不可枚舉屬性)組成的數組。

參數:

  • obj(必須):目標對象

示例:

var obj = {}; obj.say = function(){}; Object.defineProperties(obj,{ name:{ writable: true, configurable: true, enumerable: true, value: '張三' }, age:{ writable: true, configurable: true, enumerable: false, value: 23 } }); var arr = Object.getOwnPropertyNames(obj); console.log(arr); //["say", "name", "age"]

9、Object.getPrototypeOf(obj)

功能:獲取指定對象的原型,即目標對象的prototype屬性的值。

參數:

  • obj(必須):目標對象

示例:

function Person(name){ this.name = name; } var person = new Person('張三'); var p = Object.create(person); //對象p的原型為person console.log(p); //Person {} var __ptoto__ = Object.getPrototypeOf(p); console.log(__ptoto__); //Person {name: "張三"}

10、Object.setPrototypeOf(obj, proto)

功能:設置目標對象的原型為另一個對象或null,返回該目標對象。

參數:

  • obj(必須):目標對象
  • proto(必須):原型對象

示例:

var obj = {a:1}; var proto = {}; Object.setPrototypeOf(obj,proto); //設置obj對象的原型 proto.b = 2; //為該原型對象添加屬性 proto.c = 3; console.log(obj.a); //1 console.log(obj.b); //2 console.log(obj.c); //3

解析:上述代碼將proto對象設為obj對象的原型,所以從obj對象上可以順利讀取到proto 對象的屬性,也就是原型鏈上的屬性。

Object.setPrototypeOf()方法的作用與__proto__相同,用來設置當前對象的原型指向的對象(prototype)。它是 ES6 正式推薦的設置原型對象的方法。

11、Object.keys(obj)

功能:獲取目標對象上所有可枚舉屬性組成的數組。

參數:

  • obj(必須):目標對象

示例:

var person = {type:'person',say:function(){} }; //以person對象為原型,創建obj對象 var obj = Object.create(person,{ sex:{ writable: true, configurable: true, enumerable: false, //設置sex屬性為不可枚舉 value: 'male' }, age:{ writable: true, configurable: true, enumerable: true, //設置age屬性為可枚舉 value: 23 } }); obj.name = '張三'; //自定義屬性name默認為可枚舉 console.log(obj.propertyIsEnumerable('name')); //true,成功驗證name屬性為可枚舉 //用for-in可獲取obj上全部可枚舉的屬性(包括自有和原型鏈上的) var arr = []; for(var key in obj){ arr.push(key); } console.log(arr); //["age", "name", "type", "say"] //用Object.keys()可獲取obj上全部可枚舉的自有屬性 console.log(Object.keys(obj)); // ["age", "name"]

總結:Object.keys(obj)方法獲取的集合和for-in遍歷獲取的不同在于,Object.keys()只獲取目標對象上可枚舉的自有屬性,而for-in遍歷會包含原型鏈上可枚舉屬性一并獲取。

Object.keys()和Object.getOwnPropertyNames()的相同之處都是獲取目標對象的自有屬性,區別在于,后者會連同不可枚舉的自有屬性也一并獲取組成數組并返回。

12、Object.preventExtensions(obj) / Object.isExtensible(obj)

功能:使某一對象不可擴展,也就是不能為其添加新屬性。

參數:

  • obj(必須):目標對象

補充:Object.isExtensible(obj)方法用于判斷一個對象是否可擴展,即是否可以添加新屬性。

示例:

var obj = {name: '張三' };Object.preventExtensions(obj); //阻止obj的可擴展性 console.log(Object.isExtensible(obj)); //false,表明obj對象為不可擴展,即阻止成功 obj.age = 23; //默認添加失敗 console.log(obj.age); //undefined

Array類型

Array 對象屬性

1、length

設置或返回數組中元素的數目。

設置 length 屬性可改變數組的大小。如果設置的值比其當前值小,數組將被截斷,其尾部的元素將丟失。如果設置的值比它的當前值大,數組將增大,新的元素被添加到數組的尾部,它們的值為 undefined。

2、constructor

返回對創建此對象的數組函數的引用。

3、prototype

使您有能力向對象添加屬性和方法。

Array 對象方法

1、concat()

  • 用于連接兩個或多個數組,該方法不會改變現有的數組,而是返回被連接數組的一個副本。
  • 如果要進行 concat() 操作的參數是數組,那么添加的是數組中的元素,而不是數組。

2、join()

  • 把數組中的所有元素放入一個字符串,元素是通過指定的分隔符進行分隔的。
  • 若省略了分隔符參數,則使用逗號作為分隔符。

3、push()

  • 向數組的末尾添加一個或多個元素,并返回新的數組長度。

4、pop()

  • 用于刪除數組的最后一個元素,把數組長度減1,并返回被刪除元素。
  • 如果數組已經為空,則 pop() 不改變數組,并返回 undefined。

5、shift()

  • 用于把數組的第一個元素從其中刪除,并返回被移除的這個元素。
  • 如果數組是空的,那么 shift() 方法將不進行任何操作,返回 undefined。
  • 該方法是直接修改原數組。

6、unshift()

  • 向數組的開頭添加一個或更多元素,并返回新的數組長度。
  • 該方法是直接修改原數組。

7、reverse()

  • 用于顛倒數組中元素的順序。
  • 該方法會直接修改原數組,而不會創建新數組。

8、sort()

  • 用于對數組的元素進行排序。
  • 該排序直接修改原數組,不生成副本。
  • 該方法接受一個可選參數,若未使用參數,將按字母順序對數組元素進行排序,說得更精確點,是按照字符編碼的順序進行排序。要實現這一點,首先應把數組的元素都轉換成字符串(如有必要),以便進行比較。
  • 如果想按照其他標準進行排序,就需要提供比較函數,該函數要比較兩個值,然后返回一個用于說明這兩個值的相對順序的數字。比較函數應該具有兩個參數 a 和 b,其返回值如下:

    • 若 a 小于 b,排序后 a 應該在 b 之前,則返回一個小于 0 的值。
    • 若 a 等于 b,則返回 0。
    • 若 a 大于 b,則返回一個大于 0 的值。

9、slice(start [,end])

  • 截取原數組從start到end位置(不包含它)元素組成的子數組。
  • 該方法返回一個新數組,不會修改原數組。
  • 若未指定end參數,那么截取尾巴直到原數組最后一個元素(包含它)。

10、splice(index,howmany [,item1,item2...])

  • 刪除從 index 處開始的hownamy個元素,并且用可選參數列表中聲明的一個或多個值來替換那些被刪除的元素。
  • 該方法返回的是含有被刪除的元素組成的數組,若無被刪元素,則返回空數組。
  • 若參數只有index,那么原數組將從index開始刪除直至結尾。
  • 該方法直接修改原數組。

map():返回一個新的Array,每個元素為調用func的結果

filter():返回一個符合func條件的元素數組

some():返回一個boolean,判斷是否有元素是否符合func條件

every():返回一個boolean,判斷每個元素是否符合func條件

forEach():沒有返回值,只是針對每個元素調用func

reduce():reduce方法有兩個參數,第一個參數是一個callback,用于針對數組項的操作;第二個參數則是傳入的初始值,這個初始值用于單個數組項的操作。需要注意的是,reduce方法返回值并不是數組,而是形如初始值的經過疊加處理后的操作。

Date類型

Date對象:封裝一個時間點,提供操作時間的API。Date對象中封裝的是從1970年1月1日0點至今的毫秒數。

創建Date對象4種方式

var now = new Date(); //獲取客戶端的當前系統時間var date - new Date("1994/02/04 03:23:55"); //創建自定義時間 var date = new Date(yyyy, MM, dd, hh, mm, ss); //創建自定義時間 var oldDate = new Date("1994/02/04"); var newDate = new Date(oldDate); //復制一個時間對象

日期API

日期分量:FullYear、Month、Date、Day、Hours、Minutes、Seconds、Milliseconds。
每一個日期分量都有一個get和set方法(除了Day沒有set方法),分別用于獲取和設置時間對象。

日期的單位及范圍:

年FullYear (無范圍)
月Month (0~11, 0開始,沒有12)
日Date (1~31, 和現實生活一樣)
星期Day (0~6, 0是星期日,沒有7)
時Hours (0~23. 0開始,沒有24)
分Minutes (0~59)
秒Seconds (0~59)
毫秒MilliSeconds

RegExp類型

RegExp對象屬性

1、global

  • 描述:RegExp 對象是否具有標志 g,即全局匹配。
  • 值:true或false。

2、ignoreCase

  • 描述:RegExp 對象是否具有標志 i,即忽略大小寫。
  • 值:一個整數,它聲明的是上一次匹配文本之后的第一個字符的位置。

3、lastIndex

  • 描述:lastIndex用于規定下次匹配的起始位置。
  • 值:true或false。

不具有標志 g 和不表示全局模式的 RegExp 對象不能使用 lastIndex 屬性。

RegExp對象方法

1、compile()

  • compile() 方法用于在腳本執行過程中編譯正則表達式。
  • compile() 方法也可用于改變和重新編譯正則表達式。

2、exec()

  • 功能:用于檢索字符串中的正則表達式的匹配。
  • 參數:string,必須,要檢索的字符串。
  • 返回值:返回一個數組,其中存放匹配的結果。如果未找到匹配,則返回值為 null。

3、test()

  • 功能:用于檢測一個字符串是否匹配某個模式。
  • 參數:string,必須,要檢索的字符串。
  • 返回值:true或者false。

注意:支持正則表達式的 String 對象的方法有:search()、match()、replace()和split()。

Function類型

Function對象屬性

1、arguments

  • arguments.length:獲取函數實參的個數
  • arguments.callee:獲取函數對象本身的引用
  • arguments.callee.length:獲取函數形參的個數

Javascrip中每個函數都會有一個Arguments對象實例arguments,它引用著函數的實參,可以用數組下標的方式"[]"引用每個實際傳入的參數。

示例:

function say(a,b,c){ console.log(arguments.length); //2 console.log(arguments[0],arguments[1]); //hello world } say('hello','world');

Function對象方法

1、toString()

  • 功能:將函數體轉換成對應的字符串。

Boolean類型

常用方法:

1、toString()

  • 功能:根據布爾值返回字符串 "true" 或 "false"。

注釋:在 Boolean 對象被用于字符串環境中時,此方法會被自動調用。

2、valueOf()

  • 功能:返回 Boolean 對象的原始值。

Number類型

常用方法:

1、toString()

功能:將Number數值轉換為字符串,該方法接受一個可選參數基數,若省略該參數,則默認基數為10,即十進制。

var num = 10; console.log(num.toString(2)); //1010

2、toLocaleString()
功能:把一個 Number 對象轉換為本地格式的字符串。

3、valueOf()
功能:返回一個 Number 對象的基本數字值。

valueOf() 方法通常由 JavaScript 在后臺自動進行調用,而不是顯式地處于代碼中。

String類型

String對象屬性

1、length

功能:String 對象的 length 屬性聲明了該字符串中的字符數。

String對象方法

1、charAt()

  • 功能:返回指定位置的字符。
  • 參數:必須,為目標字符的下標位置。

若參數 index 不在 0 與 string.length 之間,該方法將返回一個空字符串。

2、charCodeAt()

  • 功能:返回在指定的位置的字符的 Unicode 編碼。
  • 參數:必須,為目標字符的下標位置。

若參數 index 不在 0 與 string.length 之間,該方法將返回NaN。

3、indexOf()

  • 功能:檢索字符串,返回指定子字符串在字符串中首次出現的位置。
  • 參數1:檢索目標子字符串,必須。
  • 參數2:在字符串中開始檢索的位置,可選。其合法取值是 0 到 stringObject.length - 1。如省略該參數,則將從字符串的首字符開始檢索。

注意:indexOf() 方法對大小寫敏感!
注意:如果要檢索的字符串值沒有出現,則該方法返回 -1。

4、lastIndexOf()

  • 功能:從后向前搜索字符串,返回指定子字符串在字符串中首次出現的位置。
  • 參數1:檢索目標子字符串,必須。
  • 參數2:在字符串中開始檢索的位置,可選。其合法取值是 0 到 stringObject.length - 1。如省略該參數,則將從字符串的最后一個字符開始檢索。

5、match()

  • 功能:返回指定位置的字符。
  • 參數:必須,規定要檢索的字符串值或待匹配的 RegExp 對象。
  • 返回值:存放匹配結果的數組。該數組的內容依賴于 regexp 是否具有全局標志 g。

如果 regexp 沒有標志 g,那么 match() 方法就只能在 stringObject 中執行一次匹配。如果沒有找到任何匹配的文本, match() 將返回 null。否則,它將返回一個數組,其中存放了與它找到的匹配文本有關的信息。該數組的第 0 個元素存放的是匹配文本,而其余的元素存放的是與正則表達式的子表達式匹配的文本。除了這些常規的數組元素之外,返回的數組還含有兩個對象屬性。index 屬性聲明的是匹配文本的起始字符在 stringObject 中的位置,input 屬性聲明的是對 stringObject 的引用。

如果 regexp 具有標志 g,則 match() 方法將執行全局檢索,找到 stringObject 中的所有匹配子字符串。若沒有找到任何匹配的子串,則返回 null。如果找到了一個或多個匹配子串,則返回一個數組。不過全局匹配返回的數組的內容與前者大不相同,它的數組元素中存放的是 stringObject 中所有的匹配子串,而且也沒有 index 屬性或 input 屬性。

示例:

var s = 'hello21 world21'; console.log(s.match(/\d{2}/)); //[ '21', index: 5, input: 'hello21 world21' ] var s = 'hello21 world21'; console.log(s.match(/\d{2}/g)); //[ '21', '21' ]

6、replace()

  • 功能:在字符串中用一些字符替換另一些字符,或替換一個與正則表達式匹配的子串。
  • 參數1:regexp/substr,必須,規定子字符串或要匹配的 RegExp 對象。
  • 參數2:replacement,必須,用于替換的字符串值。
  • 返回值:替換后的一個新字符串。

示例:

var s = 'hello world hello'; console.log(s.replace('hello','hi')); //hi world hello console.log(s.replace(/hello/,'hi')); //hi world hello console.log(s.replace(/hello/g,'hi')); //hi world hi

replace方法返回一個新字符串,并不會修改原字符串。

7、search()

  • 功能:用于檢索字符串中指定的子字符串,或檢索與正則表達式相匹配的子字符串。
  • 參數:regexp/substr,必須,規定子字符串或要匹配的 RegExp 對象。
  • 返回值:原字符串中第一次匹配到目標字符串的起始位置。

示例:

var s = 'hello world hello'; console.log(s.search('hello')); //0 console.log(s.search(/hello/g)); //0 console.log(s.search(/hello2/)); //-1

search()方法不執行全局匹配,它將忽略標志 g。也就是說,它只匹配一次。若沒匹配到結果,則返回-1。

8、toLowerCase() & toUpperCase()

  • 功能:把字符串轉換為小寫/大寫。
  • 返回值:一個新的字符串。

示例:

var s = 'Hello World'; console.log(s.toLowerCase()); //hello world console.log(s.toUpperCase()); //HELLO WORLD

9、concat()

  • 功能:用于連接兩個或多個字符串。
  • 語法:stringObject.concat(stringX,stringX,...,stringX)
  • 參數:
  • 返回值:銜接后的一個新字符串。

concat方法不會修改原字符串。
stringObject.concat() 與 Array.concat() 很相似。
通常使用 " + " 運算符來進行字符串的連接運算通常會更簡便一些。

示例:

var s1 = 'hello '; var s2 = 'world '; var s3 = '233'; console.log(s1.concat(s2,s3)); //hello world 233

10、split()

  • 功能:用于把一個字符串分割成字符串數組,是 Array.join( ) 的逆操作。
  • 參數1:separator,必須,字符串或正則表達式,從該參數指定的地方分割原字符串。
  • 參數2:howmany,可選,指定返回數組的最大長度。
  • 返回值:一個字符串數組。

示例:

var s = 'hi baby'; console.log(s.split('')); //[ 'h', 'i', ' ', 'b', 'a', 'b', 'y' ] console.log(s.split(' ')); //[ 'hi', 'baby' ] console.log(s.split('b')); //[ 'hi ', 'a', 'y' ]

11、slice()

  • 功能:截取字符串的某個部分,并以新的字符串返回被提取的部分。
  • 參數1:截取的起始位置,必須。
  • 參數2:截取的結束位置,可選。
  • 返回值:截取部分,一個新的字符串。

注意:String.slice() 與 Array.slice() 相似。
slice方法的兩個參數接受負值,若為負數,則該參數規定的是從字符串的尾部開始算起的位置。也就是說,-1 指字符串的最后一個字符,-2 指倒數第二個字符,以此類推。
若未指定第二個參數,則默認截取至字符串的末尾。
slice方法不修改原字符串。

示例:

var s = 'hi baby'; console.log(s.slice(3)); //baby console.log(s.slice(1,5)); //i ba console.log(s.slice(-4)); //baby console.log(s.slice(-4,-2)); //ba

12、substr()

  • 功能:截取從指定下標開始的指定數目的字符。
  • 參數1:start,必須,截取的起始位置,接受負值。
  • 參數2:length,可選,截取字符串的長度,若未指定,則默認截取到原字符串的末尾。
  • 返回值:截取部分,一個新的字符串。

注意:ECMAscript 沒有對該方法進行標準化,因此不建議使用它。

示例:

var s = 'hi baby'; console.log(s.substr(3)); //baby console.log(s.substr(3,2)); //ba console.log(s.substr(-3,2)); //ab

13、substring()

  • 功能:截取字符串中介于兩個指定下標之間的字符。
  • 參數1:start,必須,截取的起始位置。
  • 參數2:end,可選,截取的結束位置,若未指定,則默認截取到原字符串的末尾。
  • 返回值:截取部分,一個新的字符串。

示例:

var s = 'hi baby'; console.log(s.substring(3)); //baby console.log(s.substring(3,5)); //ba console.log(s.substring(5,3)); //ba console.log(s.substring(3,3)); //''

注意:與 slice() 和 substr() 方法不同的是,substring() 不接受負的參數。
如果參數 start 與 stop 相等,那么該方法返回的一個空串。
如果 start 比 stop 大,那么該方法在提取子串之前會先交換這兩個參數。

Global對象(全局對象)

關于全局對象:全局對象只是一個對象,而不是類。既沒有構造函數,也無法實例化一個新的全局對象。

屬性

Infinity
代表正的無窮大的數值。

示例:

console.log(6/0); //Infinity console.log(-6/0); //-Infinity console.log(0/0); //NaN console.log(1.7976931348623157E+10308); //Infinity console.log(-1.7976931348623157E+10308); //-Infinity

Infinity代表了超出JavaScript處理范圍的數值。也就是說JS無法處理的數值都是Infinity。實踐證明,JS所能處理的最大值是1.7976931348623157e+308,而最小值是5e-324。

NaN
代表非數字的值。

示例:

var a = Number('100'); var b = Number('hello world'); console.log(a); //100 console.log(b); //NaN console.log(isNaN(a)); //false console.log(isNaN(b)); //true

提示:請使用 isNaN() 方法來判斷一個值是否是數字,原因是 NaN 與所有值都不相等,包括它自己。

Undefined
代表未定義的值。

示例:

var a; var b = ''; var c = null; console.log(a === undefined); //true console.log(b === undefined); //false console.log(c == undefined); //true

提示:判斷一個變量是否未定義,只能用 === undefined 運算來測試,因為 == 運算符會認為 undefined 值等價于 null,即undefined == null會返回true。

注釋:null 表示無值,而 undefined 表示一個未聲明的變量,或已聲明但沒有賦值的變量,或一個并不存在的對象屬性。

方法

1、encodeURI(URIString)

功能:將字符串作為URI進行編碼,返回值為URIstring 的副本。

參數:

  • URIString(必須):一個待編碼的字符串。

示例:

console.log(encodeURI('http://www.baidu.com')); //http://www.baidu.com console.log(encodeURI('http://www.baidu.com/my mind')); //http://www.baidu.com/my%20mind console.log(encodeURI(',/?:@&=+$#')); //,/?:@&=+$#

該方法不會對 ASCII 字母和數字進行編碼,也不會對這些 ASCII 標點符號進行編碼: - _ . ! ~ * ' ( ) 。

該方法的目的是對 URI 進行完整的編碼,因此對以下在 URI 中具有特殊含義的 ASCII 標點符號,encodeURI() 函數是不會進行轉義的:;/?:@&=+$,#

提示:如果 URI 組件中含有分隔符,比如 ? 和 #,則應當使用 encodeURIComponent() 方法分別對各組件進行編碼。

2、encodeURIComponent(URIString)

功能:將字符串作為URI組件進行編碼,返回值為URIstring的副本。

該方法不會對 ASCII 字母和數字進行編碼,也不會對這些 ASCII 標點符號進行編碼: - _ . ! ~ * ' ( ) 。

其他字符(比如 :;/?:@&=+$,# 這些用于分隔 URI 組件的標點符號),都是由一個或多個十六進制的轉義序列替換的。

參數:

  • URIString(必須):一個待編碼的字符串。

示例:

encodeURI和encodeURIComponent的區別:

它們都是編碼URL,唯一區別就是編碼的字符范圍,其中encodeURI方法不會對下列字符編碼 ASCII字母、數字、~!@#$&*()=:/,;?+'
encodeURIComponent方法不會對下列字符編碼 ASCII字母、數字、~!*()'
所以encodeURIComponent比encodeURI編碼的范圍更大。
實際例子來說,encodeURIComponent會把 http:// 編碼成 http%3A%2F%2F 而encodeURI卻不會。

使用場景:

  • 當你需要編碼整個URL,然后使用這個URL,則使用encodeURI。
console.log(encodeURI('http://www.baidu.com/home/some other thing')); //編碼后為:http://www.baidu.com/home/some%20other%20thing; 其中,空格被編碼成了%20 //但是如果你用了encodeURIComponent console.log(encodeURIComponent('http://www.baidu.com/home/some other thing')); //http%3A%2F%2Fwww.baidu.com%2Fhome%2Fsome%20other%20thing 連 "/" 都被編碼了,整個URL已經沒法用了
  • 當你需要編碼URL中的參數時,那么使用encodeURIComponent。
var param = "http://www.baidu.com/home/"; //param為參數 param = encodeURIComponent(param); var url = "http://www.baidu.com?next=" + param; console.log(url) //'http://www.baidu.com?next=http%3A%2F%2Fwww.baidu.com%2Fhome%2F' //顯然,參數中的 "/" 被編碼了,而如果用encodeURI肯定要出問題,因為后面的/是需要編碼的。

補充:相應的,存在decodeURI()和decodeURIComponent是用來解碼的,逆向操作。

3、parseInt(string,radix)

功能:解析一個字符串,并返回一個整數。

參數:

  • string(必須):待解析的字符串
  • radix(可選):表示要解析的數字的基數。該值介于 2 ~ 36 之間。
    如果省略該參數或其值為 0,則數字將以 10 為基礎來解析。如果它以 “0x” 或 “0X” 開頭,將以 16 為基數。如果該參數小于 2 或者大于 36,則 parseInt() 將返回 NaN。

示例:

console.log(parseInt('10')); //10 console.log(parseInt('11',9)); //10 (9+1) console.log(parseInt('11',2)); //3 (2+1) console.log(parseInt('17',8)); //15 (8+7) console.log(parseInt('1f',16)); //31 (16+15) console.log(parseInt('010')); //10 console.log(parseInt('0x0011')); //17

4、parseFloat()

功能:解析一個字符串,并返回一個浮點數。
該函數指定字符串中的首個字符是否是數字。如果是,則對字符串進行解析,直到到達數字的末端為止。

參數:

  • string(必須):待解析的字符串

示例:

console.log(parseFloat('10')); //10 console.log(parseFloat('10.00')); //10 console.log(parseFloat('10.33')); //10.33 console.log(parseFloat(' 60 ')); //60 首尾的空格會忽略 console.log(parseFloat('23 34 45')); //23 中間的空格不會忽略,會中斷 console.log(parseFloat('23 years')); //23 console.log(parseFloat('i am 23')); //NaN

提示:開頭和結尾的空格是允許的。如果字符串的第一個字符不能被轉換為數字,那么 parseFloat() 會返回 NaN。如果只想解析數字的整數部分,請使用 parseInt() 方法。

5、isFinite(number)

功能:用于檢查其參數是否是無窮大。

參數:

  • number(必須):待檢測數字。
    如果 number 是有限數字(或可轉換為有限數字),那么返回 true。否則,如果 number 是 NaN(非數字),或者是正、負無窮大的數,則返回 false。

示例:

console.log(isFinite(123)); //true console.log(isFinite(-1.23)); //true console.log(isFinite(5-2)); //true console.log(isFinite(0)); //true console.log(isFinite(0/0)); //false console.log(isFinite('Hello')); //false

6、isNaN(number)

功能:用于檢查其參數是否為非數字值。

參數:

  • number(必須):待檢測數字。
    如果 number 是非數字值 NaN(或者能被轉換成NaN),返回 true,否則返回 false。

示例:

console.log(isNaN(123)); //false console.log(isNaN(-1.23)); //false console.log(isNaN(5-2)); //false console.log(isNaN(0)); //false console.log(isNaN(0/0)); //true console.log(isNaN('Hello')); //true

提示:isNaN() 函數通常用于檢測 parseFloat() 和 parseInt() 的結果,以判斷它們表示的是否是合法的數字。當然也可以用 isNaN() 函數來檢測算數錯誤,比如用 0 作除數的情況。

7、Number(object)

功能:把對象的值轉換為數字。

參數:

  • object(必須):待轉換的對象。
    如果參數是 Date 對象,Number() 返回從1970年1月1日至今的毫秒數,即時間戳。如果對象的值無法轉換為數字,那么 Number() 函數返回 NaN。

示例:

console.log(Number(new Boolean(true))); //1 console.log(Number(new Boolean(false))); //0 console.log(Number(new Date())); //1506266494726 console.log(Number(new String('999'))); //999 console.log(Number(new String('999 888'))); //NaN

8、String(object)

功能:把對象的值轉換為字符串。

參數:

  • object(必須):待轉換的對象。

示例:

console.log(String(new Boolean(true))); //'true' console.log(String(new Boolean(false))); //'false' console.log(String(new Date())); //'Sun Sep 24 2017 23:25:43 GMT+0800 (CST)' console.log(String(new String('999'))); //'999' console.log(String(new String('999 888'))); //'999 888' console.log(String(12345)); //'12345'

Math對象

常用方法:

Math.abs(); //取絕對值 Math.ceil(); //向上取整 Math.floor(); //向下取整 Math.round(); //四舍五入取整 Math.random(); //生成0~1間的隨機數(>0) Math.max(x,y); //取x、y中較大的那個 Math.min(x,y); //取x、y中較小的那個

JSON對象

我們常說的對象字面量其實不是JSON對象,但是有真正的JSON對象。

兩者完全不一樣概念,在新版的瀏覽器里JSON對象已經被原生的內置對象了,目前有2個靜態方法:JSON.parse用來將JSON字符串反序列化成對象,JSON.stringify用來將對象序列化成JSON字符串。

老版本的瀏覽器不支持這個對象,但你可以通過json2.js來實現同樣的功能。

JSON對象方法

1、JSON.parse()

  • 功能:將字符串反序列化成對象
  • 參數:JSON字符串
  • 返回值:對象

示例:

var jsonString = '{"name":"ryan"}'; //JSON字符串(比如從AJAX獲取字符串信息) var obj = JSON.parse(jsonString); //將字符串反序列化成對象 console.log(obj); //{ name: 'ryan' } console.log(obj.name == 'ryan'); //true

2、JSON.stringify()

  • 功能:將一個對象解析為JSON字符串
  • 參數:對象
  • 返回值:JSON字符串

示例:

var obj = {name:'ryan',age:23}; var jsonString = JSON.stringify(obj); console.log(jsonString); //'{"name":"ryan","age":23}'

轉載于:https://www.cnblogs.com/123fantao/p/8339816.html

總結

以上是生活随笔為你收集整理的JS 内置对象的全部內容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。