diff --git a/05-JavaScript:异步编程和Ajax/01-服务器分类及PHP入门.md b/05-JavaScript基础:异步编程和Ajax/01-服务器分类及PHP入门.md similarity index 100% rename from 05-JavaScript:异步编程和Ajax/01-服务器分类及PHP入门.md rename to 05-JavaScript基础:异步编程和Ajax/01-服务器分类及PHP入门.md diff --git a/05-JavaScript:异步编程和Ajax/02-Ajax入门和发送http请求.md b/05-JavaScript基础:异步编程和Ajax/02-Ajax入门和发送http请求.md similarity index 100% rename from 05-JavaScript:异步编程和Ajax/02-Ajax入门和发送http请求.md rename to 05-JavaScript基础:异步编程和Ajax/02-Ajax入门和发送http请求.md diff --git a/05-JavaScript:异步编程和Ajax/03-函数封装-Ajax发送http请求(get&post).md b/05-JavaScript基础:异步编程和Ajax/03-函数封装-Ajax发送http请求(get&post).md similarity index 100% rename from 05-JavaScript:异步编程和Ajax/03-函数封装-Ajax发送http请求(get&post).md rename to 05-JavaScript基础:异步编程和Ajax/03-函数封装-Ajax发送http请求(get&post).md diff --git a/05-JavaScript:异步编程和Ajax/04-同源和跨域.md b/05-JavaScript基础:异步编程和Ajax/04-同源和跨域.md similarity index 100% rename from 05-JavaScript:异步编程和Ajax/04-同源和跨域.md rename to 05-JavaScript基础:异步编程和Ajax/04-同源和跨域.md diff --git a/05-JavaScript:异步编程和Ajax/05-模板引擎.md b/05-JavaScript基础:异步编程和Ajax/05-模板引擎.md similarity index 100% rename from 05-JavaScript:异步编程和Ajax/05-模板引擎.md rename to 05-JavaScript基础:异步编程和Ajax/05-模板引擎.md diff --git a/06-JavaScript基础:ES6语法/10-Promise入门详解.md b/06-JavaScript基础:ES6语法/10-Promise入门详解.md index 80692d1..53ceb0d 100644 --- a/06-JavaScript基础:ES6语法/10-Promise入门详解.md +++ b/06-JavaScript基础:ES6语法/10-Promise入门详解.md @@ -108,6 +108,7 @@ $.ajax({ 在 ES5 中,当进行多层嵌套回调时,会导致代码层次过多,很难进行后续维护和二次开发;而且会导致**回调地狱**的问题。ES6 中的 Promise 就可以解决这两个问题。 当然, Promise 的更强大功能,不止于此。我们来一探究竟。 + ### Promise 的介绍和优点 ES6 中的 Promise 是异步编程的一种方案。从语法上讲,Promise 是一个对象,它可以获取异步操作的消息。 @@ -152,7 +153,7 @@ myPromise() (3)通过 promise.then() 处理返回结果(这里的 `promise` 指的是 Promise 实例)。 -Promise的精髓在于**对异步操作的状态管理**。 +Promise 的精髓在于**对异步操作的状态管理**。 接下来,我们来具体看看, promise 的代码是怎么写的。 @@ -355,6 +356,28 @@ promise.then( ); ``` +**几点补充**: + +(1)Promise 的状态一旦改变,就不能再变。 + +(2)Promise 的状态改变,是不可逆的。 + +为了解释这两点,我们来看个例子: + +```js +const p = new Promise((resolve, reject) => { + resolve(1); // 代码执行到这里时, promise状态是 fulfilled + reject(2); // 尝试修改状态为 rejected,是不行的 +}); + +p.then((res) => { + console.log(res); +}).catch((err) => { + console.log(err); +``` + +上方代码的打印结果是1,而不是2。 + ## 如何封装异步操作为 promise ### Promise 封装异步任务 @@ -478,10 +501,10 @@ const request = require('request'); // Promise 定义接口 function request1() { return new Promise((resolve, reject) => { - request('https://www.baidu.com', (response) => { - if (response.retCode == 200) { - // 这里的 response 是接口1的返回结果 - resolve('request1 success' + response); + request('https://www.baidu.com', res => { + if (res.retCode == 200) { + // 这里的 res 是接口1的返回结果 + resolve('request1 success' + res); } else { reject('接口请求失败'); } @@ -490,10 +513,10 @@ function request1() { } request1() - .then((res1) => { + .then((res) => { // 接口1请求成功后,打印接口1的返回结果 - console.log(res1); - return request2(); + console.log(res); + // return request2(); }) .catch((e) => { // 从 reject 获取异常结果 diff --git a/06-JavaScript基础:ES6语法/11-Promise的常见用法和API.md b/06-JavaScript基础:ES6语法/11-Promise的常见用法和API.md index b8bd2b4..a4973a7 100644 --- a/06-JavaScript基础:ES6语法/11-Promise的常见用法和API.md +++ b/06-JavaScript基础:ES6语法/11-Promise的常见用法和API.md @@ -25,10 +25,10 @@ // Promise 封装接口1 const request1 = function () { const promise = new Promise((resolve, reject) => { - request('https://www.baidu.com', function (response) { - if (response.retCode == 200) { - // 这里的 response 是接口1的返回结果 - resolve('request1 success' + response); + request('https://www.baidu.com', res => { + if (res.retCode == 200) { + // 这里的 res 是接口1的返回结果 + resolve('request1 success' + res); } else { reject('接口请求失败'); } @@ -41,10 +41,10 @@ // Promise 封装接口2 const request2 = function () { const promise = new Promise((resolve, reject) => { - request('https://www.jd.com', function (response) { - if (response.retCode == 200) { - // 这里的 response 是接口2的返回结果 - resolve('request2 success' + response); + request('https://www.jd.com', res => { + if (res.retCode == 200) { + // 这里的 res 是接口2的返回结果 + resolve('request2 success' + res); } else { reject('接口请求失败'); } @@ -57,10 +57,10 @@ // Promise 封装接口3 const request3 = function () { const promise = new Promise((resolve, reject) => { - request('https://www.taobao.com', function (response) { - if (response.retCode == 200) { - // 这里的 response 是接口3的返回结果 - resolve('request3 success' + response); + request('https://www.taobao.com', res => { + if (res.retCode == 200) { + // 这里的 res 是接口3的返回结果 + resolve('request3 success' + res); } else { reject('接口请求失败'); } diff --git a/07-JavaScript进阶/01-var、let、const的区别.md b/07-JavaScript进阶/01-var、let、const的区别.md index d29676d..776d06a 100644 --- a/07-JavaScript进阶/01-var、let、const的区别.md +++ b/07-JavaScript进阶/01-var、let、const的区别.md @@ -177,6 +177,11 @@ const obj = { obj.name = 'vae'; // 对象里的 name 属性可以被修改 ``` +因为 变量名 obj 是保存在**栈内存**中的,它代表的是对象的引用地址,它是基本数据类型,无法被修改。但是 obj 里面的内容是保存在**堆内存**中的,它是引用数据类型,可以被修改。 + +**总结**:用 const 声明的常量,它所声明的 + + ## 传值和传址的区别 详见《JavaScript基础/对象简介.md》。 diff --git a/07-JavaScript进阶/Promise的一些题目.md b/07-JavaScript进阶/Promise的一些题目.md new file mode 100644 index 0000000..11096dd --- /dev/null +++ b/07-JavaScript进阶/Promise的一些题目.md @@ -0,0 +1,20 @@ +## Promise 的执行顺序 + +题目 1: + +```js +const p = new Promise((resolve, reject) => { + console.log(1); +}); + +console.log(2); +``` + +打印结果: + +``` +1 +2 +``` + +我们需要注意的是:Promise里的代码整体,其实是同步任务,会立即执行。 \ No newline at end of file