10-第十章 字符串方法和數組

String即文本(字符串),字符串方法都不改原字符串;

創(chuàng)建 字符串 的三種辦法: new String(), String(), 直接量,三種方式創(chuàng)建出來可以創(chuàng)建

去掉字符串的前后空格

trim()方法會刪除一個字符串兩端的空白字符。
不兼容IE8及其以下

          str.trim();

直接寫值的 字面量形式定義的字面量

var str = new String('hello');
var str = String('hello');
var str = 'hello'; 直接量

  • 數字沒有length

1、string.length 屬性可以返回字符串長度

2、string[index] 通過下標獲取字符串,不兼容IE 7 及其以下

        let a = "sadasdasd4564465as";
        console.log(a[5]);

3、str.charAt(index ) 返回指定索引的字符串 只能讀取值 不能修改值 兼容IE

        let a = "sadasdasd4564465as";
        console.log(a.charAt(5));

一、String方法

var  str = 'hello';
str.length 

字符串中字符長度(個數)漢字也占一個字符

1、字符串拼接

1、用于把一個或多個字符串連接 到一塊,返回拼接好的字符串
        str.concat( str,str...) 
        let a = "123";
        let b = "456";
        console.log(a.concat(b));
2、從左往右查找字符串,返回查找字符串首次出現的位置 ,第二個參數是開始查找的位置,方法對大小寫敏感!

value 匹配字符
index 開始檢索的位置, 合法值是 0 到 string.length - 1, 默認 0
匹配失敗返回 -1

        str.indexOf(value,index )
        let a = "sadasdas";
        console.log(a.indexOf("a",5));
3、從后向前搜索,合法值是 0 到 string.length - 1,默認 string.length - 1 ,匹配失敗返回 -1
        str.lastIndexOf(value,index) 
        let a = "bacdaefag";
        console.log(a.lastIndexOf("a",3));
        //  輸出
4、返回指定索引的ASCII編碼

str.charCodeAt(index)String.fromCharCode(unic)是相反的

str.charCodeAt(index)

        let str = "casdasdsad";
        console.log(str.charCodeAt(5));    

返回指定ASCII編碼的字符串,從字符編碼創(chuàng)建一個字符串。一個或多個 ASCII編碼的 值

String.fromCharCode(unic,unic,unic )

        let str = "casdasdsad";
        console.log(String.fromCharCode(105));  
5、截取字符串,從start 開始,截止到end前,不包含end

如果沒有end則從num開始整個查找;
如果 startstop 大,那么該方法在提取子串之前會先交換這兩個
[) 倒過來切會自動把傳進來的序號從小到大排序,而slice不行

        `str.substring(start,end ) `
        `str.slice(start, end)`

包頭不包尾 可以理解為離開的是一個區(qū)間
截取字符串,從start開始,截止到end前,不包含end
substring用法一樣,從左往右截取
start / end可以為負值,負值時,倒著從最后數
startend任何時候都不會交換位置,能截取才有值,截取不到則無值

        `str.substr(strat, lendth);` 

從哪一位開始截取 只有一個參數時,從這個位置開始,以后的數據都截取下來

slice, substring, substr 這三個方法只有一個參數的時候都是從這個位置開始,截取到結束

        str.toLocaleUpperCase()  
        str.toLocaleLowerCase()

str.toUpperCase() 把字符串轉換為大寫。 Upper /'?p?/ 大寫
str.toLowerCase() 把字符串轉換為小寫。 lower /'l???/ 小寫

方法二 可用于字符串亦可以用正則(RegEXP)

以下方法 可以用正則(RegExp)代替字符串進行匹配,

1、str.match( )

str.match( value/RegExp )
查找指定的值,返回匹配的值。未找到返回 null .正則可以找一個或多個表達式

      var  str = 'hello world';
      str.match('o') // 字符串 
      var  str = 'hello world';
      str.match(/o/i) // 正則 
2、str.search( )

str.search( value/RegExp )
返回 檢索字符串首次出現的位置;未找到返回 -1

      var  str = 'hello world';
      str.search('o') // 字符串中字符長度(個數)   
3、str.replace( )

str.replace( value/RegExp,new )
用一些字符替換另一些字符, new 可以是字符串,也可以是函數

        var str = 'hello world';
        str.replace('o', '千尋') // 字符串中字符長度(個數)   
        var str = 'hello world';
        //字符串中字符長度(個數) 
        function fn() {
            return '帥氣';

        }
        var call = str.replace(/o/g, fn) // 字符串中字符長度(個數)       
        alert(call);
4、 字符串轉數組

str.split( ) 不會改變原字符串 /spl?t/ 分開,分割
str.split(value/RegExp,length-1)
方法用于把一個字符串分割成字符串數組, 返回分割后的數組

1.第二個參數是可選參數,是指定返回數組的長度,最大為 str.length - 1,不寫默認 str.length - 1

        var  str = 'hello world';
        str.split('o',str.length) // 字符串中字符長度(個數)   

二、Array() 數組

創(chuàng)建 數組 的三種辦法: new Array(), Array(), []三種方式創(chuàng)建出來都是一樣的

數組里面可以是任何數據,都是通過下標去取值,里面里面還是一個數組,那么再通過下標去取值

var arr = new Array();
var arr = Array();
var arr = []; 直接量

1、arr.length 可以訪問數組的長度

創(chuàng)建即指定數組長度 Array( length )及 new Array( length ),length 是 數字的時候,創(chuàng)建的并不是數組的項,而是數組的長度,項的內容為 undefined

            let arr = Array(2);
            console.log(arr[0]);    //  undefined
            let arr = Array(2);
            console.log(arr.length);    //  2
2、拼接數組只能用concat,+ 號無法使用
            /arr.concat( [arr1, arr2], [arr1, arr2] );   
3、通過數組索引,訪問值
            var arr = [1,2,3,4,5]
            arr[0];  //1
4、修改數組指定索引下的值
            var arr = [1,2,3,4,5]
            arr[2] = 8888;  //  此時數組的值為 [1, 2, 8888, 4, 5]
5、在數組后面添加項
            var arr = [1,2,3,4,5]
            arr[arr.length] = 8888;
            console.log(arr);  //  arr = [1, 2, 3, 4, 5, 8888];
6、查找項 檢索某一個值的存在
            arr.indexOf(value,index);   
7、返回的是一個全新的數組,不會去影響原來的數組 (切割) 跟字符串的方法一樣
            arr.slice() 
8、數組去重
            var arr = [1,2,3,4,5,6,5,4,3,2,1];
            var arr2 = [];
            //  i = 12
            for(var i = 0; i < arr.length; i++){
                if( arr2.indexOf( arr[i] ) == -1 ){
                    console.log(arr[i])
                    arr2.push(arr[i]);
                }
            }
            alert(arr2);

三、Array() 數組方法

1、在數組的第一位添加,不會覆蓋之前的第一位

arr.unshift( item1,item1,…. )
向數組的頭部添加一個或更多元素,并返回(新的長度)。

2、刪除在數組的第一位,不會覆蓋之前的第一位,會改變原數組

arr.shift()
刪除數組的第一個元素(返回刪除對象);

3、往一個數組最后面去增加數據,可以一次添加多個值 push /p??/ 增加

arr.push(value,value...)
向數組的尾部添加一個或更多元素,并返回(新的長度)。

4、不用傳任何參數進去,刪除的是數組的最后一個數據,輸出的是被刪除掉的值 pop /p?p/ 突然,取出

arr.pop( )
刪除數組的最后一個元素(返回刪除對象)。

splice /spla?s/ 拼接;接合

5、arr.splice(index,howmany,item1,…..,itemX) (刪除/添加) 元素,然后(只返回刪除對象)。

index 必需。整數,規(guī)定添加/刪除項目的索引,可以使用負數,如果是添加,原有元素會往高位移動。
howmany 必需。要刪除的項目數量。如果設置為 0,則不會刪除項目。
item1, ..., itemX可選。向數組添加的新項目。

6、首位添加 / 刪除

(1) 刪除數組的第一位 arr.splice(start, 刪除個數);
(2) 在數組的第一位之前添加 arr.splice(start, 刪除個數,添加的內容);

7、末位添加 / 刪除

(3) 在數組的最后添加 arr.splice(arr.length,刪除個數,添加的內容);
(4) 刪除數組的最后一位 arr.splice(arr.length -1, 刪除個數)

8、 arr.sort()排序 會修改原數組

sort 接受一個回調函數,回調函數有兩個形參,
return第一個形參 - 第二個形參 是升序。反之是 降序
sort 排字符串不需要傳參數,是按 unicode 編碼排序的

sort 方法本質上相減的是數字,當數組里面的子數據是一個數組的時候,會先把數組轉化為字符串,再把字符串轉化為數字。

1、當子數據結構為數組時,且數組里面有多項數據時,再轉化數字時就會失敗。

        let arr = [[1, 2], 2, [3, 2]];
        arr.sort((a, b) => a - b);  //  轉化數字失敗, '1,2' 轉化數字失敗
        console.log(arr);

2、當子數據結構為對象時,且對象里面有多項數據時,我們可以用對象下面的屬性互減,本質上還是使用數字相減。

        let arr = [
            {
                "abc": 3 
            },
            {
                "abc": 1 
            },
            {
                "abc": 2 
            }
        ];
        arr.sort((a, b) => a.abc - b.abc);

當一個函數被當做參數傳到另外一個函數里面去的時候,被傳進去的函數稱為回調函數

            let arr = [11, 22, 33, 44, 55, 2, 10, 78911];
            arr.sort( (a, b) = > a - b)
            a - b 會 從小到大排序
            b - a 會 從大到小排序
            console.log(arr);

如果return的值是一個 小于 0 ,那么 a 會被排列到 b 之前;
如果return的值是一個 等于 0 , a 和 b 的相對位置不變
如果return的值是一個 大于 0 , b 會被排列到 a 之前。

默認arr.sort() 以首字符編碼大小排序
數組length小于10以冒泡排序
冒泡排序下依次比較,
return >0 調換位置,=0不調換位置,<0 不調換位置
數組length大于10以二分排序

arr.reverse()反轉數組

reverse()
顛倒 數組中元素的順序
修改原數組

三、Array() 數組方法

!!!!以上方法不創(chuàng)建新的創(chuàng)建,而是--------------------------直接修改原有的數組,同時索引會變化

1、arr.concat() 數組拼接

arr.concat(arr1,arr2,…,arrN) : 數組拼接 連接兩個或更多的數組,(并返回拼接成的新數組)
該數組是通過把所有 arrX 參數添加到 arr 中生成的。
如果要進行 concat() 操作的參數是數組,那么添加的是數組中的元素,而不是數組 ——不修改原數組

  1. // 情況一,
  2.    var a = [1,2,3];
    
  3.    alert(a.concat(4,5));
    
  4. // 情況二,不會改變a1,而是生成一個新的數組!??!
  5.        var a1 = [1,2,3];
    
  6.        var a2 = [4,5,6];
    
  7.        alert(a1.concat(a2));
    
2、arr.slice()截取

arr.slice(start,end)方法從已有的數組中返回選定的元素。————————不修改原數組

3、數組轉字符串

arr.join()拼接成字符串 /d???n/ 連接,結合
不修改原數組,不傳參數默認切整個字符串

4、Array.isArray( ) 判斷是不是數組

Array.isArray( object ) 返回一個布爾值
不兼容IE8 及其以下

四、ECMAscript5 的遍歷數組方法

以下下方法都能實現遍歷,語法也都一樣,只是返回值不一樣
不修改原數組
array.xxxx( function(currentValue,index,arr ), thisValue )

參數 描述
currentValue——必須。當前元素的值
index ——–可選。當期元素的索引值
arr————可選。當期元素屬于的數組對象
thisValue ——可選。對象作為該執(zhí)行回調時使用,傳遞給函數,用作 "this" 的值。
如果省略了 thisValue ,”this” 的值為 “undefined”

function(currentValue, index,arr)必須。函數,數組中的每個元素都會執(zhí)行這個函數

1、forEach()

/i?t?/ 每個

就是一個 for 循環(huán),什么值都不返回,就是單純的迭代
arr.forEach()從頭至尾遍歷數組 無返回值

        let arr = [1,2,3,4];
        let news = arr.forEach( (items,index,arr) => console.log(items,index,arr) );

image.png
2、map() 返回值數組

arr.map() 返回一個數組,包含函數所有返回值 返回數組
map 對數組的每一項都調用一次回調函數, 返回一個全新的數組, 全新的每一項數據是回調的返回值。

3、filter() true數組

arr.filter() 返回值是一個return值為true或能轉化為true的值
返回數組
every() ,some() 是數組邏輯判定:返回 truefalse

會一層一層的過濾,如果 return true 就證明每個數都存在,返回新數組
不會對空數組進行檢測
filter() 不會改變原始數組

      var  arr = [1,2,3,4];
      var _new = arr.filter( function(x) {
            return x > 3 ;
      })
4、every() 返回值

arr.every()針對所有元素,即都為 true 則返回 true
some相對。some只要有一個通過就返回true,而every必須所有項目通過才會返回true
只要有一個沒通過就是false

var  arr = [1,2,3,4];
var _new = arr.every(function(x){ return x < 10;})   // true  都小于10
var _new = arr.every(function(x){ return x%2 == 0;}) //false 是不是都是偶數
5、some() 返回值

對數組的每一項調用一次回調,如果返回true 。some停止并返回true

var  arr = [1,2,3,4];
var _new = arr.some(function(x){ return x%2 === 0;})   // true  有偶數

五、數組方法

1、把一個 類數組 轉化為 數組

Array.from(obj);

2、查找匹配成功的第一個(不是數組) 返回值

find ()

3、跟 find 類型 ,不過不返回數據而是返回數據的序號

findIndex ()

4、該 includes()方法確定數組是否在其條目中包括特定值,返回truefalse

/?nk'lu?dz/ 包含
arr.includes

5、fill()方法用一個固定值填充一個數組中從起始索引到終止索引內的全部元素。不包括終止索引。

let arr = [];
Array(100).fill(9) Array(數組長度).fill(添加的值)
如果 start 是個負數, 則開始索引會被自動計算成為 length+start,
[1, 2, 3].fill(value, start, end); 包頭不包尾巴 左閉右開區(qū)間

6、判斷一個對象是不是數組

Array.isArray()
obj instanceof Array

7、數組的 reduce 用于累加,不會修改原數組

arr.reduce((a, b) => a + b, 0);
a 為上一次加的結果
b 為每一項數據
0 為初始值 a 的 初始值
reduce /r?'dju?s/ 減少

        let arr = [1, 2, 3, 4, 5];
        let a = arr.reduce((a, b) => a + b, 0);
        console.log(a); // 15
8、ES6 數組去重方法

new Set(target) 括號里面為判斷目標值, 不允許出現重復,
不修改原數組

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容