高级前端面试题(来自一位朋友的投稿哟)

Posted 是小橙鸭丶

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了高级前端面试题(来自一位朋友的投稿哟)相关的知识,希望对你有一定的参考价值。

第一题题目:

<script>
let a = new Date() === new Date() 	
let b = new Date("2020-08-25") == new Date("2020-08-25")
let c = new Date("2020-08-25").toString() == new Date("2020-08-25")
let d = new Date() === new Date().toString()
let e = 0.1 + 0.2 === 0.3
let f = 0.1 +0.2 == 0.3
console.log(a,b,c,d,e,f)
</script>

各位老哥思考十秒快速给出答案哦

答案:false false true false false false

第二题题目:

请构造一个obj 使得以下代码打印值为true

let obj = …
let bool = obj.val === 1 && obj.val === 2 &&obj.val === 3
console.log(bool)

分析:在进行判断时会获取val值,但是此时obj内部并没有一个val值。所以我们在obj内部用get方法返回一个参数,每次返回加一,就可以满足判断条件

即obj应该构造成这样
let obj = {
	_val:1,
	get val(){ //重点
		return this._val ++
	}
}

let bool = obj.val === 1 && obj.val === 2 &&obj.val === 3
console.log(bool) //结果打印true

第三题题目:

<script>
async function async1(){
	console.log('1')
	await async2()
	console.log('2')
}

async function async2(){
	await new Promise((resolve)=>{
		console.log('3')
		setTimeout(()=>{
			console.log('4')
			resolve()
		})
	})
	console.log('5')
}
console.log('6')
setTimeout(() => {
	console.log('7')
})
async1()

new Promise((resolve) => {
	console.log('8')
	resolve()
}).then(() =>{
	console.log('9')
})
console.log('10')
</script>

答案: 6 1 3 8 10 9 7 4 5 2 (有没有答对呀)
以下是小弟的分析
1.首先打印 6 这是毋庸置疑的 然后遇到定时器7 先把它加入宏任务队列中
2. 执行async1函数,则执行打印 1 接下来进入async2函数
3.执行promise函数 打印3 遇到定时器4 加入宏任务队列 由于async2阻塞了后面代码的执行
4.则执行 new Promise函数 打印了8 resolve()一个状态
5.继续执行同步函数console.log(‘10’),打印了10
6.我们先了解一下
微任务包括:promise.then(注意是promise.then) , process.nextTick等
宏任务包括: script(读取 执行script代码也算一种任务) setTimeout setInterval等
我们微任务宏任务同时存在时是先执行完所有的微任务再执行第一个宏任务 所以先执行微任务promise.then 打印 9
7.接下来执行第一个宏任务 打印7
8.然后执行第二个宏任务 打印4
9.promise函数执行完就往下走 所以接下来打印 5
10.最后打印2哟

补个小知识点:手写一个promise

<script>
function MyPromise(fn){
	let self = this
	let status = 'pending'
	let value = undefined
	let reason = undefined
	
	//成功执行的函数
	function resolve(value){
		if(status == 'pending'){
			self.status = 'resolve'
			self.value = value
		}
	}
	//失败执行的函数
	function reject(reason){
		if(status == 'pending'){
			self.status = 'reject'
			self.reason = reason
		}
	}
	
	try{
		fn(resolve,reject)
	}catch(e){
		reject(e)
	}
	//添加then方法
	MyPromise.prototype.then = (resolve,reject) => {
		if(this.status == 'resolve'){
			resolve(this.value) //成功状态下
		}
		if(this.status == 'reject'){
			reject(this.reason)  //失败状态下
		}
	}
	
}
//测试自己所写的promise
let promise2 = new MyPromise((resolve,rejeect)=>{
	resolve(520)
})
promise2.then(res=>{
	console.log(res) //打印520
})
</script>

第四题题目:什么是节流/防抖,请实现节流防抖函数

节流:是指在一个规定的单位时间内,只能有一次触发事件的监听回调,如果在一个单位时间内某事件被多次触发,只能有一次生效
防抖:是指事件被触发n秒后执行的回调,如果在这n秒内再次被触发,则重新计时(用在点击事件上)

防抖代码:

<script>
//防抖
function debounce(fn,delay){
	var timer = null
	return function(){
		var args = arguments
		//如果存在定时器
		if(timer){
			clearTime(timer)//清除定时器
			timer = null
		}
		timer = setTimeout(()=>{
			fn.apply(this,args)
		},delay)
	}
}
</script>

节流代码:

<script>
//节流
function throttle(fn,delay){
	var parTime = Date.now()
	return function(){
		vat _this = this
		var args = arguments
		var nowTime = Date.now()
		
		if(nowTime - parTime >= delay){
			parTime = Date.now()
			return fn.apply(_this,args)
		}
	}
}
</script>

第五题题目:请谈谈你对node.js的理解

1.运行原理
2.优缺点
3.应用场景
4.对前端工程师的意义
5.你用node.js做过什么,未来想用node.js做什么
(这个我也不会呀)

以上就是面试的五道题

以上是关于高级前端面试题(来自一位朋友的投稿哟)的主要内容,如果未能解决你的问题,请参考以下文章

前端面试题之手写promise

来自大厂 300+ 道前端面试题大全附答案(整理版)+前端常见算法面试题~~最全面详细

卧槽!无意中发现了一位清华大佬的 C++ 笔记

在CSDN学到了!粉丝投稿:花 2 个月备战字节,3 轮面试拿下总包 60W Offer~

Java进阶之光!2021必看-Java高级面试题总结

2022年Java面试题整理归纳(持续更新)