JS中常用的数组、字符串方法集合

蛰伏已久 蛰伏已久 2018-09-10

学的语言不少,语法也都很相似,最后的结果是对很多默认方法不熟悉,每次都要通过百度来解决,必须要加深记忆了

数组常用方法

创建数组:

直接创建

var arr=[1,2,3,4]
  
或者

var arr=[]
arr[0]='a'
arr[1]='b'
arr[2]='c'

通过构造函数new Array创建

var arr=new Array();
arr[0]='a'
arr[1]='b'
arr[2]='c'

或者

var arr=new Array(1,2,3,4,5)

通过扩展运算符

var arr=['a','b',...[1,2,3],'c']    //['a','b',1,2,3,'c']

常用方法

push(): 向数组尾部添加一个或多个元素,并返回添加新元素后的数组长度。注意,该方法会改变原数组。

var arr = [1,2,3];
console.log(arr);        //  [1, 2, 3]
var b = arr.push(4);  
console.log(b);          //  4   //表示当前数组长度
console.log(arr);        // [1, 2, 3, 4]

pop(): 删除数组的最后一个元素,并返回该元素。注意,该方法会改变原数组。

var arr = [1,2,3]; 
console.log(arr);                // [1,2,3]
console.log( arr.pop() );       // [3]  //返回删除的元素
console.log(arr);                // [1,2]

unshift():在数组的第一个位置添加元素,并返回添加新元素后的数组长度。注意,该方法会改变原数组。

 var arr = ['a', 'b', 'c'];
 arr.unshift('x');        // 4
 console.log(arr);        // ['x', 'a', 'b', 'c']

shift():删除数组的第一个元素,并返回该元素。注意,该方法会改变原数组。

var arr = ['a', 'b', 'c'];
arr.shift()          // 'a'
console.log(arr)     // ['b', 'c']

indexOf():返回指定元素在数组中出现的位置,如果没有出现则返回-1

 var arr = ['a', 'b', 'c'];
 arr.indexOf('b') // 1
 arr.indexOf('y') // -1

indexOf方法还可以接受第二个参数,表示搜索的开始位置。

['a', 'b', 'c'].indexOf('a', 1)     // -1

toString():返回数组的字符串形式。

 var arr = [1, 2, 3];
 arr.toString()     // "1,2,3"3 
 var arr = [1, 2, 3, [4, 5, 6]];
 arr.toString()     // "1,2,3,4,5,6"

join():以参数作为分隔符,将所有数组成员组成一个字符串返回。如果不提供参数,默认用逗号分隔。

var arr = [1, 2, 3, 4]; 
arr.join(' ')     // '1 2 3 4'4 
arr.join(' | ')     // "1 | 2 | 3 | 4"
arr.join()     // "1,2,3,4"

concat():用于多个数组的合并。它将新数组的成员,添加到原数组的尾部,然后返回一个新数组,原数组不变。

var arr = [1,2,3];
var b = arr.concat([4,5,6]);
console.log(b);        //[1,2,3,4,5,6]

reverse():用于颠倒数组中元素的顺序,返回改变后的数组。注意,该方法将改变原数组。

var arr = ['a', 'b', 'c'];
arr.reverse() // ["c", "b", "a"] 
console.log(arr) // ["c", "b", "a"]

slice():用于截取原数组的一部分,返回一个新数组,原数组不变。

slice(start,end)它的第一个参数为起始位置(从0开始),第二个参数为终止位置(但该位置的元素本身不包括在内)。如果省略第二个参数,则一直返回到原数组的最后一个成员。

var arr = ['a', 'b', 'c']; 
arr.slice(0)         // ["a", "b", "c"] 
arr.slice(1)         // ["b", "c"] 
arr.slice(1, 2)     // ["b"] 
arr.slice(2, 6)     // ["c"] 
arr.slice()           // ["a", "b", "c"]    无参数返回原数组
arr.slice(-2)          // ["b", "c"]    参数是负数,则表示倒数计算的位置
arr.slice(-2, -1)     // ["b"]

splice():删除原数组的一部分成员,并可以在被删除的位置添加入新的数组成员,返回值是被删除的元素。注意,该方法会改变原数组。

splice(start,delNum,addElement1,addElement2,...)第一个参数是删除的起始位置,第二个参数是被删除的元素个数。如果后面还有更多的参数,则表示这些就是要被插入数组的新元素。

var arr = ['a', 'b', 'c', 'd', 'e', 'f'];
arr.splice(4, 2)     // ["e", "f"]  从原数组4号位置,删除了两个数组成员 
console.log(arr)     // ["a", "b", "c", "d"]
var arr = ['a', 'b', 'c', 'd', 'e', 'f'];
arr.splice(4, 2, 1, 2)     // ["e", "f"]  原数组4号位置,删除了两个数组成员,又插入了两个新成员
console.log(arr)         // ["a", "b", "c", "d", 1, 2]
var arr = ['a', 'b', 'c', 'd', 'e', 'f'];
arr.splice(-4, 2)     // ["c", "d"]    起始位置如果是负数,就表示从倒数位置开始删除
var arr = [1, 1, 1];
arr.splice(1, 0, 2)     // []    如果只插入元素,第二个参数可以设为0
conlose.log(arr)     // [1, 2, 1, 1]
var arr = [1, 2, 3, 4];
arr.splice(2)     // [3, 4] 如果只有第一个参数,等同于将原数组在指定位置拆分成两个数组
console.log(arr)     // [1, 2]

sort():对数组成员进行排序,默认是按照字典顺序排序。排序后,原数组将被改变。

['d', 'c', 'b', 'a'].sort()  
// ['a', 'b', 'c', 'd'] 
[4, 3, 2, 1].sort() 
// [1, 2, 3, 4] 
[11, 101].sort() 
// [101, 11] 
[10111, 1101, 111].sort()
// [10111, 1101, 111]

上面代码的最后两个例子,需要特殊注意。sort方法不是按照大小排序,而是按照对应字符串的字典顺序排序。也就是说,数值会被先转成字符串,再按照字典顺序进行比较,所以101排在11的前面。

如果想让sort方法按照自定义方式排序,可以传入一个函数作为参数,表示按照自定义方法进行排序。该函数本身又接受两个参数,表示进行比较的两个元素。如果返回值大于0,表示第一个元素排在第二个元素后面;其他情况下,都是第一个元素排在第二个元素前面。

 var arr = [10111, 1101, 111]; 
 arr.sort(function (a, b) { 
   return a - b; 
 }) 
 // [111, 1101, 10111] 
 var arr1 = [ 
   { name: "张三", age: 30 }, 
   { name: "李四", age: 24 },
   { name: "王五", age: 28 }
]
arr1.sort(function (o1, o2) {
  return o1.age - o2.age; 
}) 
//[
//   { name: "李四", age: 24 },
//   { name: "王五", age: 28 },
//   { name: "张三", age: 30 }
// ]

map():对数组的所有成员依次调用一个函数,根据函数结果返回一个新数组。

var numbers = [1, 2, 3];
numbers.map(function (n) {
  return n + 1;
});
// [2, 3, 4]
numbers
// [1, 2, 3]

上面代码中,numbers数组的所有成员都加上1,组成一个新数组返回,原数组没有变化。

filter():参数是一个函数,所有数组成员依次执行该函数,返回结果为true的成员组成一个新数组返回。该方法不会改变原数组。

var arr = [1, 2, 3, 4, 5]
arr.filter(function (elem) {
  return (elem > 3);
}) 
// [4, 5]

字符串常用方法

length:返回字符串长度

var a='hello'
console.log(a.length)  //输出字符串长度,5

charAt :可返回指定位置的字符。

var a='hello'
console.log(a.charAt(0))   //h
var b="珊瑚学院"
console.log(b.charAt(0))   //珊

concat :用于连接两个或多个字符串,并返回新的字符串,原字符串不变。

var a='hello'
var b='world'

console.log(a.concat(b,'!'))   //helloworld!
console.log(a)                 //hello

indexOf :返回某子字符串在该字符串中第一次出现的位置,如果没有找到匹配的字符串则返回 -1。 该方法区分大小写

var a='hello world !'
var b='hello'

console.log(a.indexOf(b))     //0

//从字符串a第2个位置开始查找字符串b第一次出现的位置
console.log(a.indexOf(b,1))   //-1

lastIndexOf:返回一个指定的字符串值最后出现的位置,如果指定第二个参数 start,则在一个字符串中的指定位置从后向前搜索。

注意: 该方法将从后向前检索字符串,但返回是从起始位置 (0) 开始计算子字符串最后出现的位置。 
开始检索的位置在字符串的 start 处或字符串的结尾(没有指定 start 时)。 
如果没有找到匹配字符串则返回 -1。

var a='hello world hello world'
var b='world'

console.log(a.lastIndexOf(b))       //18
console.log(a.lastIndexOf(b,10))    //6
console.log(a.lastIndexOf(b,5))     //-1

match:在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。

备注:string.match(RegExp); 
规定要匹配的模式的 RegExp 对象。如果该参数不是 RegExp对象,则需要首先把它传递给 RegExp 构造函数,将其转换为 RegExp 对象。 
若RegExp对象有”g”标志,则说明是全局正则函数,将返回一个数组,其中存放了与它找到的匹配文本有关的信息。 
若没有”g”标志,只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本, match() 将返回 null。

var a='hello world 12 hello world 34'

console.log(a.match(/world/g))     //["world", "world"]
console.log(a.match(/\d+/g))       //["12", "34"]
console.log(a.match(/\d+?/g))      //["1", "2", "3", "4"] 正则非贪婪模式匹配

replace用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。

var a='hello world hello world'

console.log(a.replace(/hello/g,'hi'))   //hi world hi world

search:用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。 
返回值为数字,是与指定查找的字符串或者正则表达式相匹配的 String 对象起始位置。如果没有找到任何匹配的子串,则返回 -1。

var a='hello world 34 hello world 34'

console.log(a.search(/\d+/))   //12数字出现的位置

slice:slice(start, end) 方法可提取字符串的某个部分,并以新的字符串返回被提取的部分。 
使用 start(包含) 和 end(不包含) 参数来指定字符串提取的部分。字符串下标从0开始。 
提示:如果是负数,则该参数规定的是从字符串的尾部开始算起的位置。也就是说,-1 指字符串的最后一个字符,-2 指倒数第二个字符,以此类推。

var a='hello world'

console.log(a.slice())          //hello world
console.log(a.slice(6))         //world
console.log(a.slice(6,7))       //w
console.log(a.slice(-5))        //world
console.log(a.slice(-5,-4))     //w

split:用于把一个字符串分割成字符串数组。 string.split(seperator); //seperator作为字符串的分隔符 ,提示:该函数不改变原字符串。

var a='hello world'

console.log(a.split(" "))      //["hello", "world"]
console.log(a.split(""))       //["h", "e", "l", "l", "o", " ", "w", "o", "r", "l", "d"]
console.log(a.split("",3))     //["h", "e", "l"],只输出数组前3个

substr :可在字符串中抽取从 开始 下标开始的指定数目的字符。 提示: substr() 的参数指定的是子串的开始位置和长度,该函数不改变原字符串

var a='hello world'


console.log(a.substr(6))      //world
console.log(a.substr(6,5))    //world
console.log(a.substr(6,1))    //w

substring:用于提取字符串中介于两个指定下标之间的字符。substring() 和 slice()函数相似,但slice函数允许负数下标,表示从字符串尾部开始计算。

var a='hello world'


console.log(a.substring(6))    //world
console.log(a.substring(6,7))  //w
console.log(a.substring(-5))   //hello world,截取未生效

toUpperCase,toLowerCase:转换字符串大小写,不改变原字符串

var a='hello World'


console.log(a.toUpperCase())    //HELLO WORLD
console.log(a)                  //hello World
console.log(a.toLowerCase())    //hello world




分享到

点赞(0)