文章目錄

• • 常用api
  • Date
  • String
  • Math對象
  • Array
  • 定義對象的幾種方法
  • JSON對象
  • Number對象
  • Boolean對象
  • Storage 對象分為兩類（ sessionStorage 和 localStorage）
  • • sessionStorage&localStorage
  • Object 對象;
  • Promise 對象;
  • File對象||FileReader 對象
  • Blob 二進制大對象
  • FormData 對象
  • 遞歸函數
  • 節流與防抖
  • • • 防抖
      • 節流

常用api

clearInterval() //清除定時器setInterval() //制作定時器toFixed(N) //保存N位小數arguments.length; //傳參的個數；arguments對象 //保存實參，類似數組，不是數組。window.open() //打開新窗口； obj.hasOwnProperty(key) //判斷對象是否包含某個鍵;

Date

get/setFullYear() //獲取/修改年份；//返回年份get/setMonth() //月份,取值范圍為0~11，所以在返回值的基礎加一，或者修改日期減一；get/setDate() //日期（幾號） get/setDay() //星期 //返回0~6，0代表星期天，get/setHours() //時get/setMinutes() //分get/setSeconds() //秒get/setMilliseconds() //毫秒0~999之間;get/setTime() //返回從1970年1月1日到日期對象的日期的毫秒數；valueOf()//同上;Date.parse(obj) //同上;Date.now() //同上，可以不實例化對象就可以直接調用toLocaleString() //日期和時間以字符串形式輸出。xxxx/xx/xx上午xx:xx:xxtoLocaleDateString() //把時間對象轉換成年月日字符串xxxx/xx/xxtoLocaleTimeString() //把時間對象轉換成時間字符串 上午xx:xx:xx。

String

fontcolor("color") //改變字符串的顏色；(相當于添加一個font標簽,配合innerHTML使用);fontsize("size") //改變字體大小； (相當于添加一個font標簽,配合innerHTML使用);bold() //字體加粗； (相當于添加一個font標簽,配合innerHTML使用);italics() //字體斜體； (相當于添加一個font標簽,配合innerHTML使用);indexOf(index) //索引返回位置 兩個參 第一個是索引下標 第二個是位置charAt(char) //索引字節 返回字節的值 索引的是個下標；charCodeAt(index) //索引字節 返回字節的ASCII碼 索引的是下標，超出范圍為索引到返回NaN, ;String.fromCharCode() 將ASCII碼轉換成字符串;startsWith(char) //判斷字符串是不是以char開頭；endsWith(char) //判斷字符串是不是以char結束； includes(string,index) //判斷字符串是不是包含字符串，index是開始查找的位置； trim() //修剪兩端的空格 去除字符串兩端的空格 ；split('char') //分割字符串， 返回一個數組 第一個值是分割的字節 第二個值是分割數組的長度；slice(starindex,endindex) //(切片 截取字符串)第一次參數是開始，第二個參數結束，開始截取，結束不截取，按照下標截取字符串；substring(starindex,endindex) //（截取字符串）提取兩個字符之間的字符串，與slice不同之處在于負數自動轉化為0，開始值與結束值可以互換；substr( 'index'，'length') //(抽取指定字符的字符串) 同上；不同點在于第二個參數，一個是位置，另一個是長度；toUpperCase() //來將文本轉換為大寫；toLowerCase() //轉換成小寫；match() //索引字符串中是否包含此字節，包含返回此字節，不包含返回未定義 replace() //在字符串中用某些字符替換另一些字符，/char/i對大小寫敏感，/char/g對全部數組進行替換；(不修改源字符串repeat(n) //復制字符串n次

Math對象

ceil(x) //向上（大）取整，（天花板）取最接近x上面的值，比如Math.celi(3.2)==4；floor(x) //向下（小）取整，(地板)取最接近x下面的值，比如Math.floor(3.2)==3;round() //四舍五入取整；random() //返回0~1之間的隨機數；max() //最大值；min() //最小值；pow(a,n) //冪運算 a的n次方;abs(-5) //絕對值 //5max.apply(null, arr) //數組最大值； Math.abs(x) 返回 x 的絕對值 Math.exp(x) 返回 Math.E 的 x 次冪 Math.expm1(x) 等于 Math.exp(x) - 1 Math.log(x) 返回 x 的自然對數 Math.log1p(x) 等于 1 + Math.log(x) Math.pow(x, power) 返回 x 的 power 次冪 Math.hypot(...nums) 返回 nums 中每個數平方和的平方根 Math.clz32(x) 返回 32 位整數 x 的前置零的數量 Math.sign(x) 返回表示 x 符號的 1、0、-0 或-1 Math.trunc(x) 返回 x 的整數部分，刪除所有小數 Math.sqrt(x) 返回 x 的平方根 Math.cbrt(x) 返回 x 的立方根 Math.acos(x) 返回 x 的反余弦 Math.acosh(x) 返回 x 的反雙曲余弦 Math.asin(x) 返回 x 的反正弦 Math.asinh(x) 返回 x 的反雙曲正弦 Math.atan(x) 返回 x 的反正切 Math.atanh(x) 返回 x 的反雙曲正切 Math.atan2(y, x) 返回 y/x 的反正切 Math.cos(x) 返回 x 的余弦 Math.sin(x) 返回 x 的正弦 Math.tan(x) 返回 x 的正切

Array

includes() //判斷數組是否包含此內容,返回布爾值;concat() //鏈接兩個或者多個數組，返回一個新數組，不會改變原來數組（用法：arrayobject.concat(arrayobject2)(第一個不用加）join() //分割數組，將數組以字符串的形式進行分割，參數是分割符，每個元素之間都會加上分割符；reverse() //顛倒數組元素的位置，會改變原數組；unshift() //往數組頭部添加元素； !!!返回值為最后一個元素，原數組會被刪除;push() //往數組尾部添加元素shift() //刪除數組頭部元素；!!!返回值為第一個元素，但是原數組也會被刪除;pop() //刪除數組尾部元素；splice(刪除元素的開始下標，刪除幾個元素，替換的元素)//指定刪除元素，可以用新元素替換；(注意：刪除元素時，會立即執行，因此下標會改變，在配合for循環時，會造成順序錯亂，記得讓i值減一)；splice() //也可以把元素添加到指定位置，刪除的元素為0，會在元素下標元素之前添加;fill() //充滿整個數組;參數是將真個數組數據替換成傳入的值， 也可以直接創建一個帶長度的數組;new Array(10) // 創建一個10個長度的數組;Array.isArray() //判斷是不是數組，返回值是布爾類型的 要帶父類Array來判斷；slice() //切片 選定元素（不包含選中元素） String.slice() 與 Array.slice() 相似 截取元素；sort(方法函數) //數組排序，如果有方法，執行方法函數，沒有方法執行Unicode碼順序排序；{該函數要比較兩個值，然后返回一個用于說明這兩個值的相對順序的數字。比較函數應該具有兩個參數 a 和 b，其返回值如下： 若返回值<=-1，則表示 A 在排序后的序列中出現在 B 之前。 function sortNum(a,b){ //若返回值>-1 && <1，則表示 A 和 B 具有相同的排序順序。 return a-b; //升序，降序的話改成b-a；若返回值>=1，則表示 A 在排序后的序列中出現在 B 之后。 } }Array.from（Stringobject，function（value(值),key（下標））//轉換類數組為數組， 返回值為一個全新的數組。第一個參數必填 //將類數組轉換為數組,但是字符串效果是每個字符都是數字的一個元素 ,有時候我們不想這樣，可以用字符串的split()方法; //可以選擇使用回調函數，返回值為數組；forEcach() //遍歷數組； forEach(funxtion(value,index,array){//方法體，可用于二維多維數組的遍歷，沒有返回值,不能修改原數組 ； });map() //映射，對數組每個元素指定函數，返回值為數組； map(function(value,index,array){；//對數組中的每一個元素運行指點的函數，返回每次函數調用的結果，組成新數組。//return })filter() //篩選數組， 返回一個新數組； fliter(function (value,index,array){return //判斷條件；條件為真，添加到新數組中，條件為假，不添加。字符串索引可以配合match使用； });find(function(vlaue,index,arrray){return //判斷條件，條件為真，返回第一個符合條件的； })findIndex(function(value,index,array){return //判斷條件，返回符合條件的第一個索引; }); some() //查找元素如果由于一個是否有滿足條件的元素，如果有，返回true，沒有返回false; some(functioin(value，index，array){return //判斷條件，字符串索引可以配合match使用；返回值為布爾類型； })eaery(function(value,index,array){ //判斷是否全部滿足這個元素，是返回true,不是返回false;return //判斷條件，字符串索引可以配合match使用；返回值為布爾類 })

定義對象的幾種方法

1，var obj=new Object({ //通過Object()方法創建對象;title:'zhang';}); 2, var obj={}; //以字面量方式構建函數;3, var obj=Object.create({ //以Objext.create()方法定義對象;title:'zhang '; });4,function ClassName(參數){ //通過構造函數實例化對象;this.參數=參數;由于我們創建的是 p1 對象，因此構造函數內部的this指的就是 obj對象。注： 構造函數中的 this 指的是對象，具體指哪個對象，需要看誰訪問構造函數中的屬性/方法 } var obj = ClassName(實參);

JSON對象

格式：{ "id":1,"uname":'jon' } //key必須要雙引號包裹，值可以用單引號;JSON.parse() //將json數據轉換成對象;JSON.stringify() //將對象轉化成JSON數據;將字符串轉化json對象：var json = JSON.parse(str); var json = eval("(" + str + ")"); //不必遵守格式 var json = (new Function("return " + str))(); //不必遵守格式

Number對象

Number() //將其他類轉換成數字；parseInt() //轉換為Int類型;parseFloat() //轉換為Float類型;isNaN() //判斷是否為非數字;Number.isInteger() //判斷參數是不是整型; (不可省略Number);Number.isSafeInteger() //判斷參數是不是雙精度的整形;

Boolean對象

Boolean() //將其他類轉換為Boolean類型, 除了(0,NaN,undefined,null,false,),其余都為真（ture）;

Storage 對象分為兩類（ sessionStorage 和 localStorage）

sessionStorage 用來存儲與頁面相關的數據，它在頁面關閉后無法使用。

而 localStorage 則持久存在，在頁面關閉后也可以使用；

sessionStorage&localStorage

sessionStorage對象和 cookie 相似；區別是 DOM Storage 提供了更大容量的存儲空間length：返回當前存儲在 Storage 對象中的鍵值對數量。key(index)：返回列表中第 n 個鍵的名字。Index 從 0 開始。getItem(key)：返回指定鍵對應的值。setItem(key, value)：存入一個鍵值對。removeItem(key) ：刪除指定的鍵值對。clear()：刪除 Storage 對象中的所有鍵值對。

Object 對象;

Object.assign() 將對象的地址傳送給另一個變量,(淺拷貝); 第二個傳給第一個，會把第一個覆蓋調;Object.create() //創建一個新對象并賦值（深拷貝）;Object.keys() //獲取對象所有的鍵值 并返回一個數組;Object.values() //獲取對象所有的值，并返回一個數組;Object.entries() //將對象的每個鍵值對轉化成一個數組，存放在一個大數組中;Object.is() //判斷兩個對象是否一致（值類型判斷值是否一直，引用類型判斷是否指向同一塊內存地址）;Object.freeze() //凍結對象；對象的所有屬性無法進行刪除，修改操作，只能進行枚舉； ( 如果像對單一屬性進行凍結操作，使用下面的definnProperty() 函數);Object.isFrozen() //判斷這個對象是否被凍結;Object.preventExtensions() //阻止一個對象進行擴展（不能給對象添加屬性，打點賦值不會報錯，但沒有效果.不能使用defineProperty() 給對象添加屬性，會報錯);Object.isExtensible() //判斷對象是否可以擴展;Object.seal() //密封對象,對象可以被修改，枚舉，但是不能進行刪除,添加;Object.isSealed() //判斷對象是被密封;delete Object.value //刪除對象的一個屬性;defineProperty() //為一個對象添加一個屬性，并且可以為屬性添加一個屬性描述：例如：屬性是否可以重寫 writeable 、是否可枚舉enmuable，set/get訪問器等參數一 //要添加屬性的對象; 參數二 //要添加的屬性名 參數三 //屬性描述對象{}下面的是參數三的配置鍵value //這個屬性的屬性值;configurable //配置一個屬性是否可以被刪除，如果值為true，該屬性可以被刪除的，如果為false該屬性不能被刪除，默認值為falseenumerable //該屬性是否可以枚舉，是否可以通過for...in..來進行遍歷，默認值為false,為false的時候不能進行枚舉，true的時候可以被枚舉;writable //配置該屬性是否可以被重寫，該屬性為true證明可以被修改，為false不能被修改，默認值為falseset/get // set和get訪問器不能和value 和 writeable這個配置連用;set //設置屬性值 set:functioin(value){ window.HeightValue=value}; //為什么使用window.HeightValue 因為這里不能直接是給屬性賦值要找個變量接收下，讓下面的get方法ruturn出去; 這樣定義不嚴謹，一般HeightValue 這個值要定義一個全局變量，在嚴格模式下，就不能夠這樣寫啦;get //獲取屬性值 get:functioin(){return HeightValue}; 注意！方法里面不能打點調用這個屬性，不然形成死循環;forof 于forin 的區別 forof只能遍歷數組，而forin既可以遍歷數組，也可以遍歷對象; forof遍歷對象，只能使用Object.entries()方法，將對象轉換為數組這樣事半功倍，遍歷對象推薦使用forin ;

Promise 對象;

promise 承諾的意思;

異步執行：在執行一段代碼時，不影響后續代碼執行，稱之為異步執行，一般這個異步執行函數，都會有回調函數，在代碼執行完成之后調用此函數;（不知道什么時候執行完畢）;同步執行：代碼按照順序執行，下局代碼要等到上句代碼執行完畢才會執行;(會堵塞代碼的執行);Promise 對象，是es6新增的特性，主要解決異步執行多層嵌套的問題（解決地獄回調，倒金字塔），promise有三個狀態，pending狀態，創建promise對象的狀態;resolve狀態：異步執行成功的狀態，（例如請求數據成功）reject狀態：異步執行失敗的狀態,(例如請求數據失敗)通過new 關鍵字創建一個promise對象,參數是一個回調函數，回調函數可以有兩個參數，resolve函數和reject()函數用來將據傳遞出去；Promise 對象一般寫在一個函數中，通過return將promise對象返回出去，配合peomise對象的api，解決地獄回調;如果異步任務執行完成，例如請求得到數據了，使用resolve();如果異步任務沒有執行完成。例如沒有得到數據，使用reject();functioin add(){ var promise=new Promise((resolve,reject)=>{resolve("成功數據");reject("失敗數據"); });return promise; }promise.then((data)=>{}) //獲取resolve()傳遞的值;promise.catch((err)=>{}) //獲取reject()傳遞的值;promise.finally(()=>{}) //不論成功與否，都會執行;cook().then(eat).then(wash).then(data=>console.log(data)) //將回調函數替換成函數傳遞進去然后繼續調用使用傳遞的參數;在jquery 中，ajax請求后面可以直接填寫then,或者catch方法，相當于在配置函數中使用success回調函數和error回調函數;常用apiPromise.resolve("參數") //可與將promise對象轉化成成功狀態;Promise.reject("參數") //將對象轉化成失敗狀態;Promise.all([]) //參數是一個數據,數組里面包括全部的promise實例的對象,當全部實例對象的狀態都是成功時，可以調用then方法,返回的時由所有對象傳遞的參數組成的數組,但是如果有一個對象返回失敗狀態，catch方法就會返回當前失敗對象的參數;Promise.race() //競賽，數組中那個先確定狀態，就返回那個對象所傳遞的值;

File對象||FileReader 對象

File對象可用讓瀏覽器獲取用戶的文件的信息，還可以讀取這個文件的內用，一般用于input type：file 和做拽事件e.dataTransfer.file 會返回一個file對象;files //input type為file的文本框都有一個屬性 ,用于返回所選文件file對象的集合（fileList）;集合里面包括：name //file對象的文件名稱;type //file對象的MIME類型;size //file對象的大小;(bytes)lastModified //文件最后被修改的時間戳;FileReader 對象 文件讀取對象 FileReader對象是通過web程序異步訪問本地用戶的文件的對象（或原始數據緩沖區） （異步執行！）;創建 使用new關鍵字 let read=new FileReader();readAsDataURL() //使用File對象或者Blob對象傳入參數讀取指定的文件為DataURL;read.result ||e.target.result || this.result //獲取讀取元素的DataURL格式的文件內容; 由于是異步執行，在下面是獲取不到的 所以改屬性在讀取完成之后 內容就變成了null 注意需要配合onload方法使用readAsText() //將文件讀取為文本; 參數一，讀取的文件 參數二文件編碼類型(gb2312)ArrayBuffer() //將文件轉化成ArrayBuffer 對象;abort() //中斷文件操作;事件onabort() //中斷文件時觸發;onerror() //文件出錯的時候觸發;onloadstart() //文件開始的時候觸發;onloadgress() //文件讀取中觸發;onload() //文件讀取結束觸發;onloadend //不論文件讀取成功與否，都會在文件讀取結束之后執行;

Blob 二進制大對象

實際上File對象就是Blob更具體的一個版本，File對象繼承了Blob對象的type和size屬性，其內部存儲了大量的二級制數據，同樣FileReader對象也是從Bolb對象中讀取;Blob構造函數，接受兩個參數。第一個參數是一個包含實際數據的數組，第二個參數是數據的類型，這兩個參數都不是必需的。數組元素可以是任意多個的ArrayBuffer，ArrayBufferView (typed array)， Blob，或者 DOMString對象。

FormData 對象

用FormData對象,我們可以通過JavaScript用一些鍵值對來模擬一系列表單控件,我們還可以使用XMLHttpRequest的send()方法來異步的提交這個”表單”.比起普通的ajax,使用FormData的最大優點就是我們可以異步上傳一個二進制文件;創建一個FormData new FormData() //參數可以是form 參數可選，是一個HTML表單元素，可以包含任何形式的表單控件,包括文件輸入框。append() //給當店formData對像添加一個鍵值對;

遞歸函數

1.什么是遞歸函數
如果一個函數在內部可以調用其本身，那么這個函數就稱為遞歸函數。
簡單理解：函數內部自己調用自己
遞歸函數的作用其實跟循環的效果一樣

// function fun1(){// console.log("什么是遞歸函數");// fun1();// };// fun1();// 由于遞歸很容易引起棧溢出錯誤，因此在使用時，一般需要添加退出條件// Uncaught RangeError: Maximum call stack size exceeded 棧溢出的錯誤

節流與防抖

防抖

// 防抖：執行的是某個時間內的最后一次，但在一個周期內定時器會重建。function debounce(fn, delay) {var timer; // 維護一個 timerreturn function () {var _this = this; // 取debounce執行作用域的thisvar args = arguments;// 在等待的時間內，如果定義時器存在，會先清除定時器，再重新創建。if (timer) {clearTimeout(timer);}timer = setTimeout(function () {fn.apply(_this, args); // 用apply指向調用debounce的對象，相當于_this.fn(args);}, delay);};}

節流

var throttle = function(func, delay) { var timer = null; var startTime = Date.now(); return function() { var curTime = Date.now(); var remaining = delay - (curTime - startTime); var context = this; var args = arguments; clearTimeout(timer); if (remaining <= 0) { func.apply(context, args); startTime = Date.now(); } else { timer = setTimeout(func, remaining); } } } function handle() { console.log(Math.random()); } window.addEventListener('scroll', throttle(handle, 1000));方法二/ 方案：單位時間內時間開始的時候執行，第一次function throttle(fn, delay) {var lastTime = 0;return function () {var nowTime = Date.now();// 表示等等的時間已經到了，重置lastTime,并且要調用fnif (nowTime - lastTime > delay) {lastTime = Date.now();fn.call(this, arguments)}}}

總結

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

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