2020校园招聘前端笔试卷(一 )总结
下面哪几个和 [http://store.company.com/dir/page.html](http://store.company.com/dir/page.html) 符合同源策略?
解析:
同源的定义:如果两个 URL 的 protocol、port (en-US) (如果有指定的话)和 host 都相同的话,则这两个 URL 是同源。
例如:协议://主机/路径
2.关于DOMContentLoaded和load事件说法正确的是?
解析:
DOMContentLoaded
当纯HTML被完全加载以及解析时,DOMContentLoaded事件会被触发,而不必等待样式表,图片或者子框架完成加载。Load
当一个资源及其依赖资源已完成加载时,将触发load事件。
整体流程:
DOM文档加载的步骤为:
①解析HTML结构。
②加载外部脚本和样式表文件。
③解析并执行脚本代码。
④DOM树构建完成。//执行DOMContentLoaded
⑤加载图片等外部文件。
⑥页面加载完毕。//执行load
3.如何在 div 容器里展示 <div></div> 这几个字符?
4.以下是哪一组全是块级元素?
解析:
一、什么叫块级元素?
块级元素会新起一行,它可以包含行内元素和其他块级元素,并且可以设置宽高
二、什么叫行内元素?
同一行内,无法设置宽高
三、常见的块级元素
div,h1-h6,p,pre,ul,ol,li,form,table,label等
四、常见的行内元素
a,img,span,i(斜体),em(强调),sub(下标),sup(上标)等
5.<div class="box box1 box2" style="color:#222">hello</div>,
这个div里面最终的字体颜色是什么?
.box{
color:#999;
}
.box{
color:#333 !important;
}
.box2{
color:#666
}
解析:!important 为最优先
style行内样式第二大
多个class设置同一样式,取最后一个
6.以下不是box-sizing的属性是?
解析:content-box:在宽度和高度之外绘制元素的内边距和边框
border-box:由元素设定的宽度和高度决定了元素的边框盒
inherit:规定应从父元素继承 box-sizing 属性的值
7.以下不是CSS伪类选择器的是?
解析:
伪类选择器的分类:
一、链接伪类选择器
:link 未访问的链接
:visited 已访问的链接
:hover 鼠标移动到链接上
:active 选定的链接
二、结构(位置)伪类选择器
:first-child :选取属于其父元素的首个子元素的指定选择器
:last-child :选取属于其父元素的最后一个子元素的指定选择器
:nth-child(n) : 匹配属于其父元素的第 N 个子元素,不论元素的类型,正数
:nth-last-child(n) :选择器匹配属于其元素的第 N 个子元素的每个元素,不论元素的类型,从最后一个子元素开始计数,倒数。 n 可以是数字、关键词或公式
三、目标伪类选择器
URL 带有后面跟有锚名称 #,指向文档内某个具体的元素。这个被链接的元素就是目标元素(target element)。
:target 选择器可用于选取当前活动的目标元素
8.‘-1 >>> 32 的值为( )’
解析:“>>>”运算符执行无符号右移位运算。它把无符号的 32 位整数所有数位整体右移。
对于无符号数或正数右移运算,无符号右移与有符号右移运算的结果是相同的。
对于负数来说,无符号右移将使用 0 来填充所有的空位,同时会把负数作为正数来处理,所得结果会非常大,完成右移操作后,最高位为1代表负数
9.[1 < 2 < 3, 3 < 2 < 1]
解析:运算顺序为从左到右,先得到boolean值,再转换成对应值0(false),1(true)比较,得到最后的boolean值
10.['1', '2', '3'].map(parseInt) ( )
解析:
①map函数
将数组的每个元素传递给指定的函数处理,并返回处理后的数组,所以 ['1','2','3'].map(parseInt) 就是将字符串1,2,3作为元素;0,1,2作为下标分别调用 parseInt 函数。即分别求出 parseInt('1',0), parseInt('2',1), parseInt('3',2)的结果
②parseInt函数
以第二个参数为基数来解析第一个参数字符串
接收两个参数parseInt(string,radix)
string:字母(大小写均可)、数组、特殊字符(不可放在开头,特殊字符及特殊字符后面的内容不做解析)的任意字符串
radix:解析字符串的基数(规则如下){
区间范围介于2~36之间
当参数为 0,parseInt() 会根据十进制来解析
如果忽略该参数,默认的基数规则:
如果 string 以 "0x" 开头,parseInt() 把 string 的其余部分解析为十六进制数parseInt("0xf") //15
如果 string 以 0 开头,其后的字符解析为八进制或十六进制的数字;parseInt("08") //8
如果 string 以 1 ~ 9 的数字开头,parseInt() 将把它解析为十进制的整数parseInt("88.99f") //88
只有字符串中的第一个数字会被返回。parseInt("10.33") //返回10
开头和结尾的空格是允许的。parseInt(" 69 10 ") //返回69
如果字符串的第一个字符不能被转换为数字,返回 NaN
}
所以parseInt('1',0) ,默认10进制解析 结果为1
parseInt('2',1), radix参数为1,不在区间内,结果为NaN
parseInt('3',2),radix参数为2,以二进制解析,但二进制要求0或1开头,所以违反规则,结果为NaN
11.let a = { c:1 }
let b = a
a = 1
b.c = 2
a.c = (?)
解析:a为对象开辟一块内存空间,地址为0x巴拉巴拉
将a赋值给b,此时b也是对象,与a指向同一个地址
然后a再赋值为1,改变了它的类型为number,原有a对开辟内存地址的指向消失,原有b的指向仍然存在
对b中的c赋值为2
a此时只是个number类型,又不是对象,哪来的c,所以是undefined
12.console.log(1);
setTimeout(() => {console.log(2)}, 0);
console.log(3);
Promise.resolve(4).then(b => {
console.log(b);
});
console.log(5);
解析:首先我们要知道js的代码执行顺序是从上到下按顺序执行的,当然这只针对同步
那么,也就是说定时器setTimeout和Promise属于异步范畴,异步是在所有同步代码执行完之后执行
其中Promise的代码总是优先于setTimeout的代码执行
他俩中出现任意同类型代码,按顺序执行
13.Math.abs(-6.666) 的结果是多少?
没啥说的
14.替换字符串 bilibili 替换字符串中所有的b变成大写B
解析
delete方法用于删除对象的指定元素(包括变量和函数),要注意的是不能删除原型链上的属性,也不能删除具有DontDelete特性的元素,但可以删除eval中申明的元素
什么是具有DontDelete特性的元素?
什么是eval中申明的元素?
replace方法
用法:stringObject.replace(regexp/substr,replacement)
regexp/substr:规定子字符串或要替换的模式的 RegExp 对象。
请注意,如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为 RegExp 对象。
replacement:一个字符串值。规定了替换文本或生成替换文本的函数。
toUpperCase()方法
全部转成大写
15.[1,2,3,4,5] 的数组的基础上 删除第一个 和 最后一位
slice(start,end)最后一个元素通通用-1指代
16.function setname(name){
this.name = name
}
setname.prototype.printName = function(){ console.log(this.name) }
let a = new setname("cc")
a.name = "dd"
a.__proto__.name = "ee"
a.__proto__.printName() // ?
a.printName() // ?
考察作用域链和原型链
什么是作用域链,什么是原型链?
作用域是针对变量的,它的特点就是,先在自己的变量范围中查找,如果找不到,就会沿着作用域往上找,一直找到你要的变量为止,这个查找的过程就叫作用域链。(作用域只会向上查找)
原型链是针对构造函数的,比如我先创建了一个函数,然后通过一个变量new了这个函数,那么这个被new出来的函数就会继承创建出来的那个函数的属性,然后如果我访问new出来的这个函数的某个属性,但是我并没有在这个new出来的函数中定义这个变量,那么它就会往上(向创建出它的函数中)查找,这个查找的过程就叫做原型链。(就和继承一样,如果自身没有定义就会继承父元素的样式)
所以这道题就要分成两条互不干扰的链来看
17.const players = [ {name: 'UZI', team: 'RNG', position: 'ADC'},
{name: 'theshy', team: 'IG', position: 'TOP'},
{name: 'Metoer', team: 'BLG', position: 'Jungle'},
{name: 'ADD', team: 'BLG', position: 'TOP'},
{name: 'Scout', team: 'EDG', position: 'Middle'},
{name: 'iBoy', team: 'EDG', position: 'ADC'},
{name: 'Baolan', team: 'IG', position: 'Support'},
{name: 'Xiaohu', team: 'RNG', position: 'Middle'}]
获取列表中战队名是BLG 位置上路的 选手对象?
players.filter(x=> x.position === 'TOP' && x.team === 'BLG') √
解析:考察库函数,转义字符,查询条件
库函数:filter--通称过滤器,对容器内每个item进行操作,筛选出符合条件的重构
转义字符:

18.[编程题]找出有序数组中和为sum的两个数
找出有序数组(从小到大排列)中和为sum的两个数,要求复杂度为O(n),找到一组即可
输入描述:
第一行:数组长度
第二行:数组各项的值
第三行:sum
输出描述:
若存在,输出和为sum的两个数,以空格分隔;若不存在,输出notfound
输入例子1:
5
1 3 4 6 8
10
输出例子1:
4 6
输入例子2:
5
1 3 4 6 8
13
输出例子2:
notfound
方法一:简化二分法---双兔吃草
方法二:key值唯一
用一个对象的key来存储遍历过的数字(value值任意,这里用的是0),每次循环只需判断(sum-当前值)的key值对应的value是不是为0(为0就代表之前遍历过这个数字)
19.[编程题]括号闭合
判断由"()[]{}"6种括号组成的字符串是否合法
1. 所有括号必须闭合
2. 左括号必须在正确的位置闭合
输入描述:
由6种符号组成的字符串
输出描述:
合法则输出"true",不合法输出"false"
输入例子1:
(]
输出例子1:
false
输入例子2:
{[][()()]}
输出例子2:
true
输入例子3:
{([)]}
输出例子3:
false
1.利用 map 实现一一对应key-value
2.利用栈
20.[编程题]上楼梯
有n级台阶,每一步可以走1级或2级,问一共有多少种走法
输入描述:
台阶的级数n
输出描述:
走法数量
输入例子1:
2
输出例子1:
2
例子说明1:
走法为1+1或2
输入例子2:
3
输出例子2:
3
例子说明2:
走法为1+1+1或1+2或2+1
解析:
考察--动态规划
设k[i]代表爬到第i层的总解法数。从第三层开始的每一层可以从第 i- 1 层迈一步到达,或者从第 i - 2层迈两步到达,所以解法数k[i] = k[i-1] + k[i-2] (i>2)
此外考虑 k[1] = 1, k[2] = 2