06-Promise的链式调用
title: 06-Promise的链式调用publish: true
Promise 的链式调用：处理多次 Ajax 请求【重要】实际开发中，我们经常需要同时请求多个接口。比如说：在请求完接口1的数据data1之后，需要根据data1的数据，继续请求接口 2，获取data2；然后根据data2的数据，继续请求接口 3。
换而言之，现在有三个网络请求，请求 2 必须依赖请求 1 的结果，请求 3 必须依赖请求 2 的结果，如果按照往常的写法，会有三层回调，会陷入“回调地狱”。
这种场景其实就是接口的多层嵌套调用。有了 Promise 之后，我们可以把多层嵌套调用按照线性的方式进行书写，非常优雅。也就是说：Promise 可以把原本的多层嵌套写法改进为链式写法。
ES5 中的传统写法// 封装 ajax 请求：传入回调函数 success 和 failfunction ajax(url, success, fail) { var xmlhttp = new XMLHttpRequest(); xmlhttp.open('GET', url); ...
06-基本数据类型：Null 和 Undefined
title: 06-基本数据类型：Null 和 Undefinedpublish: true
很多其他的语言中，只有 null；但 JS 语言中，既有 null，又有 undefined。很多人会弄混，由此觉得 JS 语言很麻烦。其实不然，学习完这篇文章后，你会发现 null 和 undefined 的区别很容易理解。
Null：空对象null 专门用来定义一个空对象（例如：let a = null）。
如果你想定义一个变量用来保存引用类型，但是还没想好放什么内容，这个时候，可以在初始化时将其设置为 null。
比如：
let myObj = null;cosole.log(typeof myObj); // 打印结果：object
补充：
Null 类型的值只有一个，就是 null。比如 let a = null。
使用 typeof 检查一个 null 值时，会返回 object。
undefinedcase1：变量已声明，未赋值时声明了一个变量，但没有赋值，此时它的值就是 undefined。举例：
let name;console.log(name); / ...
07-Promise的静态方法
title: 07-Promise的静态方法publish: true
Promise 的常用 API 分类Promise 的实例方法实例方法：我们需要先 new 一个 promise 实例对象，然后通过 promise 对象去调用 then、catch、finally方法。这几个方法就是 Promise 的实例方法。
Promise 的自带 API 提供了如下实例方法：
promise.then()：获取异步任务的正常结果。
promise.catch()：获取异步任务的异常结果。
promise.finaly()：异步任务无论成功与否，都会执行。
Promise 的静态方法前面的几篇文章，讲的都是 Promise 的实例方法；今天这篇文章，我们来详细讲一下 Promise 的静态方法。
静态方法：可以直接通过大写的Promise.xxx调用的方法。这里的xxx就称之为静态方法。
Promise 的自带 API 提供了如下静态方法：
Promise.resolve()
Promise.reject()
Promsie.all()：并发处理多 ...
07-this
title: 07-thispublish: true
thisthis的作用
this可以帮我们简化很多代码。比如xiaoming.name、xiaoming.age可以直接写成this.name、this.age。
特别是当我们不知道一个对象是什么，或者这个对象没有名字但又很想调用它的时候，就会使用到this对象。
举例：
遍历DOM对象，绑定click事件，调用当前点击的对象的id，而不是所有对象的id。
代码：
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" <title>Document</title> <style> div { width: 100px; height: 100px; ...
07-typeof和数据类型转换
title: 07-typeof和数据类型转换publish: true
前言变量的数据类型转换：将一种数据类型转换为另外一种数据类型。
通常有三种形式的类型转换：
转换为字符串类型
转换为数字型
转换为布尔型
你会专门把某个数据类型转换成 null 或者 undefined 吗？不会，因为这样做，没有意义。
typeof 运算符
我们先来讲一下 typeof，再讲类型转换。
typeof()表示“获取变量的数据类型”，返回的是小写，语法为：（两种写法都可以）
// 写法1typeof 变量;// 写法2typeof(变量);
typeof 这个运算符的返回结果就是变量的类型。那返回结果的类型是什么呢？是字符串。
返回结果：
typeof 的代码写法
返回结果
typeof 数字
number
typeof 字符串
string
typeof 布尔型
boolean
typeof 对象
object
typeof 方法
function
typeof null
object
typeof undefined
undefined
...
07-剩余参数和扩展运算符
title: 07-剩余参数和扩展运算符publish: true
剩余参数剩余参数允许我们将不确定数量的剩余的元素放到一个数组中。
比如说，当函数的实参个数大于形参个数时，我们可以将剩余的实参放到一个数组中。
传统写法：
ES5 中，在定义方法时，参数要确定个数，如下：（程序会报错）
function fn(a, b, c) { console.log(a); console.log(b); console.log(c); console.log(d);}fn(1, 2, 3);
上方代码中，因为方法的参数是三个，但使用时是用到了四个参数，所以会报错：
ES6 写法：
ES6 中，我们有了剩余参数，就不用担心报错的问题了。代码可以这样写：
const fn = (...args) => { //当不确定方法的参数时，可以使用剩余参数 console.log(args[0]); console.log(args[1]); console.log(args[2]); console.log( ...
08-JavaScript开发积累
title: 08-JavaScript开发积累publish: true
方法的注释方法写完之后（注意，一定要先写完整），我们在方法的前面输入/**，然后回车，会发现，注释的格式会自动补齐。
比如：
/** * 功能：给定元素查找他的第一个元素子节点，并返回 * @param ele * @returns {Element|*|Node} */function getFirstNode(ele){ var node = ele.firstElementChild || ele.firstChild; return node;}
断点调试（1）先让程序运行一遍。
（2）f12，弹出代码调试工具
（3）打断点：
然后刷新页面。
（4）一步步调试，每点击一次，执行一步：
（5）监视变量：
当然，也可以添加变量或者表达式到监视窗口。操作如下：
上图中，选择变量或表达式，然后右键add to watch.
然后监视窗口：
2019-05-20-给数组、对象赋值数组赋值的正确写法：
this.todayList.splice(0, ...
08-字符串、数组、对象的扩展
title: 08-字符串、数组、对象的扩展publish: true
字符串的扩展
下面提到的字符串的几个方法，更详细的内容，可以看《04-JavaScript 基础/内置对象 String：字符串的常见方法.md》。
ES6 中的字符串扩展如下：
includes(str)：判断是否包含指定的字符串
startsWith(str)：判断是否以指定字符串开头
endsWith(str)：判断是否以指定字符串结尾
repeat(count)：重复指定次数
举例如下：
let str = 'abcdefg';console.log(str.includes('a')); //trueconsole.log(str.includes('h')); //false//startsWith(str) : 判断是否以指定字符串开头console.log(str.startsWith('a')); //trueconsole.log(str.startsWith('d ...
08-宏任务和微任务
title: 09-宏任务和微任务publish: true
准备知识
在执行一个 Promise 对象的时候，当走完resolve();之后，就会立刻把 .then()里面的代码加入到微任务队列当中。
任务的一般执行顺序：同步任务 –> 微任务 –> 宏任务。
代码举例举例 1：宏任务和微任务的执行顺序setTimeout(() => { // 宏任务 console.log('setTimeout');}, 0);new Promise((resolve, reject) => { resolve(); console.log('promise1'); // 同步任务}).then((res) => { // 微任务 console.log('promise then');});console.log('qianguyihao'); // 同步任务
打印结果：
pro ...
08-运算符
title: 08-运算符publish: true
我们在本文件夹的第 02 篇里讲到了JS中变量的概念，本篇文章讲一下运算符和表达式。
运算符的定义和分类运算符的定义运算符：也叫操作符，是一种符号。通过运算符可以对一个或多个值进行运算，并获取运算结果。
表达式：由数字、运算符、变量的组合（组成的式子）。
表达式最终都会有一个运算结果，我们将这个结果称为表达式的返回值。
比如：+、*、/、( 都是运算符，而（3+5）/2则是表达式。
比如：typeof 就是运算符，可以来获得一个值的类型。它会将该值的类型以字符串的形式返回，返回值可以是 number、string、boolean、undefined、object。
运算符的分类JS 中的运算符，分类如下：
算数运算符
自增/自减运算符
一元运算符
逻辑运算符
赋值运算符
比较运算符
三元运算符（条件运算符）
下面来逐一讲解。
算数运算符算术运算符：用于执行两个变量或值的算术运算。
常见的算数运算符有以下几种：
运算符
描述
+
加、字符串连接
-
减
*
乘
/
除
%
获取余数（取 ...
09-Promise应用举例
使用 Promise 封装 SetTimeout 定时器代码举例：
// 方法：XX秒后执行指定的代码。这个方法，就是在宏任务（定时器）的执行过程中，创建了一个微任务（resolve）function delaySeconds(delay = 1000) { return new Promise((resolve) => setTimeout(resolve, delay));}delaySeconds(2000) .then(() => { console.log('qiangu'); return delaySeconds(3000); }) .then(() => { console.log('yihao'); });
打印结果：
// 2秒后打印：qiangu// 再等3秒后打印：yihao
09-内置对象扩展：Set数据结构
title: 09-内置对象扩展：Set数据结构publish: true
Set 数据结构Set 数据结构的介绍ES6 提供了 新的数据结构 Set。Set 类似于数组，但成员的值都是唯一的，没有重复的值。
Set 的应用有很多。比如，在 H5 页面的搜索功能里，用户可能会多次搜索重复的关键字；但是在数据存储上，不需要存储重复的关键字。此时，我们就可以用 Set 来存储用户的搜索记录，Set 内部会自动判断值是否重复，如果重复，则不会进行存储，十分方便。
生成 Set 数据结构Set 本身就是一个构造函数，可通过 new Set() 生成一个 Set 的实例。
举例 1：
const set1 = new Set();console.log(set1.size); // 打印结果：0
举例 2、可以接收一个数组作为参数，实现数组去重：
const set2 = new Set(['张三', '李四', '王五', '张三']); // 注意，这个数组里有重复的值// 注意，这里的 set2 并不是数 ...
09-流程控制语句：选择结构（if和switch）
title: 09-流程控制语句：选择结构（if和switch）publish: true
代码块用{}包围起来的代码，就是代码块。
在 ES5 语法中，代码块，只具有分组的作用，没有其他的用途。代码块中的内容，在外部是完全可见的。举例：
{ var a = 2; alert('qianguyihao'); console.log('永不止步');}console.log('a = ' + a);
打印结果：（可以看出，虽然变量 a 是定义在代码块中的，但是在外部依然可以访问）
永不止步a = 2
流程控制语句在一个程序执行的过程中，各条语句的执行顺序对程序的结果是有直接影响的。所以，我们必须清楚每条语句的执行流程。而且，很多时候我们要通过控制语句的执行顺序来实现我们要完成的功能。
流程控制语句分类
顺序结构
选择结构：if 语句、switch 语句
循环结构：while 语句、for 语句
顺序结构按照代码的先后顺序，依次执行。结构图如下： ...
10-Async Await函数详解
title: 08-Async Await函数详解async/await （异步函数）概述async/await 是在 ES8(即ES 2017）中引入的新语法，是另外一种异步编程解决方案。
本质： 是 Generator 的语法糖。
async 的返回值是 Promise 实例对象。
await 可以得到异步结果。
我们在普通的函数前面加上 async 关键字，就成了 async 函数。
什么是语法糖呢？语法糖就是让语法变得更加简洁、更加舒服，有一种甜甜的感觉。
async/await 的基本用法async 后面可以跟一个 Promise 实例对象。代码举例如下：
const request1 = function() { const promise = new Promise(resolve => { request('https://www.baidu.com/xxx_url', function(response) { if (response.retCode == 20 ...
10-流程控制语句：循环结构（for和while）
title: 10-流程控制语句：循环结构（for和while）publish: true
前言循环语句：通过循环语句可以反复的执行一段代码多次。
for 循环for 循环的语法语法：
for(①初始化表达式; ②条件表达式; ④更新表达式){ ③语句...}
执行流程：
①执行初始化表达式，初始化变量（初始化表达式只会执行一次）②执行条件表达式，判断是否执行循环： 如果为true，则执行循环③ 如果为false，终止循环④执行更新表达式，更新表达式执行完毕继续重复②
for 循环举例：
for (var i = 1; i <= 100; i++) { console.log(i);}
上方代码的解释：
for 循环举例for (var i = 1; i < 13; i = i + 4) { console.log(i);}
上方代码的遍历步骤：
程序一运行，将执行var i = 1;这条语句， 所以i的值是1。然后程序会验证一下i < 13是否满足，1<13是真，所以执行一次 ...
