ES6 从入门到精通 # 12:数组的扩展方法一

简介: ES6 从入门到精通 # 12:数组的扩展方法一

说明

ES6 从入门到精通系列(全23讲)学习笔记。



数组的方法


from

from() 将伪数组转换成真正的数组

例子:Arguments

function add() {
  console.log(arguments)
  // es5
  console.log([].slice.call(arguments))
  // es6
  console.log(Array.from(arguments))
}
add(1,2,3,4)


bb9d5354c6cd4a848f5c808ab75b6aec.png



例子:NodeList

let lis = document.querySelectorAll("li");
console.log(lis)
console.log(Array.from(lis))
// 扩展运算符
console.log([...lis])

88c80ec1c081453d9bc6c4f7cf4141ad.png


from() 还可以接收第二个参数用来对每个元素进行处理

console.log(Array.from(lis, el => el.textContent))


a8051ee431134656831f4282bc427f79.png



of

of() 将任意的数据类型,转换成数组


console.log(Array.of(1,2,3,"666",{a:777}))


d4f1a34a736d4b3faddb68ee2029d761.png


copyWithin

copyWithin() 方法用于从数组的指定位置拷贝元素到数组的另一个指定位置中。

c0105d3aaf1c486bbd8c2543c6fb9198.png

console.log(["Banana", "Orange", "Apple", "Mango", 1, 2, 3, 4].copyWithin(2,0));



9615effee47b48a3ae5dfaf88c95788b.png



find 跟 findIndex


find() 找出第一个符合条件的数组成员

findIndex() 找出第一个符合条件的数组成员的索引


console.log([1,2,3,4,-1,0,-9].find(n => n < 0))
console.log([1,2,3,4,-1,0,-9].findIndex(n => n < 0))


6e8618db4eb341cb8013a291abb41254.png


目录
相关文章
|
1月前
|
前端开发
前端 TS 快速入门之五:泛型 T
前端 TS 快速入门之五:泛型 T
22 0
|
1月前
|
存储 JavaScript 前端开发
TypeScript 中的 Map 对象定义、基本操作和常见用法
TypeScript 中的 Map 对象定义、基本操作和常见用法
250 7
|
1月前
|
Web App开发 JavaScript 前端开发
【ES6系列第一篇】ES6简介与特性、let、const、解构赋值
【ES6系列第一篇】ES6简介与特性、let、const、解构赋值
35 0
|
1月前
|
存储 JavaScript
【ES6系列第二篇】适用JS初学者的Set对象和Map对象学习笔记
【ES6系列第二篇】适用JS初学者的Set对象和Map对象学习笔记
31 0
|
1月前
|
存储 编译器 Go
Go 语言数组基础教程 - 数组的声明、初始化和使用方法
数组用于在单个变量中存储相同类型的多个值,而不是为每个值声明单独的变量。 声明数组 在Go中,有两种声明数组的方式:
140 0
|
6月前
|
网络架构
ES6学习(五)—数组的扩展
ES6学习(五)—数组的扩展
|
10月前
|
前端开发
前端学习笔记202306学习笔记第三十八天-Es6-数组得结构赋值
前端学习笔记202306学习笔记第三十八天-Es6-数组得结构赋值3
44 0
|
10月前
|
前端开发
前端学习笔记202306学习笔记第三十八天-Es6-数组得结构赋值1
前端学习笔记202306学习笔记第三十八天-Es6-数组得结构赋值1
36 0
|
前端开发 API
每天3分钟,重学ES6-ES12(十一)Promise的类方法
每天3分钟,重学ES6-ES12(十一)Promise的类方法
67 0