Array的扩展方法
扩展运算符可以将数组或者对象转为用逗号分隔的参数序列
let arr = [1,2,3] console.log( ...arr ) console.log( 1,2,3 )
1 2 3 1 2 3
在console.log()中可以输出多个变量,但是要使用逗号进行分隔,由于对数组扩展后个元素之间使用逗号分隔,所以输出为1 2 3
。
可以使用扩展运算符进行数组的合并
方法1:
let arr1 = [1,2,3] let arr2 = [4,5,6] let arr3 = [...arr1,...arr2] console.log(arr3)
[ 1, 2, 3, 4, 5, 6 ]
方法2:
let arr1 = [1,2,3] let arr2 = [4,5,6] arr1.push( ...arr2 ) console.log(arr1)
[ 1, 2, 3, 4, 5, 6
使用Array.from()
方法可以使伪数组转为真正的数组
let arrLike = { '0': 'a', '1': 'b', '2': 'c', length: 3 } let arr = Array.from( arrLike ) console.log(arrLike) console.log(arr)
{ '0': 'a', '1': 'b', '2': 'c', length: 3 } [ 'a', 'b', 'c' ]
此方法还可以传入第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组。
let arrLike = { '0': '2', '1': '4', '2': '8', length: 3 } let arr = Array.from( arrLike, item => item*2 ) console.log(arrLike) console.log(arr)
{ '0': '2', '1': '4', '2': '8', length: 3 } [ 4, 8, 16 ]
find()
方法
用于找出第一个 符合条件的数组成员,如果没有找到返回undefined
let arr = [ { id: 1, name: 'zs' }, { id: 2, name: 'ls' } ] //index下标没有用上,可以省略 let target = arr.find( ( item, index ) => item.id == 2 ) console.log( target )
{ id: 2, name: 'ls' }
findIndex()
方法
用于找出第一个符合条件的数组成员的位置,如果没有找到返回-1
let arr = [ { id: 1, name: 'zs' }, { id: 2, name: 'ls' } ] let index = arr.findIndex( item => item.id == 2 ) console.log( index )
1
includes()
方法
表示某个数组是否包含给定的值,返回布尔值
let arr = [1,2,3] console.log(arr.includes(2)) console.log(arr.includes(5))
true false
String的扩展方法
模板字符串
模板字符串可以解析变量
模板字符串使用反引号,即
`模板字符串`
let name = 'zs' let say = `hello, my name is ${name}` console.log(say)
hello, my name is zs
模板字符串中可以换行
let s = ` 123 123 123 123 ` console.log(s)
123 123 123 123
模板字符串可以调用函数
let fn = () => { return '123123' } let s = `456456 ${fn()}` console.log(s)
456456 123123
startsWith()
和endsWith()
startsWith():表示参数字符串是否在原字符串的开头,返回布尔值
endsWith():表示参数字符串是否在原字符串的尾部,返回布尔值
let s = 'HELLO JAVASCRIPT' console.log( s.startsWith('HELLO') ) console.log( s.endsWith( 'T' ) ) console.log( s.endsWith( 's' ) )
true true false
repeat()
repeat()方法表示将原字符串重复n次,返回一个新字符串
let s = 'HELLO JAVASCRIPT\n' let newS = s.repeat(3) console.log( newS )
HELLO JAVASCRIPT HELLO JAVASCRIPT HELLO JAVASCRIPT
Set数据结构
ES6提供了新的数据结构Set,类似于数组,但是成员的值都是唯一的,没有重复的值
Set本身是一个构造函数,用来生成Set数据结构
const s = new Set()
Set函数可以接受一个数组作为参数,用来初始化
const set = new Set( [1,1,1,2,2,2,3,3,3,4,5,6] ) console.log(set)
Set(6) { 1, 2, 3, 4, 5, 6 }
Set数据结构的实例方法
add(value):添加某个值,返回Set结构本身
delete(value):删除某个值,返回一个布尔值,表示删除是否成功
has(value):返回一个布尔值,表示该值是否为Set的成员
clear():清除所有成员,没有返回值
let set = new Set() set.add(1).add(2).add(3).add(4).add(5) console.log(set) let r1 = set.delete(1) console.log(r1) console.log(set) let r2 = set.has(10) console.log(r2) set.clear() console.log(set)
Set(5) { 1, 2, 3, 4, 5 } true Set(4) { 2, 3, 4, 5 } false Set(0) {}
forEach()
遍历
let set = new Set() set.add(1).add(2).add(3).add(4).add(5) console.log(set) // value为每次遍历的值 set.forEach( value => { console.log( value ) } )
Set(5) { 1, 2, 3, 4, 5 } 1 2 3 4 5