cvte前端笔试
[题目1] node中间件能执行的任务
A 打印请求 B 将POST请求和表单提交的查询字符串转为对象 C 向web端返回静态文件 D 调用下一个中间件
中间件规定了http请求细节处理的办法，是http请求发起到响应结束过程中的处理逻辑。 每个中间件都可以访问其被附加到的所有路由的 HTTP 请求和响应
中间件一般不处理请求和响应，因此不会打印请求 A错误
中间件会处理输入的数据，B正确
同A C错误
中间件有next()方法，可以调用下一个中间件 D正确
简单实现中间件
const m1 = (req, res, next) => {
console.log('m1 run')
next()
}
const m2 = (req, res, next) => {
console.log('m2 run')
next()
}
const m3 = (req, res, next) => {
console.log('m3 run')
next()
}
const middleware = [m1,m2,m3]
function useApp(req,res){
const next = () =>{
const middleFnc = middleware.shift()
if(middleFnc){
middleFnc(req,res,next)
}
}
next()
}
[题目2]定时器输出
for(var i = 1;i <= 3;i++){
setTimeout(() =>{
console.log(i)
},0)
setTimeout即使延时为0 也会被视为异步操作 而JS是一个单线程的语言，为了解决并发问题引入了主线程及任务队列，任何任务都在主线程上，一旦任务有异步操作，则入队到任务队列中，在主线程的执行栈执行完成后，再调用任务队列。
因此上面的代码实际上每一个定时器都被放置到了任务队列上，主线程上是var i = 1 i < 3 i++
同理的一道题，同样考察Event loop
setTimeout(function () {
console.log(1);
});
new Promise(function(resolve,reject){
console.log(2)
resolve(3)
}).then(function(val){
console.log(val);
})
console.log(4);
输出结果2 4 3 1 setTimeout
setTimeout因为是异步操作，被加入到任务队列，只有在主线程的执行栈清空，并清空任务队列的微任务，才会被加入到执行栈中
顺序执行，Promise被实例化后就开始执行，输出2
Promise.then是微任务，会在执行栈的宏任务全部执行结束后执行
顺序执行，输出4
宏任务完成，执行微任务 输出3
此时异步操作setTimeout加入到执行栈中，输出1
接本题，如何正常打印 1 2 3 ？
由于var没有块级作用域，因此可以使用let
for(let i = 1;i <= 3;i++){
setTimeout(() =>{
console.log(i)
},0)
使用立即执行函数，构建闭包，同样生成块级作用域
for (var i = 1; i<= 3; i++){
((i)=>{
setTimeout(() => {
console.log(i)
},1000);
})(i)
}
使用setTimeout第三个参数
// setTimeout后面可以有多个参数，都是向第一个参数即函数所传的实参
for (var i = 1; i<= 3; i++){
setTimeout((i) => {
console.log(i)
}, 1000,i);
}
[题目3] 浏览器中输入一个地址，什么服务把地址解析为IP地址
DNS
-
如果查询不到缓存
- 浏览器会向DNS服务器发送请求，解析url的域名获取对应IP,DNS基于UDP
-
如果去查询缓存
- 查询浏览器缓存
- 查询操作系统缓存
- 查询路由器缓存
- 查询ISP缓存
[题目4] 某服务通过CORS实现跨域访问，若服务器设置的Header为Access Control Allow Origin: * ，能够在请求中携带Cookie
不能
跨域
协议、域名、端口有任何一个不同，都被视为不同的域，发起请求即算跨域
如果前端需要携带cookie 需要设置 withCredentials: true 但此时如果有跨域问题，后端设置Access Control Allow Origin的时候不能设置为 * ，可以设置项目的根域名
如果设置Access Control Allow Origin 为 * 则 withCredentials: false
[题目5] var arr = [1, 2, 3] 下面输出为true的有
A Array.isArray(arr)
arr是Array的实例，必然正确
B typeof arr === 'array'
错误 arr作为引用类型 实际是一个对象 Object
C Object.prototype.toString.call(arr) === '[object Array]'
与A类似 正确
D arr instanceof Array
instanceof 判断一个引用对象是否是一个构造函数的实例 正确
[题目6] 对于li这个节点，下列哪个css选择器优先级最高 <li id="app" class="cnt"></li>
本质是计算权重 内联样式 > ID 选择器 > 伪类 > 属性选择器 > 类选择器 > 元素（类型）选择器 > 通用选择器
li.cnt
1 + 10
li.cnt:hover
1 + 10 + 10
li#app
1 + 100
#app.cnt
100 + 10