Promise链式调用
上一篇我们实现了通过promise的方式实现获取国家基本信息,本次我们来使用promise链式调用来实现邻国的展现
- 首先,我们从第一个国家中获取到邻国的国家代码名称
const neighbour = data[0].borders[0];
- 然后我们通过fetch来获取邻国信息;
return fetch(`https://restcountries.com/v2/alpha/${neighbour}`);
- 和之前一样,用then方法将返回的json数据转化为JavaScript对象,然后把接受到的数据交给renderCountry去处理
.then(response => response.json());.then(data => renderCountry(data, 'neighbour'));
完整代码如下所示
const getCountryData = function (country) {fetch(`https://restcountries.com/v2/name/${country}`).then(response => response.json()).then(data => {renderCountry(data[0]);const neighbour = data[0].borders[0];if (!neighbour) return;return fetch(`https://restcountries.com/v2/alpha/${neighbour}`);}).then(response => response.json()).then(data => renderCountry(data, 'neighbour'));
};
getCountryData('Russia');
思考部分
promise真的摆脱了回调地狱吗?
promise确实摆脱不了回调函数,但是确实用很多的方式去优化了回调地狱;
-
传统的回调函数是使用嵌套的方式,多层嵌套的话,确实错误比较难于捕获和处理;而像上述的链式调用,确实可以使用catch等方式更好的捕获到错误;
-
就个人感觉而言,promise并没有真正的摆脱回调地狱,只是更换了一种新的形式,多层嵌套是回调地狱,多个线性调用也未必不是吧;只是像对比一下,确实线性的思维可能更适合人类的想法;
-
primise的本质就是状态机,使用状态机可以是我们获取数据由一个状态转变为另一个状态,这就是链式调用,和红绿黄灯一样,它也是一种链式调用;