JS中数组和字符串常用方法

一、不改变原数组

join() 用某个分隔符把数组的每一项拼接起来

参数：指定的分隔符（如果省略该参数，则使用逗号作为分隔符）

返回值：拼接好的字符串

是否改变原数组：不改变

let arr = [1,2,3,4,5]
let newArr = arr.join('-')
console.log(newArr); // 1-2-3-4-5

concat() 把两个或多个数组里的元素拼接成一个新的数组

参数：参数可以是具体的值，也可以是数组对象。可以是任意多个

返回值：返回连接后的新数组

是否改变原数组：不改变

<!-- 例子一 -->
let arr1 = [1,2,3];
let arr2 = [4,5,6];
let arr = arr1.concat(arr2);//arr = [1,2,3,4,5,6];

<!-- 例子二 -->
let arr1 = ['你'];
let arr2 = ary1.concat('好');
console.log(arr2);//["你", "好"]

split() 指定字符串中的某个分隔符，将字符串分割成数组

let str = hello-world；
let arr = str.split('-');
console.log(arr);// arr=['hello','world'];

slice() 截取出数组中指定的项

参数：

array.slice(n, m)，从索引n开始查找到m处（不包含m） （包头不包尾）

array.slice(n) 第二个参数省略，则一直查找到末尾

array.slice()或array.slice(0) 原样输出内容，可以实现数组克隆

array.slice(-n,-m) slice支持负参数，从最后一项开始算起，-1为最后一项，-2为倒数第二项

注意：使用负数时，要保证截取的顺序从左到右，否则截取结果为空数组，并且不包含末尾项

返回值：返回一个新数组

let arr = [0,1,2,3,4,5,6,7,8,9]; 
let newArr = arr.slice(2,8);
console.log(newArr); //从索引2开始查找到索引为8的内容，结果为[2, 3, 4, 5, 6, 7, 8] 
let newArr2 = arr.slice(2)
console.log(newArr2); //从索引2开始查找,一直查找到末尾,结果为[2, 3, 4, 5, 6, 7, 8, 9]
let newArr3 = arr.slice()
console.log(newArr3) //克隆数组
let newArr4 = arr.slice(-2,-1)
console.log(newArr4);//从最后的索引开始找，找到倒数第二的索引项，结果为[8, 9]
//要保证截取的顺序从左到右，否则截取结果为空数组，并且不包含末尾项

indexOf() 检测当前值在数组中第一次出现的位置索引

参数：array.indexOf(item,start) item:查找的元素 start:字符串中开始检索的位置(可选)

返回值：第一次查到的索引，未找到返回-1

是否改变原数组：不改变

let arr = ['a','b','c','d','e','a','f'];   
console.log(arr.indexOf('c'));//2
console.log(arr.indexOf('a',3))//5
console.log(arr.indexOf('x'));//-1

lastIndexOf() 检测当前值在数组中最后一次出现的位置索引

参数：array.lastIndexOf(item,start) item:查找的元素 start:字符串中开始检索的位置

返回值：第一次查到的索引，未找到返回-1

是否改变原数组：不改变

let arr = ['a','b','c','d','e','a','f'];   
console.log(arr.lastIndexOf('c'));//2
console.log(arr.lastIndexOf('f',1))//-1

find() 找到符合条件的项,并且返回符合条件的第一项

let arr = [
  { id: 3, name: "ls", done: false },
  { id: 1, name: "zs", done: true },
  { id: 2, name: "ww", done: true }
];
 var res = arr.find(function(item) {
   return item.id === 2;
});
console.log(res);   //{id: 2, name: 'ww', done: true}

findIndex() 找到符合条件的项的下标,并且返回第一个

let arr = [
  { id: 3, name: "ls", done: false },
  { id: 1, name: "zs", done: true },
  { id: 2, name: "ww", done: true }
];
var res = arr.findIndex(function(item) {
  return item.done;
});
console.log(res);

includes() 判断一个数组是否包含一个指定的值

参数：指定的内容

返回值：布尔值，true 或 false

是否改变原数组：不改变

let arr = ['a','b','c','d']; 
console.log(arr.includes('c'));//true
console.log(arr.includes(2));//false

forEach() 遍历数组

参数：函数 arr.forEach(function(item,index,currentArray){}) item:每一项 index:索引 currentArray:当前数组

返回值：无

是否改变原数组：不改变

forEach中不能使用continue和break，forEach中不能跳出，只能跳过(return跳过)
let arr = ['a','b','c','d']; 
arr.forEach(function(item,index,currentArray){
console.log(item,index,currentArray);
})

map() 用于改造数组

参数：函数 arr.map(function(item,index,currentArray){}) item:每一项 index:索引 currentArray:当前数组

返回值：返回一个新数组

是否改变原数组：改变

let arr = [1,32,54,6,5];
let newArr = arr.map(function(item,index,currentArray){
    return item*2;
})
console.log(newArr);   //[2,64,108,12,10]

filter() 过滤

参数：函数 arr.filter(function(item,index){}) item:每一项 index:索引

返回值：符合条件的元素的数组（过滤出布尔类型为true的项）

是否改变原数组：不改变

let arr = [1, 3, 5, 2, 4, 6];
let newArr = arr.filter(function(item, index) {
  return item % 2 === 0;
});
console.log(newArr);   //[2,4,6]

some() 判断数组中有没有符合条件的项(只要有一个,就返回true,否则返回false)

let arr = [
  { name: "zs", age: 18, done: "ok" },
  { name: "ls", age: 20, done: true },
  { name: "ww", age: 22, done: true }
];
let res = arr.some(function(item) {
  return item.done;
});
console.log(res);   //true

every() 判断数组中所有的项是否满足要求(如果全都满足,返回true,否则返回false)

let arr = [
  { name: "zs", age: 18, done: "ok" },
  { name: "ls", age: 20, done: true },
  { name: "ww", age: 22, done: true }
];
let res = arr.every(function(item) {
  return item.done;
});
console.log(res);   //true

reduce()

// let newArr = arr.reduce(function(叠加后的数据,数组中的项){
//    叠加后的数据 + 数组中的项;
// }, 从几开始累加)
let arr = [10,20,30]
let newArr = arr.reduce((sum,item) => sum+item, 0)
console.log(newArr)   //60
    var arr2 = [[1,2,3],[4,5],[6,7]] ;
    var new2 = arr2.reduce(function(pre,next,index){
            return pre.concat(next);    //前数组拼接后数组 .concat()
    })
     console.log(new2);
    var arr3 = [
    {price:10,count:1},
    {price:15,count:2},
    {price:10,count:3}
    ];
    var new3 = arr3.reduce(function(pre,next,index){
            return pre+next.price*next.count;
    },0)    //在原数组第一项添加为0，不改变原数组，则可不操作第一项
    console.log(new3);

二、改变原数组

splice() 对数组进行增删改

删除：arr.splice(n,m) 从索引n开始，删除m个内容，返回删除的新数组，原有数组改变

（注意：如果第二个参数省略，则从n删除到末尾）

增加：arr.splice(n,0,m)从索引n开始删除0项，把m或者更多的内容插入到索引n的前面，返回空数组

替换：arr.splice(n,m,x) 从n下标开始,删除m个,x替换删除的部分

//删除
let arr = [0,1,2,3,4,5];
//console.log(arr.splice(3,2))//[0, 1, 2, 5]
console.log(arr.splice(3));//[0, 1, 2]
//增加
let arr2 = [0,1,2,3,4,5];
arr2.splice(2,0,'a','b')
console.log(arr2);// [0, 1, "a", "b", 2, 3, 4, 5]
//修改
let arr3 = [0,1,2,3,4,5];
arr3.splice(1,2,'x','y')
console.log(arr3);// [0, 'x', 'y', 3, 4, 5]

push() 向数组的末尾添加新内容 (添加返回数组长度，删除返回删除项)

参数：要添加的项。传递多个用逗号隔开，任何数据类型都可以

返回值：新增后数组的长度

是否改变原数组：改变

let arr = [1,2,3];
arr.push(100); //返回一个新的长度,arr.length=4
console.log(arr)//结果为 [1,2,3,100]

unshift() 向数组首位添加新内容

参数：要添加的项，多项用','隔开

返回值：新数组的长度

是否改变原数组：改变

let arr = [1,2,3];
arr.unshift(100); //返回一个新的长度,arr.length=4
console.log(arr)//结果为 [100,1,2,3]

pop() 删除数组的最后一项

参数：无

返回值：被删除的项

是否改变原数组：改变

let arr = [1,2,3];
arr.pop(); //返回被删除的项, 3
console.log(arr)//结果为 [1,2]

shift() 删除数组的第一项

参数：无

返回值：被删除的项

是否改变原数组：改变

let arr = [1,2,3];
arr.shift(); //返回被删除的项, 1
console.log(arr)//结果为 [2, 3]

reverse() 翻转数组

参数：无

返回值：倒序后的新数组

是否改变原数组：改变

let arr = [6,8,10,12]; 
console.log(arr.reverse());//[12, 10, 8, 6]

sort() 数组排序

对数组的元素进行排序（默认是从小到大来排序 并且是根据字符串来排序的）

参数：可选(函数) 规定排序规则，默认排序顺序为按字母升序

返回值：排序后的新数组

是否改变原数组：改变

let arr = [32,44,23,54,90,12,9]; 
arr.sort(function(a,b){        
// return a-b;  // 结果[9, 12, 23, 32, 44, 54, 90]
// return b-a;  // 结果[90, 54, 44, 32, 23, 12, 9]   
})  
console.log(arr);

数组去重

let arr = ['a','b','c','a'];
// set 用于数组去重，成员是唯一的，不可以重复
let  newArr = [...new Set(arr)];
console.log(newArr);   // ['a', 'b', 'c']
let arr = ['a','b','c','a'];
let newArr = Array.from(new Set(arr));
console.log(newArr); // ['a', 'b', 'c']
let arr = ['a','b','c','a'];
let newArr = [];
for(var i = 0; i < arr.length; i++) {
    // indexOf()方法返回在数组中找到给定元素的第一个索引，若不存在，返回 -1
    // 判断是否在newArr数组中存在  1是存在，-1是不存在
    if(newArr.indexOf(arr[i]) == -1) {
      // push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。
      // 如果不存在，就追加到newArr里
        newArr.push(arr[i]);
    }
}
console.log(newArr)   // ['a', 'b', 'c']
let arr = ['a','b','c','a'];
let newArr = [];
arr.forEach(item => {
    // item 代表arr数组里的每一项
    if(newArr.indexOf(item) == -1)
    newArr.push(item);
})
cosnole.log(newArr);  // ['a', 'b', 'c']
let arr = ['a','b','c','a'];
let newArr = [];
arr.forEach(item => {
    // includes()方法用于判断字符串是否包含指定的子字符串，有则返回true，无则返回false；includes() 方法区分大小写。
    if(!newArr.includes(item))
    newArr.push(item);
})
console.log(newArr);  // ['a', 'b', 'c']

三、字符串方法

所有字符串方法都会返回新字符串。它们不会修改原始字符串;

字符串是不可变的：字符串不能更改，只能替换

length()

作用：获取字符串长度

参数：无

返回：返回字符串长度

let str = 'hello';0
console.log(str.length())    //5

concat()

作用：用于将一个或多个字符串拼接起来

参数：可以有多个，用来拼接到str上的字符串

返回：返回拼接后的新字符串

let str = 'hello';
console.log(str.concat(' ' , 'world')) //'hello world'

slice()

作用：此方法用来提取一个字符串

参数：

1.beginIndex，表示从该索引处开始提取字符串的字符(包括)，如果为负数则从后开始计算;

2.endIndex，表示从该索引处结束提取字符串(不包括)，如果省略则一直提取到字符串末尾，如果为负数从后开始计算

返回：返回一个新的字符串

let str = 'hello world';
console.log(str.slice(6)) //'world'
console.log(str.slice(-5,-3)) //'wo'

substr(开始下标, 截取长度)

作用：截取字符串

参数：1.开始下标;2.截取长度

返回：截取出来的字符串（包括下标那个字符）

let str = "Hello world！";
let res = str.substr(6,5);
console.log(res)   // world

substring(开始下标, 结束下标)

作用：此方法和slice方法功能相同都是提取一个字符串

参数：1.开始下标（包括）；2.结束下标（不包括）

上述两个参数：如果为负数或者NaN则都会被当做0，

如果大于字符串的长度则会被当做字符串的长度来计算，

如果 startIndex 大于 endIndex，则 substring 的执行效果就像两个参数调换了一样

返回：提取到的字符串

let str = 'hello world';
console.log(str.substring(-1,5))  //'hello'
console.log(str.substring(5,-1))  //'hello'

trim()

作用：删除一个字符串两端的空白字符

参数：无

返回：删除后的新字符串,不会改变原有字符串

toLowerCase()

作用：字符串值转为小写形式

参数：无

返回：转换后的字符串

toUpperCase()

作用：字符串值转为大写形式

参数：无

返回：转换后的字符串

replace(被替换部分, 新内容)

作用：可以将一个替换值替换字符串的一部分 (对大小写敏感)

参数：（二选一）

1.一个字符串中要被替换的子字符串或者正则表达式，默认值替换第一个，可以在正则表达式中设置全局模式，来替换所有匹配的子字符串；

2.一个替换值

返回：转换后的字符串

let str = "Hello world!";
let n = str.replace("world", "js");
console.log(n)   //Hello js!

let str = "Hello world!";
let m = str.replace(/WORLD/i, "js");   //注意正则表达式不带引号
console.log(m)   //Hello js!

split()

作用：可以使用一个指定的分隔符来将字符串拆分成数组

参数：

1.分隔符，可以为一个字符串也可以为正则表达式，为空的话则将每个字符都拆分。默认全局拆分;

2.拆分的长度（可选），为一个整数用来限制拆分的个数，如果超过了这个数量则新数组中不返回剩下的文本

返回：返回一个数组

//可以指定保留数组中几个元素：字符串.split(分隔符, 保留的个数)
let str = 'hello world';
console.log(str.split(" ")) //["hello", "world"]

charAt()

作用：从一个字符串中返回指定的字符

参数：index，介于0~length-1之间的整数，默认为0

返回：指定的字符

let str = 'hello world';
console.log(str.charAt(1)) //'e'

charCodeAt(下标)

作用：通过下标获取到对应字符的10进制的阿斯克码

参数：下标

返回：-

fromCharCode(阿斯克码)

作用：判断字符串中是否包含指定字符，包含则返回true，不包含则返回false

参数：ASCII码

返回：返回阿斯克码对应的字符

includes()

作用：判断字符串中是否包含指定字符，包含则返回true，不包含则返回false

参数：指定的字符串

返回：-

let str = 'hello world';
console.log(str.includes('hello')) //true
console.log(str.includes('fire')) //flase

indexOf()

作用：返回字符串中指定字符首次出现的下标，如果找不到则返回-1

参数：1.字符；2.开始下标（可选）

返回：-

let str = 'hello world, hello world';
console.log(str.indexOf('world')) //6
console.log(str.indexOf('sumshine')) //-1

lastIndexOf()

作用：用法和indexOf基本相同，区别是lastIndexOf()是从后往前查找

参数：1.字符；2.开始下标（可选）

返回：-

let str = 'hello sumshine, hello sumshine';
console.log(str.lastIndexOf('sumshine')) //22
console.log(str.lastIndexOf('world')) //-1

search()

作用：搜索特定值的字符串，并返回第一次匹配的下标，没有找到则返回-1;

参数：（二选一）

1.字符；

2.一个正则表达式，如果传入一个非正则表达式则会隐式的将其转换为正则表达式对象

返回：-

let str = 'hello world';
console.log(str.search('world')) //6
console.log(str.search(/w/)) //6

match(regexp)

作用：返回一个字符串匹配正则表达式的结果,如果未设置全局匹配，则会返回第一个完整匹配及其相关的捕获组，捕获组中包含有groups、index、input等属性

参数：一个正则表达式，如果传入一个非正则表达式则会隐式的将其转换为正则表达式对象

返回：-

//match(regexp) //select integers only
    let intRegex = /[0-9 -()+]+$/; 
    let myNumber = '999';
    let myInt = myNumber.match(intRegex);
    console.log(isInt);
    //output: 999
     
    let myString = '999 JS Coders';
    let myInt = myString.match(intRegex);
    console.log(isInt);
    //output: null

startsWith()

作用：函数检查字符串是否以指定的字符串或字符开始

参数：指定的字符串

返回：布尔值

let mystr = "List of javascript functions";
let n = mystr.startsWith("List");   //output: True

endsWith()

作用：函数检查字符串是否以指定的字符串或字符结束

参数：指定的字符串

返回：布尔值

let mystr = "List of javascript functions";
let n = mystr.endsWith("functions");   //output: True

repeat()

作用：构造并返回一个新字符串，该字符串包含被连接在一起的指定数量的字符串的副本

参数：数值

返回：-

let string = "Welcome to Edureka";
string.repeat(2);   //output: Welcome to Edureka Welcome to Edureka

valueOf()

作用：方法返回一个String对象的原始值（primitive value），该值等同于String.prototype.toString()

参数：-

返回：-

let mystr = "Hello World!";
let res = mystr.valueOf();   //output: Hello World!

padStart()

作用：从字符串的开头用另一个字符串填充一个字符串到一定长度

参数：1.填充后的字符串的长度；2.要填充的内容

返回：返回一个达到一定长度的结果字符串

例子1：
let str = '1234'.padStart(8,'0');
console.log(str); // "00001234"

例子2：第二个参数不传，就默认使用空格符填充
let str = 'abc'.padStart(5);
console.log(str); // "  abc"

例子3：结果字符串的长度必须为 5，因此，填充字符串被截断 ("f")，仅填充其最左边的部分 ("de")
str = "abc".padStart(5, "def");
console.log(str); // "deabc"

padEnd()

作用：从字符串的结尾用另一个字符串填充一个字符串到一定长度

参数：1.填充后的字符串的长度；2.要填充的内容

返回：返回一个达到一定长度的结果字符串

例子1：
str = 'abc'.padEnd(5,'*');
console.log(str); // "abc**"

例子2：第二个参数不传，就默认使用空格符填充
let str = 'abc'.padEnd(5);
console.log(str); // "abc  "

例子3：结果字符串的长度必须为 5，因此，填充字符串被截断 ("f")，仅填充其最左边的部分 ("de")
str = 'abc'.padEnd(5,'def');
console.log(str); // "abcde"