JS常见面试题记录

面试题1：深拷贝

//=>浅克隆：只复制对象或者数组的第一级内容
//=>深克隆：克隆后数组的每一级都和原始数组没有关联
//那么请说出，浅克隆都怎么去实现，如何实现深度克隆
let obj = {
    a: 100,
    b: [10, 20, 30],
    c: {
        x: 10
    },
    d: /^\d+$/
};

let arr = [10, [100, 200], {
    x: 10,
    y: 20
}];
/*
let clone = JSON.parse(JSON.stringify(obj))
这种方式存在一些问题：某些格式的数据在转换为JSON字符串和JSON对象的时候会出现问题
正则-》空对象
BigInt-》会报错
日期-》转为字符串后就转不回来了
Symbol/undefined/function -》直接没有了
*/

function cloneDeep(obj){
	// 验证类型
	if (obj === null) return null
	if (typeof obj !== 'object') return obj
	if (obj instanceof RegExp) return new RegExp(obj)
	if (obj instanceof Date) return new Date(obj)
	// 对于对象好喝数组我们再进行循环克隆
	let clone = new obj.constructor()
	Objects.keys(obj).forEach(key => {
		colne[key] = cloneDeep(obj[key]) // bug:在队形循环引用中会出现问题（死递归），解决：把每一个克隆的对象和数组建立标识，后期递归处理添加标识
	})
	return clone
}

面试题2：任务队列

js中的同步异步编程
1.浏览器值分配一个线程，用来执行js代码（一次只能做一个事情=》同步）
2.任务队列机制：遇到需要异步执行的任务（客户端：定时器、事件绑定、AJAX、Promise、await），先把任务放置在任务队列中，接下来继续执行同步任务，当同步任务都执行完，浏览器渲染线程闲下来了，再去任务队列中，按照指定的顺序，把异步任务拿出来执行
=》 Event loop
=》 Event Queue： 微任务 宏任务（顺序：先找微任务，再找宏任务）

// 下面是promise处理的顺序机制
new Promise((resolve,reject)=>{
	// 立即把这个函数执行
	resolve() // 异步：方法执行，不是立即通知then中存放的方法执行，而是一个异步的，等一些事情处理完，再把promise状态改变，并且通知指定的方法执行
}).then(result => {},reason => {})

// async 语法糖执行机制
async function func(){
// 先把func2执行，看他的返回结果：await必须保证返回的是成功状态，才会把下面的代码执行
// 异步：体现在await下面代码先不执行，等func2() 返回成功才执行
await func2()
console.log('ok')
// 默认返回promise实例
}

// 题目
async function async1() {
    console.log('async1 start'); // => 2
    await async2();
    console.log('async1 end'); // ==》 6
}
async function async2() {
    console.log('async2'); // => 3
}
console.log('script start'); // => 1
setTimeout(function () {
    console.log('setTimeout'); // ==》 8
}, 0)
async1();
new Promise(function (resolve) {
    console.log('promise1'); // => 4
    resolve();
}).then(function () {
    console.log('promise2'); // ==》 7
});
console.log('script end');  // => 5


任务队列
	微任务：1.Await(下面代码)  2.resolve(通知then中的第一个方法执行)
	宏任务：1.定时器（5ms执行代码）

1 2 3 4 5 顺序执行完毕，打印数据之后，浏览器渲染线程空闲下来了，就去任务队列中找任务
正常微任务执行顺序：谁先放置谁先执行
6 7 8打印完，就执行完毕

ps :配套视频讲解发邮件联系 [email protected]