欢迎光临散文网 会员登陆 & 注册

2020校园招聘前端笔试卷(一 )总结

2021-09-04 22:21 作者:忘魂儿  | 我要投稿
  1. 下面哪几个和 [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=&gt; x.position === 'TOP' &amp;&amp; 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:

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















2020校园招聘前端笔试卷(一 )总结的评论 (共 条)

分享到微博请遵守国家法律