网易2020前端正式批笔试题目解析(待完善)
- 第一题
答案解析:
实际上,这是浏览器的同源策略导致的问题:不允许JS访问跨域的Cookie。
举个例子,现有网站A使用域名a.example.com,网站B使用域名b.example.com,如果希望在2个网站之间共享Cookie(浏览器可以将Cookie发送给服务器),那么在设置的Cookie的时候,必须设置domain为example.com。因此要跨域共享cookie需要双边都设置
1.服务器端使用CROS协议解决跨域访问数据问题时,需要设置响应消息头Access-Control-Allow-Credentials值为“true”。
同时,还需要设置响应消息头Access-Control-Allow-Origin值为指定单一域名(注:不能为通配符“*”)。
2.客户端需要设置Ajax请求属性withCredentials=true
,让Ajax请求都带上Cookie。
故答案应该为B
2.第二题
答案解析:
先序 根左右
中序 左根右
后序 左右根
根据题目要求是,左节点<右节点<根节点,所以按照要求应该是后序排序
- 第三题
答案解析:
第一个数的比较次数为1,第二个数的比较次数为2。。。以此类推第N个数的比较次数为N,所以总的比较次数为1+2+…+N=N(N+1)/2,平均比较次数为(N+1)/2,也即平均查找长度。
4.第四题
答案解析:
这题考查异步,Promise.then是微任务属于异步,而console.log(1)、console.log(4)都是同步,所以先打印1、4。最后看Promise对象。
Promise对象只有三种结果:Pending(进行中)、Fulfilled(已成功)、Rejected(已失败)。对象的状态变化只有两种:从Pending —— Fulfilled(Resolved);从Pending —— Rejected。
构造函数Promise接受一个函数作为参数,并且该函数有两个参数resolve 和 reject。resolve是异步操作成功时调用,reject是异步操作失败时调用。Promise实例对象的then方法中的两个函数分别指定Resolved状态(成功)和Rejected状态(失败)的回调函数。
回到本题:在Promise构造函数中reject()比resolve()先执行,所以已经异步失败,不执行then后面的console.log(2),会执行Rejected状态的回调,即console.log(3),打印3。前面说了Promise对象状态改变只有两种情况,执行reject()后,Promise对象状态变为了Rejected。所以后面的resolve()不会执行。最终结果为:1、4、3。
5.第五题
答案解析:
本题考查this指向问题,以及箭头函数中this指向。
箭头函数中的this始终指向其父级作用域中的this。换句话说,箭头函数会捕获其所在的上下文的this值,作为自己的this值。在箭头函数中调用 this 时,仅仅是简单的沿着作用域链向上寻找,找到最近的一个 this 拿来使用,它与调用时的上下文无关。就是谁调用它无关,始终指向父级作用域
fn1()中,this指向window,所以打印1
fn2()中,fn2是一个箭头函数,this指向作用域链上最近的this,这里为window,所以打印1.
obj.fn1()中,fn1是一个普通函数,this指向obj,即obj.a。所以打印10。
obj.fn2()中,fn2是一个箭头函数,this会继承父级作用域中的this,为window。所以打印1.
本题最终结果:1 、1、10、1
6.第六题
答案解析:
这题考查valueOf()与toString()的区别。
在不重写这两个方法时:
toString()方法:返回对象的字符串表示
valueOf()方法:返回指定对象的原始值。
默认情况,会调用对象的toString()方法。例如:像下面这种情况,只会调用对象的toString()方法,返回对象的字符串表示
var cc = {};
alert(cc);// [object Object]
var fun = function() {} ;
alert(fun);// function() {}
var arr = [1];
alert(arr); // 1
但是在数值运算中,优先调用了valueOf,字符串运算中,优先调用了toString。而’ '+bbb是字符串操作,为啥也是调用valueOf,那是因为,存在操作符,valueOf的优先级高于toString。如果不存在数值运算,和其他操作符,默认调用对象的toString()方法。
例子:
var bbb = {
i: 10,
toString: function() {
console.log('toString');
return this.i;
},
valueOf: function() {
console.log('valueOf');
return this.i;
}
}
alert(bbb);// 10 toString
alert(+bbb); // 10 valueOf
alert(''+bbb); // 10 valueOf
alert(String(bbb)); // 10 toString
alert(Number(bbb)); // 10 valueOf
alert(bbb == '10'); // true valueOf
7.第七题
答案解析:
1 Byte = 8 bit
32 * 8 * 1024 M bit /1024Mbit/s = 256s
8.第八题
答案解析:
箭头函数的this是继承父级作用域的this,而不是指向调用者。
而Js中的call方法相当于把参数传递给this,var f = fun.call({name: ‘foo’})这一句 会将this指向{name: ‘foo’}。
var t1 = f.call({name: ‘bar’})()(),执行f(),之后返回的都是箭头函数,所以直到最后,父级作用域上的this还是指向{name: ‘foo’}。打印:foo。
下面两个同样,因为t1、t2、t3都是箭头函数,使用call()方法不能改变this指向,作用域链上最近的this还是指向{name:‘foo’}。
本题结果:foo foo foo
9.第九题
答案解析:
10.第十题
答案解析:
A/C有争议。查资料得strong是行内元素。
行内元素 :
1.和其他元素都在一行
2.高度、宽度以及内边距都是不可控的(input 除外)
3.宽高就是内容的高度,不可以改变
4.行内元素只能行内元素,不能包含块级元素
块级元素:
1.总是从新的一行开始
2.高度、宽度都是可控的
3.宽度没有设置时,默认为100%
4.块级元素中可以包含块级元素和行内元素
但是块级元素默认情况也是会继承父级的宽高
11.有哪些常见的服务端推送的通信解决方案?它们的优劣分别是什么?(问答题)
个人答案:
三种服务端推送的通信解决方案:
1.基于轮询:
优点:开发简单,客户端实现即可,不需要服务端配合
缺点:大多数情况下无用请求,占用服务端资源
实现方式:客户端每隔一段时间调用接口,无论有没有数据,接口立即返回.
使用场景:不想折腾的开发者,消息及时性要求没那么高,服务器资源资源足。
2.基于长轮询
优点:消息及时,命中率高,消耗服务端资源少
缺点:服务端和客户端需要同时改造,消息会有部分延迟(发生在请求交替之时)
实现方式:客户端在上次请求返回后,在发送下次请求,服务端当有数据或者超时后返回,没有数据时hang住链接(超时时间需要综合考虑服务器性能和及时性做出平衡,有代理的话需要考虑代理对于链接的超时机制)。
使用场景:扫码登录,微信网页端获取消息等。
3.长链接
优点:通信及时,通信模式采用双工,类似于打电话
缺点:服务端和客户端需要同时改造,当链接过多时,消耗服务端资源比较大。
实现方式:客户端和服务端建立长链接,基于http1.1 ,keepalive ,websocket,comet,iframe等,基于socket的需要维持心跳
使用场景:实时性要求很高,银行系统,股票系统等
12.从输入url到页面展现发生了什么?其中在页面渲染以及网络请求响应的性能优化方面,我们分别可以做哪些优化工作?(问答题)
输入url按下回车之后,浏览器会去浏览器缓存中寻找该url的ip;没有的话去系统缓存中找,还是没有的话去路由器缓存中寻找;再没有就去系统host文件中找,还是没有最后只能去请求dns服务器,然后dns给一个ip给浏览器;浏览器根据这个ip地址,将请求信息,请求说明和请求参数等封成一个tcp包,由传输层,到网络层,到数据链路层到物理层,传送给服务器,服务器解析这个tcp包将对应的页面文件返回。浏览器根据html文件生成dom树,根据css文件生成cssom树,然后合并这两棵树生成渲染树,然后渲染页面并且展示。要注意的是,当浏览器解析html文件时候如果遇到了内联或者外联的js代码,会暂停dom树的生成,等js代码执行完成之后,才能继续生成树并渲染。
其中在页面渲染以及网络请求响应的性能优化方面,我们可以做的优化工作有:1.js代码写在页面渲染完成之后避免阻塞渲染 2.cdn并发,资源压缩,减少请求次数(每次请求的代价都是很高的) 3.预加载或者懒加载
13-16编程题,待完善~~
13.
定义S(n),表示n在十进制下的各位数字和。
现在给定一个x,请你求出最小正整数n,满足)x≤S(n).
输入描述:
第一行数据组数T,对于每组数据,一行一个数字x。
1 <=x <=10^5 , 1<=T≤10
输出描述:
对于每组数据,一行一个整数表示最小的n。
代码:
var n = parseInt(readline())
while (n--) {
var x = parseInt(readline())
print(test(x))
}
function test(x) {
var num = Math.floor(x / 9)
var rest = x % 9;
var res = ''
for (var i = 0; i < num; i++) {
res += 9
}
if (rest !== 0) {
res = rest + res;
}
return res //返回字符串就行了
}
小易给定你数字A,B(A<B)
和系数p,q。每次操作你可以将A变成A+p或者将p变成p*q。问至少几次操作使得B<=A
代码:
var T = parseInt(readline());
while (T--) {
var arr = readline().split(" ")
var A = parseInt(arr[0]);
var B = parseInt(arr[1]);
var p = parseInt(arr[2]);
var q = parseInt(arr[3]);
print(test(A, B, p, q))
}
function test(A, B, p, q) {
var dp = [];
var index = 0;
var min = Number.MAX_VALUE
dp[0] = Math.ceil((B - A) / p)
var temp = p;
while (++index) {
temp = p
temp = temp * Math.pow(q, index);
var n = Math.ceil((B - A) / temp)
dp.push(index + n)
min = Math.min(n + index, min)
if (index - 1 > 0 && dp[index] > dp[index - 1]) {
return min
}
}
}
小易有n根柱子,第i根柱子的高度为hi。一开始小易站在第一根柱子上。小易能从第i根柱子跳到第j根柱子,当且仅当hj<hi
且1<=j-i<=k
。其中k为指定的一个数字。
另外小易拥有一次释放超能力的机会。这个超能力能让小易从柱子i跳到任意满足1<=j-i<=k
的柱子j而无视柱子高度的限制。
现在小易想知道,小易是否能到达第n根柱子。
输入描述:
第一行数据组数T
对于每组数据,第一行数字n,k,接下来一行n个数字表示hi。
1<=n<=1000, 1<=hi<=10^9, 1<=T<=10, 1<=k<=n
输出描述:
对于每组数据,输出YES或NO
代码:
var n = parseInt(readline());
while (n--) {
var arr = readline().split(" ")
let n = parseInt(arr[0]);
let k = parseInt(arr[1]);
let arrH = readline().split(" ");
for (let i = 0; i < n; i++) {
arrH[i] = parseInt(arrH[i])
}
// var dp = new Array(n + 1).fill(0);
print(test(n, k, arrH))
}
function test(n, k, arrH) {
var index = 0;
var flag = true;
while (index < n - 1) {
var tmp = index;
var max = 0,
max_index = index;
for (var j = index + 1; j < index + 1 + k && j < n; j++) {
if (arrH[j] < arrH[index]) {
max_index = (max > arrH[j]) ? max_index : j;
max = Math.max(arrH[j], max)
}
} //跳到K格里面比index小,但是是最大的
index = max_index;
if (tmp == index && flag) {
flag = !flag;
max = 0;
max_index = index;
for (let j = index + 1; j < index + 1 + k && j < n; j++) {
//不用管高低,直接跳到k格里面最高的
max_index = (max > arrH[j]) ? max_index : j;
max = Math.max(arrH[j], max)
}
index = max_index
} else if (tmp == index && flag == false) {
return 'NO'
}
}
return 'YES'
}