2024年Web前端最新ES6学习笔记之Promise对象_对象的值是promise函数，字节跳动Web前端岗经典面试真题

总结

=============================================================

从转行到现在，差不多两年的时间，虽不能和大佬相比，但也是学了很多东西。我个人在学习的过程中，习惯简单做做笔记，方便自己复习的时候能够快速理解，现在将自己的笔记分享出来，和大家共同学习。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

个人将这段时间所学的知识，分为三个阶段：

第一阶段：HTML&CSS&JavaScript基础

第二阶段:移动端开发技术

第三阶段:前端常用框架

• 推荐学习方式：针对某个知识点，可以先简单过一下我的笔记，如果理解，那是最好，可以帮助快速解决问题；如果因为我的笔记太过简陋不理解，可以关注我以后我还会继续分享。

• 大厂的面试难在，针对一个基础知识点，比如JS的事件循环机制，不会上来就问概念，而是换个角度，从题目入手，看你是否真正掌握。所以对于概念的理解真的很重要。

}).then((data)=>{
console.log(data);
return duwenjian(“./data/3.txt”);
}).then((data)=>{
console.log(data);
})

回调黑洞问题解决了，将原来的“嵌套模式”变为“队列模式”  
 可以认为这是一根语法糖，因为没有改变原理，只改变了写法。


Promise实例生成以后，可以用then方法分别指定resolved状态和rejected状态的回调函数。then方法可以接受两个回调函数作为参数。第一个回调函数是Promise对象的状态变为resolved时调用，第二个回调函数是Promise对象的状态变为rejected时调用。其中，第二个函数是可选的，不一定要提供。这两个函数都接受Promise对象传出的值作为参数。

duwenjian(“./data/1.txt”).then((data)=>{
console.log(data);
},()=>{
console.log(“读取失败”)
})

1. l这个函数返回一个Promise对象，这个对象是构造函数，ES6新增的。
2. Promise一定是某个函数的唯一返回值，Promise自己调用没有任何意义，必须当做一个函数的返回值才有意义！本例中，Promise就是duwenjian函数的返回值！！
3. 这个函数中，一定是一个异步语句，我们的案例是fs.readFile()
4. 异步语句的成功，要将数据通过resolve(数据)传出去，这个数据将成为then里面的data。
5. 异步语句的失败，要将错误信息通过reject(err)传出去，这个数据将成then里面的第二个data。
6. Promise的实例拥有then()方法，也就是说，then方法是定义在原型对象。


**3.ES7的async和await**   
 ES6中的Promise对象，解决了回调黑洞，但实际上又产生了火车黑洞，then()过多不好看。  
 所以ES7中提出了async/await可以让我们用同步的方式写异步，不写then了。  
 async表示异步，await表示异步等待。


注意：  
 1）必须写那个return Promise对象的函数；  
 2）await不能裸用，必须写在async字样的函数里；  
 3）所有异步语句前都要加await，但是后面的函数必须return Promise实例的函数。


Nodejs读文件：

var fs = require(“fs”);
function duwenjian(url){
return new Promise(function(resolve,reject){
fs.readFile(url, (err,data)=>{
if(err){
reject(); //失败执行
return;
}
resolve(data.toString()); //成功执行
})
})
}

async function main(){
var data1 = await duwenjian(“data/1.txt”).then(data=>data);
var data2 = await duwenjian(“data/2.txt”).then(data=>data);
var data3 = await duwenjian(“data/3.txt”).then(data=>data);
console.log(data1)
console.log(data2)
console.log(data3)
};

main();

任何一个函数都可以在function之前加async这个关键字，表示这个函数中出现了await。  
 await后面只能跟着一个返回promise对象的实例的函数的调用，then里面的函数的返回值将自动被等号左边接收


**使用async/await的哲学：用写同步语句的感觉，去写异步语**句。  
 async写在function这个之前，await写在异步语句之前  
 await表示等待后面的操作执行完毕，再执行下一行代码。


**4 ES8的fetch()**  
 ES8中继续提出了fetch方法，这个方法发出ajax请求，返回Promise的实例


**fetch()函数是ES8中提出的新的特性，它：**  
 1）能够发出Ajax请求，并且请求机理不是xhr，而是新的机理；  
 2）天生可以跨域，但是需要设置头，服务器可以写脚本识别这个头部判断是否应该拒绝它；  
 3） fetch()返回Promise对象，所以可以用then来跟着，then里面的第一个函数就是resolve，这个resolve的返回值将自动被await等号左边的变量的接收。

async function main(){
var data1 = await fetch(“data/1.json”).then(data=>data.json());
var data2 = await fetch(“data/2.json”).then(data=>data.json());
var data3 = await fetch(“data/3.json”).then(data=>data.json());
console.log(data1)
console.log(data2)
console.log(data3)

数据结构与算法

这一块在笔试、面试的代码题中考核较多，其中常考的数据结构主要有：数组、链表、队列、栈、Set、Map、哈希表等，不同数据结构有不同的方法以及储存原理，这些算是技术岗的必备知识。算法部分主要分为两大块，排序算法与一些其他算法题。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

排序算法根据考频高低主要有：快速排序、归并排序、堆排序、冒泡排序、插入排序、选择排序、希尔排序、桶排序、基数排序、Timsort这十种，这类考核点要么是算法的时间、空间复杂度、稳定度，要么是直接手写代码，故在理解算法原理的同时，对JS语言版的排序算法代码也要加强记忆。

• 二叉树层序遍历
• B 树的特性，B 树和 B+树的区别
• 尾递归
• 如何写一个大数阶乘？递归的方法会出现什么问题？
• 把多维数组变成一维数组的方法
• 知道的排序算法 说一下冒泡快排的原理
• Heap 排序方法的原理？复杂度？
• 几种常见的排序算法，手写
• 数组的去重，尽可能写出多个方法
• 如果有一个大的数组，都是整型，怎么找出最大的前 10 个数
• 知道数据结构里面的常见的数据结构
• 找出数组中第 k 大的数组出现多少次，比如数组【1，2， 4，4，3，5】第二大的数字是 4，出现两次，所以返回 2
• 合并两个有序数组
• 给一个数，去一个已经排好序的数组中寻找这个数的位 置（通过快速查找，二分查找）

见的数据结构

• 找出数组中第 k 大的数组出现多少次，比如数组【1，2， 4，4，3，5】第二大的数字是 4，出现两次，所以返回 2
• 合并两个有序数组
• 给一个数，去一个已经排好序的数组中寻找这个数的位 置（通过快速查找，二分查找）

[外链图片转存中…(img-9LnBazWJ-1715420571349)]