ES6----函数新增内容,数组新增方法

1,箭头函数

对于function的简写

/*

        箭头函数:形参 => 返回值

        多个形参 (形参,形参)=> 返回值

        无参数        ()=> 返回值

                     ()=> {

                        执行语句;                                        

                        }

*/

箭头函数本质上是function的简写,差异

箭头函数的不定参

//参数不固定
let fn = () =>{
    console.log(arguments)
}
fn(1,2,3,4);
//箭头函数没有arguments

//箭头函数不定参的写法

let fn = (a,b,...arg) => {
    console.log(arg)
}
fn(1,2,3,4)
 
//一一对应

箭头函数的this问题:

箭头函数本身没有this,调用箭头函数的this时指向的是其声明时所在的作用域的this

参数默认值问题

let fn = (a,b) =>{
    //a=a||10
    //b=b||2
    //a,b如果为0,也会执行后面的,所以不太严谨
    
    a = typeof a === "undefined"? 10 : a;
    b = typeof b === "undefined"? 10 : b;

}

使用箭头函数改写,使a的默认值为10,b的默认值为20

let fn = (a=10,b=2) =>{
    console.log(a,b)
}

2,数组新增方法

new Date().getTime();
Date.now()
new Array()
Array.from()
arr.forEach()

Array.from()把一个类数组转换成真正的数组;

类数组:有下标,有length

    <ul id="list">
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>   
    </ul>

{
    let lis = document.querySelectorAll("#list li")
    console.log(lis)
    //lis就是类数组
    lis = Array.from(lis)
    lis.map((item)=>{
        console.log(item)
    })
}

参数返回值类型是数组

lis = [...lis]

展开运算符也可以展开数组

Array.isArray(lis)        检测lis数据是否是数组,检测是对象还是数组,true or false

Array.find(callback,[,thisArg])查找数组中每组要求的第一个元素的值

{
    let arr = [1,2,3,4]
    let val = arr.find((item,index)=>{
        if(item > 1){
            return true
        }
    })
    console.log(val)
}

简写:val = arr.find(item => item >3) 

val = arr.findIndex(item => item > 3)        返回结果

上一篇:9.1模拟赛


下一篇:关于给每一个元素绑定事件获取索引值的一个点(超详细讲解)