ES5和ES6

ES5及ES6

 JavaScript这种语言的基本语法结构是由ECMAScript来标准化的, 所以我们说的JavaScript版本一般指的是ECMAScript版本.es5是2009.12月发布的，es6是2015.6月发布的。vue2

完全支持es5的（vue3完全支持es6的），react完全支持es6

一、es5的新特性

1、严格模式（对应的相反的称为怪异模式）

'use strict' //一般用于相关的设计 上面书写一个严格模式底下的代码就需要按照严格模式执行

 严格模式的特性

(1)变量必须要带修饰符

"use strict";
a = 10
console.log(a); //a is not defined

(2)函数里面this不能指向window

function sayHello(){
console.log(this); //undefined
}
sayHello()

(3)不允许在非函数的代码块内声明函数

for(var i=0;i<1;i++){
        var hello = function(){
            console.log('hello world');
        }
    }
    hello()
    //这个也是在函数代码块内的函数，这是window的函数代码块内

(4)禁止八进制方法
(5)函数的arguments数组形参和实参不同步

2、对数组进行的加强（数组的高阶函数：以函数做的参数函数 称为高阶函数）

（1）forEach 遍历的

 var arr = [1,2,3,4,5]
    // // forEach 遍历的 value表示里面的值 index表示里面的下标 array表示当前遍历的数组
    var forEachObject = arr.forEach(function(value,index,array){
        console.log(value);//打印里面的值1,2,3,4,5
        console.log(index);//打印下标 0,1,2,3,4
        console.log(array);//当前遍历的数组[1,2,3,4,5]
    }) 
    console.log(forEachObject);

forEach的底层代码的实现

 var arr=[1,2,3,4,5]
    // forEach方法的实现
    function forEach(fn){
        // 遍历这个arr
        for(var i=0;i<arr.length;i++){
            fn(arr[i],i,arr)
        }
    }
    forEach(function(value,index,arr){
        console.log(value);
        console.log(index);
        console.log(arr);
    })

（2）map遍历

var arr = [1,2,3,4,5]
 var mapObject = arr.map(function(value,index,array){
        console.log(value);//打印里面的值1,2,3,4,5
        console.log(index);//打印下标 0,1,2,3,4
        console.log(array);//当前遍历的数组[1,2,3,4,5]
        return value
    })
     console.log(mapObject);

map底层代码的实现

 var arr=[1,2,3,4,5]
// map方法的实现
    function map(fn){
        var res = []
        // 遍历这个arr
        for(var i=0;i<arr.length;i++){
            res.push(fn(arr[i],i,arr))
        }
        return res
    }
    var mapArr = map(function(value,index,arr){
        console.log(value);
        return value+1
    })
    console.log(mapArr);

（3）forEach和map的区别

• forEach没有返回值 里面没有return
• map有返回值 所以里面可以使用return关键词他的返回值是一个数组

（4）reduce 从左到右计算的 reduceRight（从右到左计算）

// reduce 计算函数
    // 求和
    // pre cur index arr
    // reduce函数 利用前一个和后一个进行运算的操作 得出对应的值
    var arr = [1,2,3,4,5]
    var sum = arr.reduce(function(pre,cur,index,arr){
        return pre+cur//加号可以更换为* /等
    })
    console.log(sum);

reduce底层实现：

• 实现reduce函数求和

var arr = [1,2,3,4,5]
// 实现reduce函数求和
    function reduce(fn){
        var sum = 0
        // 遍历数组
        for(var i=0;i<arr.length;i++){
            sum+=fn(arr[i-1],arr[i],i,arr)//1+2 2+3 3+4 4+5
            sum-=arr[i]
        }
        sum+=arr[arr.length-1]
        return sum
    }
    var sum = reduce(function(pre,cur,index,arr){
        console.log(cur);
        return pre+cur
    })
    console.log(sum);

• 底层实现reduce

   var arr = [1,2,3,4,5]
   // 底层实现reduce
      function reduce(fn){
          // 如果只有一个直接返回
          if(arr.length==1)return arr[0]
          var res = arr[0]
          // 如果多个的情况
          for(var i=1;i<arr.length;i++){
              res = fn(res,arr[i],i,arr)
          }
          return res
      }
      var sum = reduce(function(pre,cur,index,arr){
          console.log(cur);
          return pre/cur
      })
      console.log(sum);

（5）filter 过滤的

 var arr = [1,2,3,4,5]
 // filter返回的是一个数组
    var filterArr = arr.filter(function(value,index,arr){
        return index>0
    })
    console.log(filterArr);

filter的底层实现

 var arr = [1,2,3,4,5]
 // 实现filter函数
    function filter(fn){
        var res = []
        // 遍历数组
        for(var i=1;i<arr.length;i++){
            if(fn(arr[i],i,arr)){
                res.push(arr[i])
            }
        }
        return res
    }
    var filterArr = filter(function(value,index,arr){
        return index>0
    })
    console.log(filterArr);

（6）some 有一些满足就返回true 否则返回false

  var arr = [1,2,3,4,5]
 // some 一些 every 每一个
   var value =  arr.some(function(value,index,arr){
        return value>4
    })
    console.log(value);

some底层代码的实现

  var arr = [1,2,3,4,5]
 // 底层实现 some
    function some(fn){
        var isTrue = false
        for(var i=0;i<arr.length;i++){
            if(fn(arr[i],i,arr)){
                isTrue = true
                break
            }
        }
        return isTrue
    }
    console.log(some(function(value,index,arr){
        return value>5
    }));

（7）every 每一个满足就返回true 否则返回false

 var arr = [1,2,3,4,5]
 console.log(value);
    var value1 = arr.every(function(value,index,arr){
        return value >4
    })
    console.log(value1);

every底层代码的实现

var arr = [1,2,3,4,5]
// 底层实现 every
    function every(fn){
        var isTrue = true
        for(var i=0;i<arr.length;i++){
            if(!fn(arr[i],i,arr)){
                isTrue = false
                break
            }
        }
        return isTrue
    }
    console.log(every(function(value,index,arr){
        return value>0
    }));

（8）indexOf 返回对应的下标    lastIndexOf 返回对应的下标

console.log(arr.indexOf(1,2));//从下标开始找 找这个1这个数字第一次出现的位置(左到右)
console.log(arr.lastIndexOf(1,5));//从下标5开始找 找1第一个次出现的位置(右到左)

 3、对字符串进行加强

var a ='hello'
console.log(`${a} world`) //hello world

4、es5新增的改变this指向的方法

（1）bind （不会自动执行）

function say(name,password){
        console.log(this);//指向window
        console.log(name,password);
    }
    say()//打印window
    //通过函数调用
    var obj = {username:"jack"}
    // bind把这个函数里面的this绑定对应的obj（不会自动执行 需要函数调用才可以执行）
    say.bind(obj)('jack','123')//打印的this指向的是obj

（2）call （自动调用函数）

// call 将this指向和某个内容联系在一块 自动调用 一个一个的传参
    say.call(obj,'tom','456')

（3）apply （自动调用函数）

// apply 将this指向重新指向给对应的某个内容 自动调用 数组形式的传参
    say.apply(obj,['haha','789'])

（4）call和apply的区别

• call传递的参数是一个个的内容，使用,隔开
• apply传递的参数是一个整个数组

二、es6的新特性

ECMAScript 6（简称ES6）是JavaScript语言的下一代标准，已经在2015年6月正式发布了。ES6的目标，是使得JavaScript语言可以用来编写大型的复杂的应用程序，成为企业级开发语言。 es6对应数组 字符串 对象及函数以及循环,值类型，修饰符等都有加强（es6以后的内容都称为es6的内容）

1、数组的增强

（1）find 查找

 // find查找对应的元素 返回第一个找到的元素
    var value = [1,2,3,4,5].find(function(value){
        return value != 5
    })
    console.log(value);
    //Array.from和find的结合
    var li = Array.from(lis).find(function(li){
        return li.innerText == '5'
    })//找到对应匹配的元素
    console.log(li);

（2）findIndex 查找下标

// findIndex 查找对应的元素的下标 返回第一个找到的元素的下标
//findIndex和Array.from的结合使用
    var index = Array.from(lis).findIndex(function(li,index,arr){
        console.log(index);
        return li.innerText == '5'
    })
    console.log(index);

静态方法（使用类名.）

(3)Array.of() 将一组数据转为数组

 // Array.of 将彝族数据转为数组
    var array = Array.of(1,2,3,4,5)
    console.log(array);
    

(4)Array.from() 将伪数组转为数组

<ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
</ul>

 // Array.from 将一个伪数组转为数组 返回一个数组
    // 具备某些数组的特性的对象称为伪数组 arguments NodeList HTMLCollection等
    var lis = document.querySelectorAll('li')
    // 伪数组不具备数组的函数
    Array.from(lis).forEach(function(li){
        console.log(li.innerText);
    })
    

2、字符串的增强

（1）includes 是否包含 （包含返回true 不包含返回false）

// includes 是否包含
    console.log('abc'.includes('a'));//true

（2）startsWith 是否以这个字符串开头 （是返回true 不是返回false）

// startsWith 是否以这个字符串开头
    console.log('abc'.startsWith('a'));//true
    console.log('abc'.startsWith('abc'));//true

（3）endsWith 是否以这个字符串结尾 （是返回true 不是返回false）

// endsWith 是否以这个字符结尾
    console.log('abc'.endsWith('abc'));//true
    console.log('abc'.endsWith('c'));//true

（4）repeat 重复多次的去平铺对应的字符串

// 平铺 平铺的次数 重复多次写这个字符串
    console.log('abc'.repeat(3));//abcabcabc

3、变量修饰符的增强

（1）var 关键词修饰的变量是伪全局变量（进行变量提升）

 <button>1</button>
 <button>2</button>
 <button>3</button>
    var btns = document.querySelectorAll('button')
// var 关键词声明的伪全局作用域
for( var i=0;i<btns.length;i++){
    btns[i].onclick = function(){//当前的事件是异步操作
        console.log(i);//3  3 3异步比同步晚执行 var关键词修饰的变量是伪全局变量
    }
}

（2）let 关键词 块状作用域 （变量名不能重复声明 避免变量名污染）

// let 块级作用域 只在当前的代码块内有用
for(let i=0;i<btns.length;i++){
    btns[i].onclick = function(){
        console.log(i);//0 1 2
    }
}
// let 在同一作用域内不能重复命名
// let a = 10
// let a = 10
// 当你省略了对应的修饰符 默认就是以var关键词修饰

（3）const 关键词 常量（常量不可变 也不能重复声明 声明一定要赋值（不能二次赋值））

// const 关键词 声明常量 他同样具备块级作用域 const定义的变量不能重新赋值
// const声明的时候必须赋值
const a = 10
// a = 20 错误的 因为const修饰的变量不允许更改
// bable.js可以把高版本变成低版本，不建议写源码的时候使用let和const

4、新增的值类型

旧有值类型
number , String , boolean , null , undefined

新增的类型

（1） symbol 独一无二的值

// Symbol 独一无二的值 
    // 如何去声明一个Symbol值
    var sy = Symbol()//独一无二的值
    console.log(sy);
    var s = Symbol('哈哈')//里面的参数只是说明
    var s1 = Symbol('哈哈')
    console.log(s==s1);
    console.log(s.description);//获取里面的详情信息 当前这个是个只读属性
    // v.description='hello'//无用 他是个只读属性
    // key是独一无二的 当做对象的key值
    var obj = {v:'hello'}
    console.log(obj.v);

（2）bigInt 大的整型

 // bigInt 大的整型（存入number存不了的数据）实现的方式 字符串传入实现
    // 传入字符串
    var str = '123456789456789456789123456789123456'
    console.log(Number(str));
    var bigNumber = BigInt(str)
    console.log(bigNumber);

5、对象的增强

静态方法

（1）is方法 Object.is() 判断俩个对象是否是一个（true或者false）

// 对象的静态方法
    // is方法 判断两个对象是否为一个
    var obj = {}
    var obj1 = {}
    console.log(obj==obj1);//false 两个比对的地址
    console.log(obj===obj1);//false 
    console.log(Object.is(obj,obj1));//false 
    // NaN 
    console.log(NaN== NaN);//false
    // Object.is 解决了NaN和NaN的问题
    console.log(Object.is(NaN,NaN));//true Number类型
    console.log(Object.is({},{}));//false {}对象

（2）Object.assign 将后面对象合并当前前面 返回的是合并的对象

var obj = {sex:'男'}
    // assign 目标对象 来源对象 将后面的对象合并到前面 会影响之前的对象
    var res = Object.assign(obj,{name:'刘敏',age:18})
    console.log(obj);
    console.log(res);
    console.log(Object.is(obj,res));//true 浅拷贝

6、函数的增强

（1）箭头函数

// //箭头函数一般都是匿名函数
// var hello = function(){ //之前的写法
// }
//箭头函数的写法 ()形参 {}代码块 把function省略了 加了个=>
var hello = ()=>{
console.log('hello')
}
//调用
hello()

（2）箭头函数的简化

• 如果只有一个参数 可以省略()

// 简化 如果只有一个参数可以省略()
    var say = username =>{
        console.log(username);
    }
    say('jack')

• 如果只有一句代码的话 可以省略{}

// 当你只有一句代码的时候 {}可以省略
    var world = username=>console.log(username);
    world('hello')

• 如果只有一句代码 且你需要返回数据情况下 可以省略对应的 retrun

// 当你只有一句代码且你需要返回值的时候 return可以被省略
    var getUsername = username=>username+'hello'
    var value = getUsername('刘敏')
    console.log(value);//张三hello

（3）箭头函数的特性

• 箭头函数里面没有this（根据作用域链向上查找对应的this）

// 箭头函数的特性
    // 箭头函数里面没有this
    console.log(this);//指向window
    // this谁调用指向谁 是在对应的普通函数的情况下
    document.querySelector('button').onclick = function(){
        console.log(this);//指向当前按钮
    }
    // 箭头函数
    document.querySelector('button').onclick = ()=>{
        console.log(this);//箭头函数里面没有this 根据作用域链的情况向上找window
    }
    var hello =()=>{
        console.log(this);
    }
    hello.call({age:18})//window
    var obj = {
        age:15,
        say:()=>{
            console.log(this);
        }
    }
    obj.say()//window obj对象是属于window的
    // 函数对象里面添加一个属性say
    // function test(){
    //     this.say=()=>{//这里的this指向window
    //         console.log(this);
    //     }
    // }
    // test.say()//调用函数对象里面的对应的方法
    function test(){
        console.log(this);
        return ()=>{
            console.log(this);
        }
    }
    test()()//调用函数对象里面的对应的方法 window
    test.call({username:"hello"})()//{usernmae:"hello"}

（4）默认参数

function fn(agr1=value,arg2=value2){
}

 // 初始化一个对象
    function initObj(name,age,sex){
        return{
            name,age,sex
        }
    }
    console.log(initObj('jack'));//没有传参会使用默认值
    console.log(initObj('jack',19,'女'));//穿了参会覆盖默认值

7、对象里面内容的简化

（1）属性的简化
当你的属性值是一个变量的情况下，以及你向使用你的变量作为key的名，这个时候可以省略key

var age = 18
var username =
'
jack'
//简化 使用变量做键的名 {age:age,username:username}
var obj = {age,username}

（2）函数的简写

var obj = {
say:function(){
console.log('hello')
}
}
obj.say()
//简写 省略:和function
var obj = {
say(){
console.log('hello')
}
}
obj.say()

8、循环的加强

• for in 是用于遍历对象的 遍历的是对象的里面key 他也可以遍历数组（数组也是对象）
• for of 是用于遍历数组的 遍历的是数组里面的value 他不可以遍历对象（只有实现了迭代器的对象才可以被遍历 必须具备length或者size属性）

（1）如果要使用对应的for of来遍历对象的话 怎么办！

Object的几个方法（静态方法） 可以用来实现对应的遍历

• keys 拿到所有的key
• values 拿到所有的值
• entries 拿到所有的键值对

var obj = {age:18,name:'jack',sex:'男'}
//keys 获取所有的key 作为一个迭代对象
var k = Object.keys(obj)
console.log(k);
//values 获取所有的value
var v = Object.values(obj)
//entries 获取所有的key-value对
var e = Object.entries(obj)

9、新增的对应的迭代器类型（实现了迭代器）

（1）set 元素不重复的一个集合（去重）

set声明

• 无参

var set = new Set() //空的集合

• 将数组作为参数传递

var arr = [1,1,2,2,3,3]
var set = new Set(arr) //传入数组
console.log(set) //1 2 3

（2）相关的方法（增删改查）

• add 添加
• delete 删除
• clear 清空
• keys 获取key
• values 获取值
• entries 获取键值对象
• forEach 遍历（三个参数分别是value,key,set）
• has 判断是否存在 （返回的是boolean类型）

var set = new Set()
    // 将数组作为参数传递
    var arr =[1,2,3]
    var set = new Set(arr)
    console.log(set);//{1,2,3}
    // 添加 add append push...
    var set = new Set()
    set.add(1)
    set.add(2)
    set.add(1)
    console.log(set.size);//2 set去重
    // 删除 delete remove
    set.delete(1)//删除1这个value值
    console.log(set);
    // 清空
    // set.clear()
    console.log(set);
    // 获取元素
    var key = set.keys()//获取所有的key 值既是key也是值
    var value = set.values()//获取所有的值
    var kv = set.entries()//获取所有的键值对
    console.log(key);
    console.log(kv);
    console.log(value);
    // set里面有一个forEach方法
    // 第一个是值，第二个是key 第三个是遍历的set
    set.forEach((v,k,set)=>{
        console.log(v);//打印v，k，set 都可以
    })
    // has 判断是否存在 返回true和false
    console.log(set.has(2));//true
    console.log(set);

（3）属性

size获取对应的长度

// map的声明
    // 无参
    var map = new Map()
    // 有参
    var arr = [[1,2],[4,5],[7,8]]
    var map = new Map(arr)//通过二维数组来构建map
    console.log(map);//键值对：1=>2,4=>5,7=>8
    // map对应的方法 增删改查

    // 查询get
    console.log(map.get(1));//通过key来获取value  2

    // 添加的方法 set 传入key value
    map.set('hello','刘敏')

    // 属性 size属性
    console.log(map.size);//4

    // 删除的方法  通过key来删除
    map.delete(4)//删除key为4的这个键值对，删除4=>5

    // 重新设置就是修改
    map.set(1,'流氓')//修改1=>2 为1=>'流氓'

    // 获取key 获取value 获取键值对
    console.log(map.keys());//1,7,'hello'
    console.log(map.values());//'流氓',8,'刘敏'
    console.log(map.entries());//1=>'流氓',7=>8,'hello'=>'刘敏'

    // 清空所有
    // map.clear()

    // forEach迭代 value key map
    map.forEach((value,key,map)=>{
        console.log(value);//流氓 8 刘敏
    })

    // has 判断是否存在
    console.log(map.has('hello'));//true

（4）WeakSet 内容存储对应的set（只能存储对象 但并不能完成去重）

 // WeakSet内容存储对应的set（只能存储对象 但是不能完成去重）
    var weakset = new WeakSet()
    weakset.add({username:'刘敏'})
    weakset.add({username:'刘敏'})
    weakset.add({username:'刘敏'})
    console.log(weakset);//存的还是3个，无法完成去重

（5）map 基于set和array之上构建的一个集合（key(set)-value(array)）

map的声明

var map = new Map() //无参

var arr = [[1,2],[3,4]]
var map = new Map(arr) //通过二维数组构建的

map对应的方法

• get 通过key来获取value
• set 存入一个key-value
• delete 通过key来删除
• clear 清空所有
• keys 获取所有的key values 获取所有的值 entries 获取所有的键值对
• has 判断当前key是否存在
• forEach 遍历

// map的声明
    // 无参
    var map = new Map()
    // 有参
    var arr = [[1,2],[4,5],[7,8]]
    var map = new Map(arr)//通过二维数组来构建map
    console.log(map);//键值对：1=>2,4=>5,7=>8
    // map对应的方法 增删改查

    // 查询get
    console.log(map.get(1));//通过key来获取value  2

    // 添加的方法 set 传入key value
    map.set('hello','刘敏')

    // 属性 size属性
    console.log(map.size);//4

    // 删除的方法  通过key来删除
    map.delete(4)//删除key为4的这个键值对，删除4=>5

    // 重新设置就是修改
    map.set(1,'流氓')//修改1=>2 为1=>'流氓'

    // 获取key 获取value 获取键值对
    console.log(map.keys());//1,7,'hello'
    console.log(map.values());//'流氓',8,'刘敏'
    console.log(map.entries());//1=>'流氓',7=>8,'hello'=>'刘敏'

    // 清空所有
    // map.clear()

    // forEach迭代 value key map
    map.forEach((value,key,map)=>{
        console.log(value);//流氓 8 刘敏
    })

    // has 判断是否存在
    console.log(map.has('hello'));//true

(6)weakMap基于weakSet上面构建map 也就是他的key是对象 只能是对象

10、解构

（1）解除构建

var obj = {username:'jack',password:'123'}
// obj.username
// obj.password
//解构来取 (通过key来解构对应的obj) {key} = {key:123}
var {password,username} = obj
console.log(username);
console.log(password);
//快速提取对象里面数据
var {age} = {age:18}
console.log(age);
//解构取数组里面的内容 按照位置来取对应的值
var [o,p] = ['a','b']
console.log(o);
// 快速读取值
var {sex} = {username:'jack',password:"123",age:'18',sex:"女"}
console.log(sex);

11、扩展运算符

（1）...打开数组拿出里面的内容

//扩展运算符
var arr = [1,3,5]
var arr1 = [2,4,6]
console.log(...arr); //解除数组的包装 把他暴露出来 1 3 5
//如果你的方法里面需要,隔开他会默认给你加上一个,
console.log( 'abc'.concat(1,2,3,4,5));
console.log( 'abc'.concat(...arr,...arr1)); //默认加上,

12、Class （类）

他是用于对象构建的 （类只是一个构建对象的容器 ）调用这个class要使用new关键词

//类名首字母必须大写
class Person{
constructor(){ //构造器
//this必须在构造器里面使用
this.age = 18 //类的属性
this.sayHello = function(){ //类的方法
console.log('hello')
}
}
}
//构建对象
var person = new Person()
console.log(person.age); //18
person.sayHello() //hello

//类名首字母必须大写 class不能被重复定义
class Person1{
//constrctor调用 new的过程 每一次new 里面的内容都会重新声明
constructor(age=18,name='jack'){ //构造器
//this必须在构造器里面使用 this是指向实例化的对象
this.age = age //类的属性
this.name = name
this.sayHello = function(){ //类的方法
console.log('hello')
}
}
run(){//在函数里面可以访问对应的this
console.log(this.name+'跑');
}
}
//使用new 调用的对应构造器的时候 就是在实例化的过程 而产生的对象被称为实例化对象
var person = new Person1(18,'jack')
console.log(person); // age:18 name:jack sayHello:fn
var person1 = new Person1()
console.log(person1);
person1.run()
console.log( person1.sayHello == person.sayHello);//false
console.log( person1.run == person.run);//true

注意事项

• class 修饰的类 类名首字母必须大写
• class 不允许重复声明
• class 里面this只能存在于constructor（构造器）里面
• class 里面this指向当前实例化对象
• 在实例化的过程 new的过程的 调用的constructor函数 跟其他函数无关（所以当前在constructor都会重新声明一次）

13、extends关键词

extends 用于继承 他会拥有父类所有的非私有的属性及方法

class Person{
constructor(){
this.age = 18
}
run(){
console.log('跑');
}
}
//extends 关键词声明以后 在对应的constructor里面想要使用this 必须先写super()
class Son extends Person{
constructor(){
super()//指向父类Person的构造器constructor
this.name = 'jack'
}
}
var son = new Son()
console.log(son);//获取不到run的

注意事项

• 在子类构造里面如果想要使用this 必须先要使用super()
• super指向父类的构造器
• 子类无法获取构造器之外的函数

三、练习

（1）使用reduce求数组中所有元素的乘积， var arr = [2,3,4,5,6,7]

var arr = [2,3,4,5,6,7]
var result = arr.reduce((pre,cur)=>{
    return pre*cur
})
console.log(result);

（2）使用reduce求数组中的最大数, var arr = [2,4,6,3,7,8,5]

var arr = [2,4,6,3,7,8,5]
var max = arr.reduce((pre,cur)=>{
    if(pre>cur){
        return pre
    }
    else{
        return cur
    }
})
console.log(max);

（3）使用indexOf完成数组去重.

var arr = [2,4,6,3,7,8,5,4,6,3,2,2,8,8]
var newArr = []
for(var i=0;i<arr.length;i++){
    var d=arr[i]
    if(newArr.indexOf(d)==-1){
        newArr.push(arr[i])
    }
}
console.log(newArr);

（4）使用for-of求5! (1*2*3*4*5)

var arr = [1,2,3,4,5]
var sum=1
for(var i of arr){
    sum*=i
}
console.log(sum);

（5）使用for-of求1!+2!+3!+4!+5!

var arr = [1,2,3,4,5]
var sum=0
for(var i of arr){
    var d =i;
    var pd = 1
    for(var j=1;j<=i;j++){
        pd*=j
    }
    sum+=pd
}
console.log(sum);

（6）使用for-of求数组的最大数和最小数

var arr = [45,56,2,48,96,32,7,56,52,49]
var max =-Infinity
var min = Infinity
for(var i of arr){
    if(max<i){
        max = i
    }
    if(min>i){
        min=i
    }
}
console.log('最大：'+max+'最小：'+min);

（7）findIndex去重

var arr =[1,2,1,2,3,4,5,3,1]
var indexs =[]
for(var value of arr){
    var index = arr.findIndex((v)=>{
        return v == value
    })
    if(!indexs.includes(index)){
        indexs.push(index)
    }
}
console.log(indexs);