ES5
es表示ECMASCript ，他是从es3，es5，es6，es5是2009.12月发布的，es6是2015.6月发布的。vue2完全支持es5的（vue3完全支持es6的），react完全支持es6
es5的新特性
严格模式（对应的相反的称为怪异模式）
'use strict' //一般用于相关的设计 上面书写一个严格模式底下的代码就需要按照严格模式执行
严格模式的特性
变量必须要带修饰符
"use strict";
a = 10
console.log(a); //a is not defined
函数里面this不能指向window
function sayHello(){
console.log(this); //undefined
}
sayHello()
不允许在非函数的代码块内声明函数
禁止八进制方法
函数的arguments数组形参和实参不同步
对于数组和字符串都进行了加强
数组的高阶函数（以函数做的参数的函数 称为高阶函数）
forEach 遍历的
var arr = [1,2,3,4,5]
//forEach 遍历的 value表示里面的值 index表示里面的下标 array表示当前遍历的数组
var forEachObj = 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]
})
map 遍历
//map 遍历的 value表示里面的值 index表示下标 array表示当前的遍历的数组
var mapObj = 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+1
})
forEach和map的区别
- forEach没有返回值 里面没有return
- map有返回值 所以里面可以使用return关键词 他的返回值是一个数组
forEach和map的底层实现
//forEach方法实现
function forEach(fn){
//遍历这个arr
for(var i=0;i<arr.length;i++){
fn(arr[i],i,arr)
}
}
// map方法实现
function map(fn){
var res = []
//遍历这个arr
for(var i=0;i<arr.length;i++){
res.push(fn(arr[i],i,arr))
}
return res
}
reduce 从左到右计算的 reduceRight（从右到左计算）
//pre 前一个值 current 当前值 index 下标 array 数组
//reduce函数 利用前一个和后面值进行运算的操作 得出对应的值
var sum = arr.reduce(function(pre,current,index,arr){
return pre+current
})
console.log(sum);
reduce底层实现
// 底层实现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
}
filter 过滤的
//filter返回的是一个数组 value index arr
var filterArr = arr.filter(function(value,index,arr){
return value>3
})
console.log(filterArr);
filter的底层实现
//实现filter函数
function filter(fn){
var res = []
//遍历数组
for(var i=0;i<arr.length;i++){
if(fn(arr[i],i,arr)){
res.push(arr[i])
}
}
return res
}
some 有一些满足就返回true 否则返回false
//some 一些 every 每一个
var value = arr.some(function(value,index,arr){
return value>4
})
console.log(value);//true
every 每一个满足就返回true 否则返回false
var value = arr.every(function(value,index,arr){
return value>4
})
console.log(value);//false
底层实现
//底层实现 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
}
//底层实现 some
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
}
indexOf 返回对应的下标
lastIndexOf 返回对应的下标
console.log(arr.indexOf(1,2));//从下标开始找 找这个1这个数字第一次出现的位置(左到右)
console.log(arr.lastIndexOf(1,5));//从下标5开始找 找1第一个次出现的位置(右到左)
字符串加强 （模板字符串 ）
var a = 'hello'
console.log(`${a} world`) //hello world
es5新增的改变this指向的方法
bind （不会自动执行）
function say(){
console.log(this) //指向window
}
say() //打印window
//通过函数调用
var obj = { username:"jack" }
say.bind(obj)()//打印的this指向obj
call （自动调用函数）
// call 将this指向和某个内容联系在一块 自动调用 传参一个个用,隔开
say.call(obj,'tom','456')
apply （自动调用函数）
//apply 将this指向重新指向给对应的某个内容 自动调用 数组传递
say.apply(obj,['刘德华','123'])
call和apply的区别
- call传递的参数是一个个的内容，使用,隔开
- apply传递的参数是一个整个数组