ECMAScript是什么? ES6新增特性有哪些?@zj-zhangjie

ECMAScript是什么?

首先,javaScript的组成包括:ECMAScript,DOM和BOM

1. ECMAScript:javascript核心语法,不依赖平台

例如:定义变量,if,switch,for,数组Api,字符串API,正则Api.....

2. DOM:(Document Object Model)针对浏览器标签操作 例如:获取id,获取类名,获取标签名

  注:操作真实DOM,引起重绘和回流-->才引出虚拟DOM

  重绘: 主要指页面颜色的改变,不影响DOM的空间变化 color,background
  回流: 指页面元素的尺寸(width,padding,height,margin),位置的变化:left,top,bottom,right等
  
     重绘未必引起回流,但回流一定引起重绘

3.BOM:(Browser Object Model)主要针对浏览器相关API操作

 history: history.go(),history.back() pusState,popState,replaceState

 navigator:跟浏览器系统信息相关  

 navigator.userAgent
   
 参考:https://developer.mozilla.org/zh-CN/docs/Web/API/Navigator
location:主要获取浏览器地址栏相关的信息

location.search
location.href
location.hash

参考:https://developer.mozilla.org/zh-CN/docs/Web/API/Location

ES6新增特性有哪些?

1.let和const: (重点)

 let 是定义变量
 const 是定义常量
 
 let和const的区别:
 
 let 定义变量
 const 定义常量,是不能修改的,如果要修改,将常量定义成对象的形式,这样,就可以给对象中的属性进行修改。
 
 let和var的区别:
 
 相同点:都是定义变量
 
 区别:
  1.是否有变量提升   var有变量提升,let没有
  2.是否能重复定义   var允许重复定义变量,let不允许重复定义
  3.是否有块级作用域  { }
     全局作用域:在函数外部定义的范围
     局部作用域:在函数内部定义的范围
     块级作用域:在{ }大括号中定义范围

2. symbol:是ES6新增的基本数据类型

number,string,boolean,null,undefined,symbol(ES6新增)

symbol:定义的值是唯一性

两个symbol类型的值永远不等

例如:
var s1=Symbol()
var s2=Symbol()
s1=== s2
false

3. 扩展运算符( … )

扩展运算符(也称展开操作符)两层作用:

1.将数组转换成数据列表 [a,b,c,d]--->a,b,c,d

例如:

var arr1=[666,777,888]
var arr2=['hello','vuejs']
var result=[...arr1,...arr2]

2.将数据列表转换成数组 a,b,c,d--->[a,b,c,d]

3.展开对象:

var result={...obj1,...obj2}
或
result=Object.assign({},obj1,obj2)

例如:
function sum1(str,...args) {
var result=0;
for(var i=0;i<args.length;i++) {


result+=args[i]

}

return result;
}

sum1('请输入',20,30,40)

4.class类继承

定义一个类:
class Person {

constructor(a,b) {
 //构造器
 this.属性=a

}

方法1() {}
方法2() {}
方法3() {}

}

继承一个类:

class Child extends Person {

constructor(a,b) {
 super()  //代表父类
 //构造器
 this.属性=a

}

方法1() {}
方法2() {}
方法3() {}

}

5.set和map

set:理解成是一个不重复的数组 

将set类型的数据转换成数组:
var s=new Set()
Array.from(s)
或[...s]

var s=new Set()
s.add()
s.has()
s.delete()
s.size

例如:数组去重:
var arr=[3,34,23,2,2,23,23,3,34,34,34,45]

[...new Set(arr)]

map:理解成是一个对象,增强了对象key的数据类型,以前只能是字符串,现在对象的属性可以是做任意的数据类型!
{
 "name":'jack',
 '10':'abc',
 'undefined':999
}

var m1=new Map()
m1.set(属性名,值) //设置
m1.get(属性名)  //获取
m1.delete(属性名)  //删除


//遍历Map类型获取所有值
for(var [key,value] of m1) {

 console.log(key)
 console.log(value)
}

还有Promise和async/await,可以看我的博客:

异步解决方案之promise、async/await(详解)@zj-zhangjie

当然还有很多特性还没有说,预知后事如何,请听下回分解…

猜你喜欢

转载自blog.csdn.net/weixin_45616142/article/details/108410520
今日推荐