牛客最新前端JS面试百题

Posted 2021-11-22 战场小包

前言

前几天空闲时间抓取了牛客最新的笔试题和面试题，想做一下数据统计，展望一下面试中javascript的平凡考点和火爆考点。

但真到分析时，我才发现：我好像只会使用饼图和柱状图，而且我找不到特别好的切入点来分析，因此我就只好按照题型和题目考点做了一个简单的分析。

详情：抓取牛客最新前端面试题五百道 数据分析JS面试热点

虽然文章反响有些不尽人意，我也感觉有几分挫败，但往好处看，这篇文章还是有几分可取之处。从这篇文章中，我们可以总结出三个爆点： JavaScript 深入、promise、手撕代码。

通过这篇文章，我还收到了很多大佬的留言：大家想看具体的题目，于是我就快马加鞭，终于把笔试题部分的题目全部分类和整理完毕，希望能帮到需要面试的大佬们。

不多说了，进入题海吧。

单选题

基础题

js概念与类型检测

1. 以下不属于 typeof 运算符返回值的是？

A. "string"
B. "function"
C. "object"
D. "null"

2. 执行以下代码，错误的输出结果是

A. 输入：typeof {"x":1} 输出："object" 
B. 输入：typeof 1 输出："number" 
C. 输入：typeof [{x:1}] 输出："array" 
D. 输入：typeof NaN 输出："number"

3. 可以用typeof来判断的基本类型有

A. undefined
B. null
C. array
D. object

4. 以下不属于JavaScript基本数据类型的是：

A. Boolean
B. undefined
C. Symbol
D. Array

5. 以下关于JavaScript中数据类型的说法错误的是()

A. 数据类型分为基本数据类型和引用数据类型
B. JavaScript一共有8种数据类型
C. Object是引用数据类型，且只存储于堆(heap)中
D. BigInt是可以表示任意精度整数的基本数据类型，存储于栈(stack)中

答案

DCADC

逻辑判断

1. 请选择结果为ture的表达式？

A. null instanceof Object
B. null === undefined
C. null == undefined
D. NaN == NaN

2. 下列代码结果为 true 的是？

A. Symbol.for('a') === Symbol.for('a')
B. Symbol('a') === Symbol('a')
C. NaN === NaN
D. {} === {}

3. 根据如下变量，下列表达式中返回值为true的是

var a = 1;
var b = [];
var c = '';
var d = true;

A. (a || b) === true
B. (b && c) === true
C. (c && d) === true
D. (d || a) === true

4. 1==true的返回值是true，这句话是否正确？

A. T
B. F

5. 下面代码输出为true的是?

A. console.log([] === []);
B. console.log(undefined == 0);
C. console.log(undefined == false);
D. console.log(false == '');

6. 以下打印结果为true的是

A. console.log("12" === 12)
B. console.log (NaN === NaN)
C. console.log (typeof(null) === typeof(window))
D. console.log ([1,2,3] === [1,2,3])

7. 以下表达式，正确的是

A. Number('a') == Number('a')
B. -1 == true
C. 3 + '2' === 5
D. ![] == ''

答案

CADADCD

Math

1. 如何把 7.25 四舍五入为最接近的整数

A. Math.round(7.25)
B. Math.ceil(7.25)
C. Math.floor(7.25)
D. Math.rnd(7.25)

2. 下面哪个选项可以产生0<=num<=10的随机整数

A. Math.floor(Math.random()*6)
B. Math.floor(Math.random()*10)
C. Math.floor(Math.random()*11)
D. Math.ceil(Math.random()*10)

3. 以下( )表达式产生一个0~7之间(含0,7)的随机整数

A. Math.floor(Math.random()*6)
B. Math.floor(Math.random()*7)
C. Math. floor(Math.random()*8)

答案

ACC

字符串

1. split() 方法用于把一个字符串分割成字符串数组。

A. T
B. F

2. String对象的哪个方法可以寻找子字符串并返回该子字符串位置

A. match()
B. indexOf()
C. search()
D. concat()

答案

AB

JSON

1. 下面哪一个是JSON数据？

A. ｛name:"xiaoming",age,"student"｝
B. ｛"name":"xiaoming","age":"student"｝
C. ｛"xiaoming","student"｝
D. ["xiaoming","student"]

2. 下面分别使用 JSON.stringify 方法，返回值 res 分别是

const fn = function(){}
const res = JSON.stringify(fn)
const num = 123
const res = JSON.stringify(num)
const res = JSON.stringify(NaN)
const b = true
const res = JSON.stringify(b)

A. 'function'、'123'、'NaN'、'true'
B. undefined、'123'、undefined、'true'
C. undefined、'123'、'null'、'true'
D. undefined、'123'、'null'、undefined

答案

BC

数组

1. js数组中不会改变原有数组的方法是()

A. push
B. concat
C. sort
D. shift

2. 下列哪种数组的方法不会修改数组本身

A. slice
B. splice
C. sort
D. unshift

3. JavaScript中需要往数组末尾处添加一个元素，应该使用以下哪个方法：

A. push
B. pop
C. shift
D. unshift

4. 以下js操作Array的方法中不能添加元素的是：

A. push
B. pop
C. unshift
D. splice

5. 数组以下哪个方法会影响原数组？

A. concat
B. splice
C. slice
D. join

6. JavaScript中，下列哪一个Array的方法的返回值类型和其他不同

A. concat
B. shift
C. filter
D. map

7. 如下的Array.prototype上的方法中，那个方法不会改变原有的数组？

A. push
B. slice
C. splice
D. sort

8. 对于一个数字组成的数组 nums，现在需要执行在不改动 nums 的基础上去重操作，返回一个新的无重复元素的数组，以下几段代码能完成这一操作的是()

// (1)
const newNums = Array.from(new Set(nums))

// (2)
const newNums = nums.filter((n, i) => {
    return nums.indexOf(n) === i
})

// (3)
const newNums = nums.forEach((n, i) => {
    return nums.indexOf(n) === i
})

// (4)
const newNums = nums.reduce((acc, n, i) => {
    return [].concat(acc, nums.indexOf(n) === i ? n : []
)
})

A. (1)、(2)、(3)、(4)
B. (1)、(3)、(4)
C. (1)、(2)、(4)
D. (1)、(4)

答案

BAABB
BBC

正则

1. 正则表达式 ^d+[d]+ 能匹配下列哪个字符串？

A. 123
B. 123a
C. d123
D. 123def

2. 下面哪个不是RegExp对象的方法

A. test
B. match
C. exec
D. compile

3. 以下哪项可以去除变量str中的所有空格

A. str.replace(`/\\s*/g,""`)
B. str.replace(`/^\\s|\\s$/g,""`)
C. str.replace(`/^\\s*/, ""`)
D. str.replace(`/(\\s*$)/g, ""`)

答案

CBA

其他

1. 下列函数哪个不是JavaScript的全局函数

A. encodeURI
B. parseFloat
C. round
D. eval

2. 编写高性能JavaScript，以下描述错误的是

A. 遵循严格模式："use strict"
B. 将js脚本放在页面顶部，加快渲染页面
C. 将js脚本成组打包，减少请求，尽量减少使用闭包
D. 使用非阻塞方式下载js脚本，最小化重绘(repaint)和回流(reflow)

3. 有关JavaScript中系统方法的描述，错误的是？

A. parseFloat方法：该方法将一个字符串转换成对应的小数
B. isNaN方法：该方法用于检测参数是否为数值型，如果是，返回true，否则，返回false。
C. escape方法： 该方法返回对一个字符串编码后的结果字符串
D. eval方法：该方法将某个参数字符串作为一个JavaScript执行题

4. 下面列出的浏览器，无webkit内核的是()

A. chrome
B. Safari
C. 搜狗浏览器
D. Firefox

5. 下列代码哪个能够实现获取形式为 2017-08-01 形式的日期( )？

// A
var formatDate=getDate()
// B
var formatDate = new Date()
// C
var formatDate = function (date) {
    var y = date.getFullYear();
    var m = date.getMonth() + 1;
    
    var d = date.getDate();
    return y + '-' + m + '-' + d;
};
// D
var formatDate = function (date) {
    var y = date.getFullYear();
    var m = date.getMonth() + 1;
    m = m < 10 ? '0' + m : m;
    var d = date.getDate();
    d = d < 10 ? ('0' + d) : d;
    return y + '-' + m + '-' + d;
};

6. 如何最小化重绘(repaint)和回流(reflow)

A. 需要对元素进行复杂的操作时，可以先隐藏(display:"none")，操作完成后再显示
B. 需要创建多个DOM节点时，使用DocumentFragment创建完后一次性的加入document
C. 尽量避免用table布局(table元素一旦触发回流就会导致table里所有的其它元素回流)
D. 尽量不要使用 css 属性简写，如：用border-width, border-style, border-color代替border

答案

CBBDD

深入题

this

1. 下列哪种方法不能改变this指向()

A. eval
B. apply
C. bind
D. call

2. 在JavaScript中下面选项关于this描述正确的是

A. 在使用new实例化对象时, this指向这个实例对象
B. 将对象的方法赋值给变量A。执行A()时 该方法中的this指向这个对象。 
C. 在函数定义时,this指向全局变量
D. 在浏览器下的全局范围内，this指向全局对象

3. 下面有关JavaScript中call和apply方法的描述，错误的是？

A. call与apply都属于Function.prototype的一个方法，所以每个function实例都有call、apply属性
B. 两者传递的参数不同，call函数第一个参数都是要传入给当前对象的对象，apply不是
C. apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入
D. call传入的则是直接的参数列表。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

答案

AAB

作用域(闭包)

1. 内存泄漏是 javascript 代码中必须尽量避免的，以下几段代码可能会引起内存泄漏的有()

// (1)
function getName() {
    name = 'javascript'
}
getName()

// (2)
const elements = {
    button: document.getElementById('button')
};
function removeButton() {
    document.body.removeChild(elements.button);
}
removeButton()

// (3)
let timer = setInterval(() => {
    const node = document.querySelector('#node') 
    if(node) {
        clearInterval(timer)
    }
}, 1000);

A. (1)、(2)、(3)
B. (2)、(3)
C. (1)、(3)
D. (1)、(2)

2. 那个操作不会造成内存泄露

A. 没有清理的DOM元素引用
B. 被遗忘的定时器
C. 事件侦听没有移除
D. 局部变量不用时，没有设为null

3. 下列关于闭包理解错误的是

A. 增加一定的内存消耗
B. 使用不当可能会导致内存泄漏
C. 可以使用闭包模拟私有方法
D. 闭包会改动对象的原型链

答案

DDD

原型与继承

1. JavaScript实现继承的方式，不正确的是：

A. 原型链继承
B. 构造函数继承
C. 组合继承
D. 关联继承

2. 所有对象都有原型

A. T
B. F

3. 以下关于原型链的描述正确的是:

A. 通过原型链继承的属性和对象自己定义的属性等效
B. 通过原型链可以模拟对象的私有属性
C. 在对象上访问不存在的属性时,会依次遍历整条原型链
D. 所有 JavaScript 中的对象都是位于原型链顶端的 `Object` 的实例

答案

DBC

其他

1. 以下不属于前端数据存储方式的是？

A. jsonp
B. cookie
C. localStorage
D. sessionStorage

答案

A

DOM题

事件流

1. 将A元素拖拽并放置到B元素中，B元素需要做哪项操作()？

A. event.preventDefault()
B. event.prevent()
C. event.drag()
D. event.drop()

2. 以下不支持冒泡的鼠标事件为( )？

A. mouseover
B. click
C. mouseleave
D. mousemove

3. 在javascript中，用于阻止默认事件的默认操作的方法是

A. stopDeafault()
B. stopPropagation()
C. preventDefault()
D. preventDefaultEven()

4. 事件传播的三个阶段是什么

目标 -> 捕获 -> 冒泡
冒泡 -> 目标 -> 捕获
目标 -> 冒泡 -> 捕获
捕获 -> 目标 -> 冒泡

5. 下面有关 javascript 常见事件的触发情况，描述错误的是？

A. onchange：用户改变域的内容
B. onkeypress：某个键盘的键被按下或按住
C. onmousedown：某个鼠标按键被按下
D. onblur：元素获得焦点

答案

ACCDD

DOM遍历

1. 以上是关于牛客最新前端JS面试百题的主要内容，如果未能解决你的问题，请参考以下文章

   #yyds干货盘点# 牛客最新前端JS笔试百题

   抓取牛客最新前端面试五百题 可视化分析前端面试热点

   抓取牛客最新前端面试五百题 可视化分析前端面试热点

   2021年前端最新笔试百题

   2021年前端最新笔试百题

   2021年前端最新笔试百题