ES6
- Js的三大组成部分
- ECMAScript:
JavaScript的核心,描述了语言的基本语法(var、for、if、array等)和数据类型 (数字、字符串、布尔、函数、对象(obj、[]、{}、null)、未定义),ECMAScript 是一套标准,定义了一种语言(比如JS)是什么样子。 - 文档对象模型(DOM)
DOM(文档对象模型)是 HTML 和 XML 的应用程序接口(API)。DOM 将 把整个页面规划成由节点层级构成的文档。HTML 或 XML 页面的每个部分 都是一个节点的衍生物。 - 浏览器对象模型(BOM)
对浏览器窗口进行访问和操作。例如弹出新的浏览器窗口,移动、改变和关 闭浏览器窗口,提供详细的网络浏览器信息(navigator object),详细的页面 信息(location object),详细的用户屏幕分辨率的信息(screen object),对 cookies的支持等等。BOM作为JavaScript的一部分并没有相关标准的支持, 每一个浏览器都有自己的实现,虽然有一些非事实的标准,但还是给开发者 带来一定的麻烦。 - 两大编程思想
面向对象(oop)
是把事务分解成为一个个对象,然后由对象之间分工与合作。
举例:把大象装进冰箱(面向对象是以对象来划分问题,而不是步骤)
面向过程(pop)
分析出解决问题所需要的步骤,然后用函数把这些步骤一步一步实现,使用的时候再一个一个的依次调用就可以了。
举例:把大象装进冰箱(面向过程,就是按照我们分析好的步骤,按照步骤解决问题)
对比
面向过程:(简单,步骤明确的项目)
优点:性能比面向对象高,适合跟硬件联系很紧密的东西,例如单片机 就采用面向过程编程。
缺点:没有面向对象易维护、易复用、易扩展。
面向对象:(适用大型,多人合作的项目)
优点:易维护、易复用、易扩展,由于面向对象有封装,继承,多态性 的特性,可以设计出低耦合的系统,使系统 更加灵活,更加易于维护。
缺点:性能比面向过程低。
3. 面向对象三大特征
在面向对象程序开发思想中,每个对象都是功能中心,具有明确分工。
面向对象编程具有灵活,代码复用,容易维护和开发的优点,更适合多人合作的大型软件项目。
面向对象的特性:
封装性(封装代码)
继承性(继承父类对象)
多态性(同一个对象,在不同的时刻,体现不同的状态)
- Es5和Es6的区别
ECMAScript5,即ES5,是ECMAScript的第五次修订,于2009年完成标准化
ECMAScript6,即ES6,是ECMAScript的第六次修订,于2015年完成,也称ES2015
ES6是继ES5之后的一次改进,相对于ES5更加简洁,提高了开发效率
ES6新增的一些特性:
-
let声明变量和const声明常量,两个都有块级作用域
ES5中是没有块级作用域的,并且var有变量提升,在let中,使用的变量一 定要进行声明 -
箭头函数
ES6中的函数定义不再使用关键字function(),而是利用了()=>来进行定义
3.模板字符串
模板字符串是增强版的字符串,用反引号(`)标识,可以当作普通字符串使 用,也可以用来定义多行字符串 -
解构赋值
ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值
5.for of循环
for…of循环可以遍历数组、Set和Map结构、某些类似数组的对象、对象,以及字符串
6.import、export导入导出
ES6标准中,Js原生支持模块(module)。将JS代码分割成不同功能的小块进行 模块化,将不同功能的代码分别写在不同文件中,各模块只需导出公共接口 部分,然后通过模块的导入的方式可以在其他地方使用
7.set数据结构
Set数据结构,类似数组。所有的数据都是唯一的,没有重复的值。它本身是一个构造函数
8… 展开运算符
可以将数组或对象里面的值展开;还可以将多个值收集为一个变量
9.修饰器 @
decorator是一个函数,用来修改类甚至于是方法的行为。修饰器本质就是编译时执行的函数 -
class 类的继承
ES6中不再像ES5一样使用原型链实现继承,而是引入Class这个概念 -
async、await
使用 async/await, 搭配promise,可以通过编写形似同步的代码来处理异步流程, 提高代码的简洁性和可读性
async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法执行完成 -
promise
Promise是异步编程的一种解决方案,比传统的解决方案(回调函数和事件)更合理、强大 -
Symbol
Symbol是一种基本类型。Symbol 通过调用symbol函数产生,它接收一个可选的名字参数,该函数返回的symbol是唯一的 -
Proxy代理
使用代理(Proxy)监听对象的操作,然后可以做一些相应事情 -
类和对象
面向对象更加贴合我们的实际生活,可以使用面向对象来描述现实中的事务,但是事务要分为具体的事物和抽象的事物。
比如:手机(举例)
类----抽象的
对象----特指的
类是对象的抽象,而对象是类的具体实例
类和对象的区别:
- 类抽象了对象的公共部分,它泛指某一大类(class)
- 对象特指某一个,通过类实例化一个具体的对象
类也就是class
-
变量声明
var声明变量可以重复声明,而let不可以重复声明
var是不受限于块级的,而let是受限于块级
var会与window相映射(会挂一个属性),而let不与window相映射
var可以在声明的上面访问变量,而let有暂存死区,在声明的上面访问变量会报错
const声明之后必须赋值,否则会报错
const定义不可变的量,改变了就会报错
const和let一样不会与window相映射、支持块级作用域、在声明的上面访问变量会报错 -
使用解构赋值,实现两个变量的值的交换
解构赋值:es6允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构
解构表示分解结构,赋值表示给变量赋值
使用es5给变量赋值: -
箭头函数,使用箭头函数应注意什么?
(1)用了箭头函数,this就不是指向window,而是父级(指向是可变的)
(2)不能够使用arguments对象
(3)不能用作构造函数,这就是说不能够使用new命令,否则会抛出一个错误 -
ES6的模板字符串有哪些新特性?并实现一个类模板字符串的功能
基本的字符串格式化。
将表达式嵌入字符串中进行拼接。
用${}来界定在ES5时我们通过反斜杠()来做多行字符串或者字符串一行行拼接。
ES6反引号(``)就能解决类模板字符串的功能
使用
使用js输出的模板时候,会使用到大量的引号和加号,
Es6中提供了新的方法,模版字符串,用`(反引号)标识,用${}将变量括起来
模板字符串中还可以进行函数调用
- 介绍下 Set、Map的区别?
Set属于一种数据结构,
应用场景Set用于数据重组,Map用于数据储存Set:
(1)成员不能重复
(2)只有键值没有键名,类似数组
(3)可以遍历,方法有add, delete,has
Map:
(1)本质上是健值对的集合,类似集合
(2)可以遍历,可以跟各种数据格式转换
Set方法集合:
add 添加值
delete 删除值
has 返回一个布尔值
clear 清空
Map方法集合:
set(key, value):如果key已经有值,则键值会被更新,否则生成该键
get(key):读取key对应的键值,若找不到key,则返回undefined
has(key):返回一个布尔值,表示某个键是否在当前Map对象之中
delete(key):删除某个键,成功则返回true
clear():清除所有的成员,没有返回值
11. Promise构造函数是同步执行还是异步执行,那么 then 方法呢?
promise构造函数是同步执行的,then方法是异步执行的
基本概念:
Promise代表异步操作
三种状态:
pending(进行中)、fulfilled(已成功)和rejected(已失败)
特点:
(1)只有异步操作可以决定当前处于的状态,并且任何其他操作无法改变这个状态;
(2)一旦状态改变,就不会在变。状态改变的过程只可能是:从pending变为fulfilled和从pending变为rejected。如果状态发生上述变化后,此时状态就不会在改变了,这时就称为resolved
基本用法:
详见实例
- promise有几种状态,什么时候会进入catch?
reject 是用来抛出异常,catch 是用来处理异常
reject 是 Promise 的方法,而 catch 是 Promise 实例的方法
reject后的东西,一定会进入then中的第二个回调,如果then中没有写第二个回调,则进入catch
网络异常(比如断网),会直接进入catch而不会进入then的第二个回调 - 说一下es6的导入导出模块
要想使用es6的导入导出模块,必须给导入的script标签设置type类型为module
导入导出的功能是模块化,使你的js功能独立,这样有利于你的代码解耦,提高代码的复用性
export到处
import导入