Promise对象

1. 理解:

* Promise对象: 代表了未来某个将要发生的事件(通常是一个异步操作)

* 有了promise对象, 可以将异步操作以同步的流程表达出来, 避免了层层嵌套的回调函数(俗称'回调地狱')

* ES6的Promise是一个构造函数, 用来生成promise对象的实例

2. 使用promise基本步骤(2步):

* 创建promise对象

let promise = new Promise((resolve, reject) => {

    //初始化promise状态为 pending

  //执行异步操作

  if(异步操作成功) {

    resolve(value);//修改promise的状态为fullfilled

  } else {

    reject(errMsg);//修改promise的状态为rejected

  }

})

* 调用promise的then()

promise.then(function(

  result => console.log(result),

  errorMsg => alert(errorMsg)

))

3. promise对象的3个状态

* pending: 初始化状态

* fullfilled: 成功状态

* rejected: 失败状态

4. 应用:

* 使用promise实现超时处理

* 使用promise封装处理ajax请求

let request = new XMLHttpRequest();

request.onreadystatechange = function () {

}

request.responseType = 'json';

request.open("GET", url);

request.send();

5. promise过程分析:

class

1. 通过class定义类/实现类的继承

2. 在类中通过constructor定义构造方法

3. 通过new来创建类的实例

4. 通过extends来实现类的继承

5. 通过super调用父类的构造方法

6. 重写从父类中继承的一般方法

字符串扩展

1. includes(str) : 判断是否包含指定的字符串

2. startsWith(str) : 判断是否以指定字符串开头

3. endsWith(str) : 判断是否以指定字符串结尾

4. repeat(count) : 重复指定次数

数值扩展

1. 二进制与八进制数值表示法: 二进制用0b, 八进制用0o

2. Number.isFinite(i) : 判断是否是有限大的数

3. Number.isNaN(i) : 判断是否是NaN

4. Number.isInteger(i) : 判断是否是整数

5. Number.parseInt(str) : 将字符串转换为对应的数值

6. Math.trunc(i) : 直接去除小数部分

数组扩展

1. Array.from(v) : 将伪数组对象或可遍历对象转换为真数组

2. Array.of(v1, v2, v3) : 将一系列值转换成数组

3. find(function(value, index, arr){return true}) : 找出第一个满足条件返回true的元素

4. findIndex(function(value, index, arr){return true}) : 找出第一个满足条件返回true的元素下标

对象扩展

1. Object.is(v1, v2)

* 判断2个数据是否完全相等

2. Object.assign(target, source1, source2..)

* 将源对象的属性复制到目标对象上

3. 直接操作 __proto__ 属性

let obj2 = {};

obj2.__proto__ = obj1;

深度克隆

1、数据类型：

* 数据分为基本的数据类型(String, Number, boolean, Null, Undefined)和对象数据类型

- 基本数据类型特点： 存储的是该对象的实际数据

- 对象数据类型特点： 存储的是该对象在栈中引用，真实的数据存放在堆内存里

2、复制数据

- 基本数据类型存放的就是实际的数据，可直接复制

let number2 = 2;

let number1 = number2;

- 克隆数据：对象/数组

1、区别： 浅拷贝/深度拷贝

判断： 拷贝是否产生了新的数据还是拷贝的是数据的引用

知识点：对象数据存放的是对象在栈内存的引用，直接复制的是对象的引用

let obj = {username: 'kobe'}

let obj1 = obj; // obj1 复制了obj在栈内存的引用

2、常用的拷贝技术

1). arr.concat(): 数组浅拷贝

2). arr.slice(): 数组浅拷贝

3). JSON.parse(JSON.stringify(arr/obj)): 数组或对象深拷贝, 但不能处理函数数据

4). 浅拷贝包含函数数据的对象/数组

5). 深拷贝包含函数数据的对象/数组

Set和Map数据结构

1. Set容器 : 无序不可重复的多个value的集合体

* Set()

* Set(array)

* add(value)

* delete(value)

* has(value)

* clear()

* size

2. Map容器 : 无序的 key不重复的多个key-value的集合体

* Map()

* Map(array)

* set(key, value)//添加

* get(key)

* delete(key)

* has(key)

* clear()

* size

for_of循环

for(let value of target){}循环遍历

1. 遍历数组

2. 遍历Set

3. 遍历Map

4. 遍历字符串

5. 遍历伪数组

ES7

1. 指数运算符(幂): **

2. Array.prototype.includes(value) : 判断数组中是否包含指定value

Vue 的基本认识

介绍描述

1）渐进式 JavaScript 框架

2）作者: 尤雨溪(一位华裔前 Google 工程师)

3）作用: 动态构建用户界面

 Vue 的特点

1）遵循 MVVM 模式

2）编码简洁, 体积小, 运行效率高, 适合移动/PC 端开发

3）它本身只关注 UI, 可以轻松引入 vue 插件或其它第三方库开发项目

1.1.4. 与其它前端 JS 框架的关联

1）借鉴 angular 的模板和数据绑定技术

2）借鉴 react 的组件化和虚拟 DOM 技术

Vue 扩展插件

1）vue-cli: vue 脚手架

2）vue-resource(axios): ajax 请求

3）vue-router: 路由

4）vuex: 状态管理

5）vue-lazyload: 图片懒加载

6）vue-scroller: 页面滑动相关

7）mint-ui: 基于 vue 的 UI 组件库(移动端)

8）element-ui: 基于 vue 的 UI 组件库(PC 端)