JS字符串、数组 常用方法

字符串

字符串 增：

1、+拼接

2、concat()

例：let a = 'hello'   

let b = a.concat('word')   

console.log(b)  // "hello world"

 

字符串 删：

1、slice(star，end)   从原始字符串中提取一个子字符串，并返回一个新的字符串，而不改变原字符串。

star（必需）：起始位置。如果是正数，则从零开始计算索引；如果是负数，则表示从字符串结尾开始计算的字符位置，-1 表示最后一个字符的位置。

end（可选）：结束位置，但不包括该位置的字符。和 start 参数一样，它也可以是正数或负数。如果省略了end，则会提取从 start 位置直到字符串末尾的所有字符。

let str = "Hello, world!"
console.log(str.slice(7, 12)) // "world"
console.log(str.slice(-5)) // "world!"
console.log(str.slice(7)) // "world!"

 

字符串 改：

1、replace()   替换字符，接收两个参数，第一个为匹配的内容，第二个为替换的元素，替换第一次出现的字符

let text = "cat, bat, sat, fat"
let result = text.replace("at", "ond")
console.log(result)   // "cond, bat, sat, fat"

2、trim()   删除左右两侧所有空白字符、返回新字符串

let a = "   hello world   "
let b = a.trim()
console.log(a) // "   hello world   "
console.log(b) // "hello world"

3、toLowerCase()   toUpperCase()   大小写转换，返回一个新的字符串

let a = "hello"

console.log(a)   // "hello"
console.log(a.toUpperCase())   // "HELLO"
console.log(a.toLowerCase())   // "hello"

 

字符串 查：

1、charAt(index)   返回索引位置的字符

let message = "abcde"
console.log(message.charAt(2))   // "c

2、indexOf(char)   从字符串开头去搜索传入的字符串，并返回位置（没有返回-1）

let char = "hello world"
console.log(char.indexOf("o"))   // 4

3、startWith()   判断一个字符串是否以指定的子字符串开头

includes()   判断一个字符串是否包含指定子字符串

let a = "foobarbaz"
console.log(a.startsWith("foo"))   // true
console.log(a.startsWith("bar"))   // false
console.log(a.includes("bar"))   // true

 

字符串 其他：

1、split()   把 字符串 按照指定 分隔符 转换成 数组，返回新数组

let str = "12+23+34"
let arr = str.split("+") // [12, 23, 34]

 

数组

数组 增：

1、push()   接收任意数量参数，数组末尾添加，返回数组长度

2、unshift()   接收任意数量参数，数组开头添加，返回数组长度

3、splice()   指定位置添加，接收三个参数，分别是：开始位置、0（删除元素数量）、插入的元素，返回空数组

注意：数组的删、改 也有该方法

let colors = ["red", "green", "blue"]
let removed = colors.splice(1, 0, "yellow", "orange")
console.log(colors)   // red,yellow,orange,green,blue
console.log(removed) // [ ]

 

数组 删：

1、pop()   删除数组最后一项，返回删除项

2、shift()   删除数组第一项，返回删除项

3、splice()   指定位置删除，传入两个参数，分别是：开始位置、删除元素数量，返回删除元素的数组

注意：数组的增、改 也有该方法

let colors = ["red", "green", "blue"]
let removed = colors.splice(0,1)   // 删除第一项
console.log(colors)   // green,blue
console.log(removed)   // red

 

数组 改：

1、splice()   接收三个参数，分别是：开始位置、删除元素数量、插入的任意个元素，返回删除元素的数组，对原数组产生影响

注意：数组的增、删 也有该方法

let colors = ["red", "green", "blue"]
let removed = colors.splice(1, 1, "red", "purple")   // 插入两个值，删除一个值
console.log(colors)   // red,red,purple,blue
console.log(removed)   // green

 

数组 查：

1、indexOf(char)   返回要查找的元素的位置，没有返回-1

2、includes()   查找数组是否包含该元素，找到返回true，否则false

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]
numbers.includes(4)   // true

3、find()   返回第一个匹配的元素

const people = [
   { name: "Matt", age: 27 },
   { name: "Nicholas", age: 29 }
]
people.find((element) => element.age < 28) // // { name: "Matt", age: 27 }

数组 其他：

1、reverse()   将数组元素方向反转，会直接修改原数组，返回反转后的数组

let numbers = [1, 2, 3, 4, 5];
numbers.reverse()
console.log(numbers)   // [5, 4, 3, 2, 1]

2、sort()   对数组的元素进行排序

let arr = [4, 2, 5, 1, 3]
2.1 升序排列

arr.sort((a, b) => return a - b)

console.log(arr)   // [1, 2, 3, 4, 5]

2.2 降序排列

arr.sort((a, b) => return b - a)

console.log(arr)   // [5, 4, 3, 2, 1]

3、join()   将数组 按照分隔符 转换成 字符串

let colors = ["red", "green", "blue"];
alert(colors.join(","))   // red,green,blue
alert(colors.join("||"))   // red||green||blue

 

数组 进阶（迭代方法）：

1、some()   检查数组中的元素是否满足指定条件，至少有一个元素返回true，则这个方法返回true

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]
let someResult = numbers.some((item, index, array) => item > 2)
console.log(someResult)   // true

2、every()   检查数组中的元素是否满足指定条件，所有元素返回true，则这个方法返回true

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]
let everyResult = numbers.every((item, index, array) => item > 2);
console.log(everyResult) // false

3、forEach()   遍历数组，没有返回值

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]
numbers.forEach((item, index, array) => { ... })

4、filter()   过滤数组，返回新数组，返回的是满足条件的数组元素

let numbers = [1, 2, 3, 4, 5, 4, 3, 2, 1]
let filterResult = numbers.filter((item, index, array) => item > 2)
console.log(filterResult)   // [3,4,5,4,3]

5、map()   迭代数组，返回新数组，返回的是处理后的数组元素

const arr = ['red', 'blue', 'green']

const newArr = arr.map((el, index) => {

   console.log(el)   // 数组元素

   console.log(index)   // 数组索引

   return el + '颜色'

})

console.log(newArr)   // ['red颜色', 'blue颜色', 'green颜色']

6、reduce()   累计处理结果，经常用于求和，返回处理后的值

const arr = [1, 5, 8]

const total = arr.reduce((prev, current) => {

   return prev + current

}, 0)

console.log(total)   // 14

----------------------------------------------------------------

----------------------------------------------------------------