以下是個(gè)人總結(jié)，也有一些是copy大神的，現(xiàn)在放到一起，方便以后查閱（有不對(duì)的地方，還望大家能夠提出，我會(huì)盡快加以改正）。

一、!!強(qiáng)制轉(zhuǎn)布爾值boolean
根據(jù)當(dāng)前需要判斷的值是真值還是假值來(lái)判斷，真值返回true，假肢返回false，那么這樣的話，除了假值，剩下的也都是真值了。

假值有： 0 、 “” 、 null 、 undefined 、 false 、NaN、

除了這 6 個(gè)外，其它均為“真” ，包括對(duì)象、數(shù)組、正則、函數(shù)等。
注意: '0'、'null'、'false'、{}、[]也都是真值 。
那么下面我們來(lái)看看!!是如何轉(zhuǎn)布爾值的。
例如：
首先我們聲明3個(gè)變量,x為null,y為空字符串,str為字符串,下面看看他們添加了"!!"后會(huì)有什么結(jié)果。

var x=null; var y=""; var str="abcd"; console.log(!!x) // false; console.log(!!y) // false; console.log(!!str) // true;

如上所說(shuō)，假值返回false,真值返回true。

二、在str前添加一個(gè)?號(hào),+str會(huì)強(qiáng)制轉(zhuǎn)Number
將字符串前加+，可以強(qiáng)制轉(zhuǎn)number,下面我們就一起來(lái)試試吧！

var str="88"; console.log(+str) // 88 //但是如果是混合類(lèi)型的字符串，則會(huì)轉(zhuǎn)為NaN var b="1606e"; console.log(+b) // NaN

三、不可靠的undefined 可靠的void 0
在JavaScript中，假設(shè)我們想判斷一個(gè)是否是 undefined，那么我們通常會(huì)這樣寫(xiě)：

if(a === undefined){ dosomething..... }

因?yàn)樵趈avascript中，undefined是不可靠的
例如：
當(dāng)undefined被放在在function函數(shù)內(nèi)，我們把它當(dāng)成一個(gè)局部變量，它是可以賦上值的，下面我們來(lái)試試。

function foo2(){ var undefined=1; console.log(undefined) } foo2(); // 1;

但是當(dāng)在函數(shù)內(nèi)定義一個(gè)全局變量，并不能給賦上值

var undefined; function foo2(){ undefined=1; console.log(undefined) } foo2() // undefined

那么我們?cè)囋囉胿oid 0或者 void (0)來(lái)代替：
先聲明一個(gè)變量a，賦值為undefined，接下來(lái)我們用void 0來(lái)判斷一下。

var a=undefined; //用void 0來(lái)判斷一下 if(a===void 0){ console.log('true') } // true //再用void (0)來(lái)判斷一下 if(a===void (0)){ console.log('true') } // true //最后我們打印一下這兩個(gè)的返回值 console.log(void 0,void (0)) // undefined undefined

我們現(xiàn)在可以通過(guò)void 0 運(yùn)算來(lái)獲得 undefined；那在以后需要判斷值為undefined的時(shí)候，可以直接用void 0或者void (0)，而且這兩個(gè)值的直接返回值就是undefined，所以說(shuō)非常可靠哦！

四、字符串也是有l(wèi)ength屬性的！
我們知道所有的Array都是有l(wèi)ength屬性的，就算是空數(shù)組，那么length 為0，那么字符串有沒(méi)有呢？接下來(lái)我們來(lái)驗(yàn)證一下。

var str="sdfsd5565s6dfsd65sd6+d5fd5"; console.log(str.length) // 26

結(jié)果是有的，所以我們?cè)谂袛囝?lèi)型時(shí)，不能單純拿有沒(méi)有l(wèi)ength屬性來(lái)判斷是不是數(shù)組了，我們可以用下面的方法來(lái)判斷是否是數(shù)組：

var obj=[1,2] ; console.log(toString.call(obj) === '[object Array]');

五、如何創(chuàng)建一個(gè)隨機(jī)數(shù)組，或者將已有的數(shù)組打亂？
在項(xiàng)目中有時(shí)候我們需要一個(gè)隨機(jī)打亂的數(shù)組，那么下面我們來(lái)實(shí)現(xiàn)以下：
先來(lái)創(chuàng)建一個(gè)數(shù)組：

var arr=[]; for(var i=0;i<10;i++){ arr.push(i) } console.log(arr) // [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

接下來(lái)我們來(lái)打亂它：

arr.sort(()=>{ return Math.random() - 0.5 }) // [1, 0, 2, 3, 4, 6, 8, 5, 7, 9]

第二種打亂方法：

arr.sort((a,b)=>{ return a>Math.random()*10; }) // [1, 2, 0, 6, 4, 3, 8, 9, 7, 5]

我們以前的正常排序是這樣的：

arr.sort(function(a,b){ return b-a });

解析：
先說(shuō)正常的排序：
a,b表示數(shù)組中的任意兩個(gè)元素，若return > 0 ,b前a后；若reutrn < 0 則a前b后；當(dāng)a=b時(shí)，則存在瀏覽器兼容 ；
a-b輸出從小到大排序，b-a輸出從大到小排序。
然后再說(shuō)我們打亂的方法：
創(chuàng)建數(shù)組不用說(shuō)，接下來(lái)就是用js的sort方法 來(lái)實(shí)現(xiàn)，Math.random()實(shí)現(xiàn)一個(gè)隨機(jī)0-1之間的小數(shù) 然后再減去0.5，這時(shí)就會(huì)根據(jù)return比較后得到的值排序，所以說(shuō)就會(huì)生成不是正常從大到小或者從小到大的排序。

第二個(gè)打亂的方法同樣是遵循sort的方法，將a,b傳進(jìn)去 然后和隨機(jī)數(shù)做比較，關(guān)于比較的方法不太清楚。

六、去除前后、前、后 所有空格
這是專(zhuān)門(mén)為去除空格寫(xiě)的一套方法，適用于各種情況，所有空格,前后空格，前空格，后空格。

var strr="    1 ad dertasdf sdfASDFDF DFG SDFG    "     //  type 1-所有空格，2-前后空格，3-前空格，4-后空格function trim(str,type){     switch (type){         case 1:return str.replace(/\s+/g,"");         case 2:return str.replace(/(^\s*) (\s*$)/g, "");         case 3:return str.replace(/(^\s*)/g, "");         case 4:return str.replace(/(\s*$)/g, "");         default:return str;     } } console.log( trim(strr,1))      //  "1addertasdfsdfASDFDFDFGSDFG"

解析：
這個(gè)方法用的是正則的匹配格式,后面我會(huì)把正則單獨(dú)拿出來(lái)總結(jié)一個(gè)系列，敬請(qǐng)期待！！！

\s ： 空格符，Tab,換頁(yè)符，換行符 \S ： 非\s的所有內(nèi)容 /g : 全局匹配 ^ : 匹配在行首 $ : 匹配在行尾 + ： 重復(fù)次數(shù)>0 * ： 重復(fù)次數(shù)>=0 : 或者

replace(a,b)： 方法用于在字符創(chuàng)中用一些字符替換另一些字符, 會(huì)傳入兩個(gè)值，將逗號(hào)前面的值a替換成逗號(hào)后面的值b。

七、字母大小寫(xiě)切換（正則匹配，replace）
這個(gè)方法主要是給一些需要大小寫(xiě)轉(zhuǎn)換提供的方法，主要有首字母大寫(xiě)，首字母小寫(xiě)，大小寫(xiě)轉(zhuǎn)換，全部轉(zhuǎn)大寫(xiě)和全部轉(zhuǎn)小寫(xiě)。

type： 　　1:首字母大寫(xiě) 　　2：首頁(yè)母小寫(xiě) 　　3：大小寫(xiě)轉(zhuǎn)換 　　4：全部大寫(xiě) 　　5：全部小寫(xiě)

原始字符串：

var str="sdfwwerasfddffddeerAasdgFegqer"; function changeCase(str,type) {    //這個(gè)函數(shù)是第三個(gè)大小寫(xiě)轉(zhuǎn)換的方法     function ToggleCase(str) {         var itemText = ""         str.split("").forEach(                 function (item) {                  // 判斷循環(huán)字符串中每個(gè)字符是否以a-z之間開(kāi)頭的并且重復(fù)大于0次                     if (/^([a-z]+)/.test(item)) {                     //  如果是小寫(xiě)，轉(zhuǎn)換成大寫(xiě)                         itemText += item.toUpperCase();                     }                 //  判斷循環(huán)字符串中每個(gè)字符是否以A-Z之間開(kāi)頭的并且重復(fù)大于0次                     else if (/^([A-Z]+)/.test(item)) {                    //   如果是大寫(xiě)，轉(zhuǎn)換成小寫(xiě)                         itemText += item.toLowerCase();                     }                     else{                   //  如果都不符合，返回其本身                         itemText += item;                     }                 });         return itemText;     }   //下面主要根據(jù)傳入的type值來(lái)匹配各個(gè)場(chǎng)景     switch (type) {          //當(dāng)匹配         case 1:             return str.replace(/^(\w)(\w+)/, function (v, v1, v2) {                  //v=驗(yàn)證本身  v1=s ; v2=dfwwerasfddffddeerAasdgFegqer                 return v1.toUpperCase() + v2.toLowerCase();             });         case 2:             return str.replace(/^(\w)(\w+)/, function (v, v1, v2) {                 //v=驗(yàn)證本身  v1=s ; v2=dfwwerasfddffddeerAasdgFegqer                 return v1.toLowerCase() + v2.toUpperCase();             });         case 3:             return ToggleCase(str);         case 4:             return str.toUpperCase();         case 5:             return str.toLowerCase();         default:             return str;     } }  console.log(changeCase(str,1))   //SdfwwerasfddffddeerAasdgFegqer

解析：

split：用于把一個(gè)字符串分割成字符串?dāng)?shù)組 \w: 數(shù)字0-9或字母a-z及A-Z,或下劃線 \W: 非\w，除以上的特殊符號(hào)等 toUpperCase：轉(zhuǎn)大寫(xiě) toLowerCase：轉(zhuǎn)小寫(xiě) replace第二個(gè)參數(shù)可以是函數(shù)，函數(shù)的參數(shù)中，第一個(gè)是本身，第二個(gè)是正則匹配內(nèi)容，第三個(gè)匹配剩下的內(nèi)容

下面我們就通過(guò)小實(shí)驗(yàn)來(lái)驗(yàn)證一下：
網(wǎng)上有說(shuō)replace是可以有4個(gè)參數(shù)的，但是我并沒(méi)有驗(yàn)證到第四個(gè)代表的意義，前三個(gè)已經(jīng)驗(yàn)證，第一個(gè)參數(shù)為驗(yàn)證本身，第二個(gè)正則匹配結(jié)果，第三為第二個(gè)匹配完剩下的值。

八、循環(huán)n次傳入的字符串
str為傳入隨意字符串，count為循環(huán)的次數(shù)

var str="abc";  var number=555; function repeatStr(str, count) {     //聲明一個(gè)空字符串，用來(lái)保存生成后的新字符串     var text = '';     //循環(huán)傳入的count值，即循環(huán)的次數(shù)     for (var i = 0; i < count; i++) {        //循環(huán)一次就把字符串+到我們事先準(zhǔn)備好的空字符串上         text += str;     }     return text; }   console.log(repeatStr(str, 3))         // "abcabcabc"   console.log(repeatStr(number, 3))      // "555555555"

解析：根據(jù)count循環(huán)的次數(shù)，在循環(huán)體內(nèi)復(fù)制，return 返回+=后的值

九、查找字符串的A內(nèi)容替換成B內(nèi)容

let str="abacdasdfsd" function replaceAll(str,AFindText,ARepText){ raRegExp = new RegExp(AFindText,"g"); return str.replace(raRegExp,ARepText); } console.log(replaceAll(str,"a","x")) // xbxcdxsdfsd
str：需要編輯的字符串本身 AFindText:需要替換的內(nèi)容 ARepText:被替換成的內(nèi)容
解析：創(chuàng)建正則，匹配內(nèi)容，替換

十、檢測(cè)常用格式，郵箱，手機(jī)號(hào)，名字，大寫(xiě)，小寫(xiě),在表單驗(yàn)證時(shí)，我們經(jīng)常會(huì)需要去驗(yàn)證一些內(nèi)容，舉例幾個(gè)常用的驗(yàn)證。

function checkType (str, type) {     switch (type) {         case 'email':             return /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(str);         case 'phone':             return /^1[3 4 5 7 8][0-9]{9}$/.test(str);         case 'tel':             return /^(0\d{2,3}-\d{7,8})(-\d{1,4})?$/.test(str);         case 'number':             return /^[0-9]$/.test(str);         case 'english':             return /^[a-zA-Z]+$/.test(str);         case 'chinese':             return /^[\u4E00-\u9FA5]+$/.test(str);         case 'lower':             return /^[a-z]+$/.test(str);         case 'upper':             return /^[A-Z]+$/.test(str);         default :             return true;     } } console.log(checkType ('hjkhjhT','lower'))   //false

解析：

checkType ('hjkhjhT','lower')'需要驗(yàn)證的字符串'，'匹配的格式' email：驗(yàn)證郵箱 phone：驗(yàn)證手機(jī)號(hào) tel：驗(yàn)證座機(jī)號(hào) number：驗(yàn)證數(shù)字 english：驗(yàn)證英文字母 chinese：驗(yàn)證中文字 lower：驗(yàn)證小寫(xiě) upper：驗(yàn)證大寫(xiě)

相信看了這些案例你已經(jīng)掌握了方法，更多精彩請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！

相關(guān)閱讀：

CSS的編碼怎么轉(zhuǎn)換

css3點(diǎn)擊顯示漣漪特效

怎樣用canvas實(shí)現(xiàn)小球和鼠標(biāo)的互動(dòng)

以上就是原生js的常用方法整理的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！