以下是個人總結，也有一些是copy大神的，現在放到一起，方便以后查閱（有不對的地方，還望大家能夠提出，我會盡快加以改正）。

一、!!強制轉布爾值boolean
根據當前需要判斷的值是真值還是假值來判斷，真值返回true，假肢返回false，那么這樣的話，除了假值，剩下的也都是真值了。

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

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

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

如上所說，假值返回false,真值返回true。

二、在str前添加一個?號,+str會強制轉Number
將字符串前加+，可以強制轉number,下面我們就一起來試試吧！

var str= 88 console.log(+str) // 88 //但是如果是混合類型的字符串，則會轉為NaN var b= 1606e console.log(+b) // NaN

三、不可靠的undefined 可靠的void 0
在JavaScript中，假設我們想判斷一個是否是 undefined，那么我們通常會這樣寫：

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

因為在javascript中，undefined是不可靠的
例如：
當undefined被放在在function函數內，我們把它當成一個局部變量，它是可以賦上值的，下面我們來試試。

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

但是當在函數內定義一個html' target='_blank'>全局變量，并不能給賦上值

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

那么我們試試用void 0或者 void (0)來代替：
先聲明一個變量a，賦值為undefined，接下來我們用void 0來判斷一下。

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

我們現在可以通過void 0 運算來獲得 undefined；那在以后需要判斷值為undefined的時候，可以直接用void 0或者void (0)，而且這兩個值的直接返回值就是undefined，所以說非常可靠哦！

四、字符串也是有length屬性的！
我們知道所有的Array都是有length屬性的，就算是空數組，那么length 為0，那么字符串有沒有呢？接下來我們來驗證一下。

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

結果是有的，所以我們在判斷類型時，不能單純拿有沒有length屬性來判斷是不是數組了，我們可以用下面的方法來判斷是否是數組：

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

五、如何創建一個隨機數組，或者將已有的數組打亂？
在項目中有時候我們需要一個隨機打亂的數組，那么下面我們來實現以下：
先來創建一個數組：

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

接下來我們來打亂它：

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 });

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

第二個打亂的方法同樣是遵循sort的方法，將a,b傳進去 然后和隨機數做比較，關于比較的方法不太清楚。

六、去除前后、前、后 所有空格
這是專門為去除空格寫的一套方法，適用于各種情況，所有空格,前后空格，前空格，后空格。

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 

解析：
這個方法用的是正則的匹配格式,后面我會把正則單獨拿出來總結一個系列，敬請期待！！！

s ： 空格符，Tab,換頁符，換行符 S ： 非s的所有內容 /g : 全局匹配 ^ : 匹配在行首 $ : 匹配在行尾 + ： 重復次數 0 * ： 重復次數 =0 | : 或者

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

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

type： 1:首字母大寫 2：首頁母小寫 3：大小寫轉換 4：全部大寫 5：全部小寫

原始字符串：

var str= sdfwwerasfddffddeerAasdgFegqer function changeCase(str,type) { //這個函數是第三個大小寫轉換的方法 function ToggleCase(str) { var itemText = str.split( ).forEach( function (item) { // 判斷循環字符串中每個字符是否以a-z之間開頭的并且重復大于0次 if (/^([a-z]+)/.test(item)) { // 如果是小寫，轉換成大寫 itemText += item.toUpperCase(); } // 判斷循環字符串中每個字符是否以A-Z之間開頭的并且重復大于0次 else if (/^([A-Z]+)/.test(item)) { // 如果是大寫，轉換成小寫 itemText += item.toLowerCase(); } else{ // 如果都不符合，返回其本身 itemText += item; } }); return itemText; } //下面主要根據傳入的type值來匹配各個場景 switch (type) { //當匹配 case 1: return str.replace(/^(w)(w+)/, function (v, v1, v2) { //v=驗證本身 v1=s ; v2=dfwwerasfddffddeerAasdgFegqer return v1.toUpperCase() + v2.toLowerCase(); }); case 2: return str.replace(/^(w)(w+)/, function (v, v1, v2) { //v=驗證本身 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：用于把一個字符串分割成字符串數組 w: 數字0-9或字母a-z及A-Z,或下劃線 W: 非w，除以上的特殊符號等 toUpperCase：轉大寫 toLowerCase：轉小寫 replace第二個參數可以是函數，函數的參數中，第一個是本身，第二個是正則匹配內容，第三個匹配剩下的內容

下面我們就通過小實驗來驗證一下：
網上有說replace是可以有4個參數的，但是我并沒有驗證到第四個代表的意義，前三個已經驗證，第一個參數為驗證本身，第二個正則匹配結果，第三為第二個匹配完剩下的值。

八、循環n次傳入的字符串
str為傳入隨意字符串，count為循環的次數

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

解析：根據count循環的次數，在循環體內復制，return 返回+=后的值

九、查找字符串的A內容替換成B內容

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:需要替換的內容 ARepText:被替換成的內容
解析：創建正則，匹配內容，替換

十、檢測常用格式，郵箱，手機號，名字，大寫，小寫,在表單驗證時，我們經常會需要去驗證一些內容，舉例幾個常用的驗證。

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 /^(0d{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 ) 需要驗證的字符串 ， 匹配的格式 email：驗證郵箱 phone：驗證手機號 tel：驗證座機號 number：驗證數字 english：驗證英文字母 chinese：驗證中文字 lower：驗證小寫 upper：驗證大寫
 

相信看了這些案例你已經掌握了方法，更多精彩請關注php 其它相關文章！

相關閱讀：

CSS的編碼怎么轉換

css3點擊顯示漣漪特效

怎樣用canvas實現小球和鼠標的互動

以上就是原生js的常用方法整理的詳細內容，html教程

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。