ES5 : ECMAScript 5
ES5的严格模式:即更严格的模式 在这种模式下执行,浏览器会对JS的要求更苛刻,语法格式要求更细致,更符合逻辑。
怪异模式:就是我们之前一直使用的开发模式,就叫怪异模式。
声明严格模式:"use strict";
"use strict"; //声明严格模式 n=123 console.log(n); //这里面代码打印会直接报错,采用了严格模式后对应的内容需要更加规范,不支持8进制
eslint 代码检查器
设立严格格式的原因:
1.消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;
2.代码运行的一些不安全之处,保证代码运行的安全;
3.提高编译器效率,增加运行速度;
严格模式注意几点:
1.不可以省略var声明变量;
2.禁止函数使用this关键字指向全局变量;
3.禁止使用八进制方法;
4.不允许在非函数的代码块内声明函数;
5.严格模式下,arguments变量,形参是不会变(不同步);
ES5的bind:
绑定一个新对象, 让函数中的this指向该对象
var user = { username:'张三' } function hello(){ console.log(this); //指向user } //bind将这个函数绑定给一个对象,那么这个函数里面的this就会指向对应的对象
函数对象 . bind(绑定的对象)()
var obj = { print:function(){ console.log(this.username) } } obj.print.bind(user)() //一般我们绑定的this都是函数里面的 bind绑定对象,一般常用于定时器
ES5的数组高阶函数
高阶函数:以函数作为参数的函数
forEach 遍历 (不支持IE8及以下)
map 遍历 (不支持IE8及以下)
filter 过滤
reduce 计算
reduceRigth 从右到左计算
every 是否每一个都符合条件
some 是否存在符合条件的
var arr = ['a','b','c','d'] console.log(Array.isArray(arr)); //判断是否是一个数组,返回为布尔类型的值
forEach 遍历的函数,没有返回值,不影响原数组
arr.forEach(function(value,index,array){ //第一个value表示值;(是只读属性) //第二个index表示下标; //第三个array表示你遍历的数组 })
map 遍历的函数 有返回值,返回数组,数组的长度和我们原本的数组长度一致
var newArr = arr.map(function(value,index,array){ if(value!='a'){ //当为a的时候不返回,a位置的结果为undefined return value+value } }) console.log(newArr.length); //返回值为 4 console.log(arr); //返回值为'a' 'b' 'c' 'd' console.log(newArr); //返回值为undefined 'bb' 'cc' 'dd'
filter 过滤 过滤出数组中你想要的元素, 不改变原数组
var arrs = [10,15,12,13,11] var newArr = arrs.filter(function(value,index,array){ if(value>=12){ return value } }) console.log(newArr); //返回值为 15 12 13
reduce 计算方法 计算总和(从左到右)
var arrs = [1,2,3,4] var sum = arrs.reduce(function(preValue,currentValue,currentIndex,arr){ return preValue+currentValue }) console.log(sum) //返回值为10 // preValue:表示上一个值; // currentValue:表示当前值; // currentIndex:表示当前下标; // arr:表示遍历的数组;
reduceRigth 计算方法(从右到左)
var strArr3 = ['A','B','C'] var str1 = strArr3.reduce(function(preValue,currentValue,currentIndex,arr){ return preValue+currentValue }) var str2 = strArr3.reduceRight(function(preValue,currentValue,currentIndex,arr){ return preValue+currentValue }) console.log(str1); //返回值为 ABC console.log(str2); //返回值为 CBA
every 遍历每一个是否都符合条件,返回布尔类型的值,都符合条件返回true,有一个不符合返回false
var numberArr = [1,20,15,30] var isTrue = numberArr.every(function(v,i,arr){ return v<30 }) console.log(isTrue); //返回值为 false
some 是否存在符合条件的,有一个就返回true,都没有就返回false
var isTrue = numberArr.some(function(v,i,arr){ return v<0 }) console.log(isTrue); //返回值为 false
es5新增的其他内容
针对日期:新增方法 now() 静态方法,获取当前日期离1970年1月1日0时0分0秒的毫秒值(事件戳)
var n = Date.now() //这个比较常用
字符串模板
对于对象来说提供 get及 set
var user = { username:'张三', name:{ get name(){ //获取会自动调用 return this.username }, set name(username){ //设置会自动调用 this.username = username } }
ES6介绍
ecmascript的第六个版本 他是再es5之上做了功能添加
变量命名
var 命名的是伪全局作用域,var 命名可以重复
let关键词:不能重复命名(同一作用域的情况,不同作用域是可以的)
let关键词:是声明块状作用域,也就是说他的作用方法只在模块里面(建议使用)
const关键词:声明常量,就是不能变的量,使用const修饰的不能二次赋值,不能重复命名
箭头函数(没有this)
var fn = (参数)=>{ 函数代码块 } (参数)=>{代码块},如果里面只有一个参数可以省略(),只有一句代码执行的话,可以省略{} var fn = name=>console.log(name+'你在干嘛'); fn('张三')