es6 内置对象扩展rest, Arry 扩展方法Array.from(),find(), findIndex(),includes()

2024-05-07 01:21:33

1.es6内置对象扩展rest实参

2. Arry 扩展方法

（1）构造函数方法:Array.from()

（2） find()

（3） findIndex()

（4）includes()

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Document</title>

</head>

<body>

<div></div>

<div></div>

<div></div>

<script>

// es6引入rest参数，用于获取函数的实参，用来代替arguments

// es6获取实参的方式

function date(){

console.log(arguments);

}

date('a','b','c')

//rest实参

function date(...args){

console.log(args);

}

date('a','b','c')

//rest参数必须要放到参数最后

function fn(a,b,...args){

console.log(a);

console.log(b);

console.log(args);

}

fn(1,2,3,4,5,6)

// [...]扩展运算能将[数组]转换为逗号分隔的[参数序列]

const arr=['a','b','c','d']

function chuanwan(){

console.log(arguments);

}

chuanwan(...arr);

// 数组的合并

const yidui=['a',"b","c"]

const erdui=['d','e','f']

// const hedui=yidui.concat(erdui);

const hedui=[...yidui, ...erdui]

console.log(hedui);

// 数组的克隆

const kaishi=['E','G','M']

const clone=[...kaishi]

console.log(clone);

// 将伪数组转化为真正的数组

const divs=document.querySelectorAll("div")

const divArr=[...divs];

console.log(divArr); //arguments

// 构造函数方法:Array.from()

// 将类数组或课遍历数组对象转换为真正的数组

let arrayLike={

'0':'a',

"1":"b",

"2":"c",

length:3

};

// let arr2=Array.from(arrayLike); //['a','b','c']

// 方法还可以接受第二个参数，作用类似于数组的map方法，用来堆每个元素进行处理

// 将处理后的值放回返回的数组

var arryLike={

"0":"1",

"1":"2",

"length":2

}

Array.from(arrayLike,item=>{

return item*2

})

console.log(ary);//2,4

// Arry 扩展方法

// find()

// 用于找出第一个符合条件的数组成员，如果没有找到返回undefined

let ary=[{

id:1,

name:'张三'

},{

id:2,

name:'李四'

}];

let target=ary.find((item,index)=>item.id==2)

// Array的扩展方法

// findIndex()用于找出弟也给符合条件成员的位置，如果没有找到返回-1

let ary=[1,5,10,15];

let index=ary.findIndex((value,index)=>value>9);

console.log(index); //2

// includes()

// 显示某个数组是否包含给定的值，返回布尔值

[1,2,3].includes(2) //true

[1,2,3].includes(4) //false

</script>

</body>

</html>

es6 内置对象扩展rest, Arry 扩展方法Array.from(),find(), findIndex(),includes()相关推荐

JS标准内置对象数组的 34 个方法
先放一个语雀的链接: https://www.yuque.com/docs/share/13314a2f-05c0-4de6-8d61-8acd9e566ad4?# <JS内置对象 Array& ...
ES6——ES6内置对象
文章目录前言一.array 的扩展方法. 1. 展开语法 2. Array.from()方法 3. array.find() 方法 4. array.findindex()方法 5. arr ...
JS内置引用类型/内置对象
JS内置引用类型/内置对象概述对象在 JavaScript 中被称为引用类型的值/实例,在 ECMAScript 中,引用类型是一种数据结构, 用于将数据和功能组织在一起.它也常被称为类,但这种称 ...
内置对象的API Array数组对象 String字符串对象 json字符串 JSON对象 js作用域及变量预解析引用类型与值类型区别共享引用基本包装类型数组去重
01-内置对象的API a.Date对象获取时间 b.Array对象数组加工 c.String对象字符串加工 d.json字符串的语法格式 e.JSON对象的字符串与对象转换应用 02-JS作用域 a ...
JavaScript知识点总结（十一）- 内置对象
目录一.什么是内置对象二.查询文档 2.1 MDN 2.2 如何学习对象中的方法三.Math对象 3.1 Math概述 3.1.1 案例练习 - 封装自己的Math对象 3.1.2 Math绝对 ...
12JavaScript中的内置对象
技术交流QQ群:1027579432,欢迎你的加入! 1.内置对象 JavaScript中的对象分为3种:自定义对象.内置对象.浏览器对象: 前两种对象是JS中的基础内容,属于ECMAScript,第 ...
JSP第四课：用户注册登录设计（内置对象使用）
一.相关知识:内置对象使用客户端的浏览器从Web服务器上获得网页,实际上是使用HTTP协议向服务器发送一个请求,服务器在接收到来自客户端浏览器发来的请求后要响应请求.JSP通过request对象获 ...
jsp内置对象【02】四种内置对象【02】session、application
我们继续来学习,上一篇文章中说到了request属性,那么既要想客户端和服务端都都能实现跳转的话,就用到了session. 第三种:session属性我们接着修改一下上一篇文章中的代码来对比一下: ...
js笔记（四）内置对象Math和Date()、浏览器对象模型BOM
大标题小标题备注一.内置对象Math.Date() 1. Math 数学对象; 2. Date() 日期对象; 常用的数学对象:Math.PI.abs(n).round(n).random(). ...

最新文章

热门文章