2024年前端最新牛客最新前端JS面试百题，绝对干货

最新推荐文章于 2024-07-02 17:59:10 发布
最新推荐文章于 2024-07-02 17:59:10 发布
阅读量799 收藏 17
点赞数 17
分类专栏： 程序员 文章标签： 前端 javascript 面试
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_82243839/article/details/138516395
版权

最后

前15.PNG

前16.PNG

由于文档内容过多，为了避免影响到大家的阅读体验，在此只以截图展示部分内容

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

D. eval

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

A. 遵循严格模式：“use strict”

B. 将js脚本放在页面顶部，加快渲染页面

C. 将js脚本成组打包，减少请求，尽量减少使用闭包

D. 使用非阻塞方式下载js脚本，最小化重绘(repaint)和回流(reflow)

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

A. parseFloat方法：该方法将一个字符串转换成对应的小数

B. isNaN方法：该方法用于检测参数是否为数值型，如果是，返回true，否则，返回false。

C. escape方法： 该方法返回对一个字符串编码后的结果字符串

D. eval方法：该方法将某个参数字符串作为一个JavaScript执行题

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

A. chrome

B. Safari

C. 搜狗浏览器

D. Firefox

  1. 下列代码哪个能够实现获取形式为 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;

};

  1. 如何最小化重绘(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

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

A. 在使用new实例化对象时, this指向这个实例对象

B. 将对象的方法赋值给变量A。执行A()时 该方法中的this指向这个对象。

C. 在函数定义时,this指向全局变量

D. 在浏览器下的全局范围内，this指向全局对象

  1. 下面有关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)

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

A. 没有清理的DOM元素引用

B. 被遗忘的定时器

C. 事件侦听没有移除

D. 局部变量不用时，没有设为null

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

A. 增加一定的内存消耗

B. 使用不当可能会导致内存泄漏

C. 可以使用闭包模拟私有方法

D. 闭包会改动对象的原型链

答案

DDD

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

A. 原型链继承

B. 构造函数继承

C. 组合继承

D. 关联继承

  1. 所有对象都有原型

A. T

B. F

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

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()

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

A. mouseover

B. click

C. mouseleave

D. mousemove

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

A. stopDeafault()

B. stopPropagation()

C. preventDefault()

D. preventDefaultEven()

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

目标 -> 捕获 -> 冒泡

冒泡 -> 目标 -> 捕获

目标 -> 冒泡 -> 捕获

捕获 -> 目标 -> 冒泡

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

A. onchange：用户改变域的内容

B. onkeypress：某个键盘的键被按下或按住

C. onmousedown：某个鼠标按键被按下

D. onblur：元素获得焦点

答案

ACCDD

DOM遍历
  1. 下列哪项不属于DOM查找节点的属性()？

A. parentObj.firstChild

B. parentObj.children

C. neborNode.previousSibling

D. neborNode.siblings

  1. DOM中，给父节点添加子节点的正确方法为()？

A. appendChild(parentNode,newNode);

B. append(parentNode,newNode);

C. parentNode.append(newNode);

D. parentNode.appendChild(newNode);

  1. JavaScript中document.getElementById()返回值的类型为？

A. Array

B. Object

C. String

D. Function

  1. DOM中，给父节点添加子节点的正确方法为()？

A. appendChild(parentNode,newNode);

B. append(parentNode,newNode);

C. parentNode.append(newNode);

D. parentNode.appendChild(newNode);

答案

DDBD

其他
  1. DOM元素的以下属性改变会导致重排(reflows)的是

outline

visiblity

font-size

background-color

答案

C

BOM题

  1. setInterval(updateClock,60)的含义是( )？

A. 每隔60秒调用一次updateClock()

B. 每隔60毫秒调用一次updateClock()

C. 每隔60分钟调用一次updateClock()

D. 每分钟调用60次updateClock()

  1. 使用方法( )可以获取到地理位置所在的经纬度？

A. Geolocation.watchPosition()

B. Geolocation.getCurrentPosition()

C. Geolocation.getPosition()

D. Geolocation.Position()

  1. setInterval(“alert(‘welcome’);”,1000);这段代码的意思是

A. 等待1000秒后，再弹出一个对话框

B. 等待1秒钟后弹出一个对话框

C. 每隔一秒钟弹出一个对话框

D. 语句报错,语法有问题

答案

BBC

ES6题

箭头函数
  1. 下列对js箭头函数描述错误的是()

A. 箭头函数没有原型属性

B. 箭头函数不绑定this，会捕获其所在的上下文的this值，作为自己的this值

C. 箭头函数可以作为构造函数，使用new

D. 箭头函数不绑定arguments，取而代之用rest参数解决

  1. 关于箭头函数下列说法错误的一项是：

A. 函数体内this的指向是定义时所在的对象，而不是使用时所在的对象

B. 箭头函数内不能使用arguments对象

C. 箭头函数不能使用yield命令

D. 可以使用new创建一个箭头函数的实例

答案

CD

promise
  1. 关于将 Promise.all 和 Promise.race 传入空数组的两段代码的输出结果说法正确的是：

Promise.all([]).then((res) => {

console.log(‘all’);

});

Promise.race([]).then((res) => {

console.log(‘race’);

});

A. all 和 race 都会被输出

B. all 和 race 都不会被输出

C. all 会被输出，而 race 不会被输出

D. all 不会被输出，race 会被输出

  1. 以下方案中，不是用于解决回调陷阱的的是：

A. Promise

B. Generator

C. async

D. Proxy

  1. 在 ECMAScript6 中，不属于promise的状态是:

A. Pending

B. Pause

C. Fulfilled

D. Rejected

答案

CDB

解构赋值
  1. 关于ES6解构表达式,描述正确的是()

let [a,b, c,d, e] = “hello”;

A. e = “hello”;

B. 其它都为undefined

C. 当中 a = “h”, b = “e”;

D. 语法报错

答案

C

多选题

JS基础

  1. 下面哪些数组方法会改变原数组

A. push

B. concat

C. splice

D. map

  1. 下面可以声明数字的js代码是

A. const a = 0xa1

B. const a = 076

C. const a = 0b21

D. const a = 7e2

  1. 以下属于操作符 typeof 的返回值的是：

(1)function

(2) object

(3) null

(4) array

(5) NaN

(6) bigint

(7) regexp

(8) undefined

A. (1)、(2)、(3)、(4)、(5)、(6)、(7)、(8)

B. (1)、(2)、(3)、(8)

C. (1)、(2)、(8)

D. (1)、(2)、(6)、(8)

  1. 以下()结果等于字符串string

A. typeof ‘string’

B. String(‘string’).toString()

C. ‘string’.split(‘’).sort().join(‘’)

D. (function(string){return string})(‘string’)

E. JSON.parse(‘{“string”:“string”}’).string

  1. 下面的等式成立的是?

A. parseInt(46.8) == parseFloat(46.8)

B. NaN !== NaN

C. isNaN(‘abc’) == NaN

D. typeof NaN === ‘number’

  1. 以下哪些选项可以将集合A转化为数组？

A. Array.from(A)

B. [].slice.apply(A)

C. […A]

D. [].map.call(A, o => o)

  1. 下列结果返回 true 的是

A. null == undefined

B. null === undefined

C. null === null

D. NaN == null

E. NaN === NaN

F. Infinity + 1 !== Infinity

答案

AC ABD D ABDE BD ABCD AC

JS深入

  1. 关于以下代码，说法正确的有哪些？

function Person() { }

var person = new Person();

A. 每一个原型都有一个constructor属性指向关联的构造函数。

B. 每一个对象都有一个prototype属性。

C. Object.getPrototypeOf(person) === Person.prototype

D. person.constructor === Person

  1. 下列在 JS 时间循环机制中属于微任务(microTask)的是？

A. process.nextTick

B. promise

C. setTimeout

D. setInterval

答案

ACD AB

ES6

  1. 以下关于let和const的说法中正确的是:

A. let声明的变量值和类型都可以改变

B. const声明的常量不可以改变

C. 两者都不存在变量提升，同时存在暂时性死区，只能在声明的位置后面使用

D. const可以先声明再初始化，可以后赋值

  1. 下面关于Promise说法正确的是(注意“返回结果”的意思包含成功或者失败)

A. Promise.all在所有给定的promise都fulfilled后才返回结果

B. Promise.race在给定的promise中，某个fulfilled后才返回结果

C. promise.then的回调函数中，可以返回一个新的promise

D. 对于一个向后台获取数据已经产生结果的promise:p1，再次调用p1.then，不会去重新发起请求获取数据

答案

ABC CD

DOM

  1. 下列关于使用 JS 修改元素样式的代码，正确的有哪些？

document.body.style.[‘background-color’] = ‘#fff’

document.body.style.setProperty(‘background-color’, ‘#fff’)

document.body.style = ‘background-color’: #fff’

document.body.style.fontSize = ‘14px’

  1. 下列方法可用于阻止事件冒泡的有

A. event.cancelBubble = true;

B. event.stopPropagation();

C. event.preventDefault();

D. return false;

答案

BCD ABD

填空题

类型检测

  1. 在JavaScript中，有var arr = []; typeof arr的结果为

  2. 以下使用 typeof 操作符的代码的输出结果为

var x = typeof x

var res = typeof typeof x;

console.log(x, res)

  1. [typeof null, null instanceof Object]的结果是什么

  2. typeof typeof 0

  3. JavaScript的typeof运算符的可能结果为array？解释为什么

  4. 下面代码的输出结果是多少？

var arr = [];

console.log(typeof arr, Object.prototype.toString.call(arr));

  1. console.log(Object.prototype.toString.call(undefined))
类型转换

  1. 表达式 “2”+3+4 的值为

  2. console.log(‘5’ + 3, 5 + ‘3’)

  3. var a=parseInt(“111办公室”);alert(a);

  4. [“0x1”, “0x2”, “0x3”].map(parseInt) 的结果

  5. 在js中执行 1+'1’的结果是？

  6. 在js中执行 parseInt(‘77’,40)的结果是?

逻辑判断

  1. 请给出 [5<6<3,3<2<4] 代码的运行结果

  2. (2<3)||(3<2) 表达式将返回值为

  3. console.log(true||false&&false, true&&false||true)的输出结果是？

其他

  1. 1 + - + + + - + 1 的结果是

  2. [ ‘a’, ,‘b’, ,].length 的结果是

程序题

JS基础

  1. 下面两个程序的输出结果分别是？

// case 1

function showCase(value) {

switch(value) {

case ‘A’:

console.log(‘Case A’);

break;

case ‘B’:

console.log(‘Case B’);

break;

case undefined:

console.log(‘Case undefined’);

break;

default:

console.log(‘Case default’);

}

}

showCase(new String(‘A’));

// case 2

function showCase(value) {

switch(value) {

case ‘A’:

console.log(‘Case A’);

break;

case ‘B’:

console.log(‘Case B’);

break;

case undefined:

console.log(‘Case undefined’);

break;

default:

console.log(‘Case default’);

}

}

showCase(String(‘A’));

  1. p标签的的内容会显示什么？

  1. document.write的结果会是什么？

function funcA(x){

var temp = 4;

function funcB(y){

document.write( ++x + y + (temp–));

}

funcB(5);

}

funcA(6)

  1. alert的结果会是多少

var varArr = function(i,j,str) {

return j == 0 ? str : varArr(i,–j,(str+= " " + i[j]));

}

var arr = new Array(‘apple’,‘orange’,‘peach’,‘lime’);

var str = varArr(arr,arr.length,“”);

alert(str);

  1. 下面程序的输出结果是多少？

function greetingMaker(greeting) {

function addName(name) {

greeting = greeting.split(’ ').reverse().join(“-”);

return greeting + " " + name;

}

return addName;

}

var daytimeGreeting = greetingMaker(“Good Day to you”);

alert(daytimeGreeting(name));

  1. 下面程序的输出结果是多少？

String.prototype.GetNum = function() {

var regEx = /[^\d]/g;

return this.replace(regEx, ‘’);

};

var str = “a1b2c3”;

str = str.GetNum();

alert(str);

  1. 下面程序的输出结果是多少？

function sum(a, b) {

return a + b;

}

sum(1, “2”);

  1. 下面程序的输出结果是多少？

var str = “我非常喜欢编程”;

str.length = 3;

console.log(str);

  1. 下面程序的输出结果是多少？

let number = 0;

console.log(number++);

console.log(++number);

console.log(number);

  1. 下面程序的输出结果是多少？

function nums(a, b) {

if (a > b)

console.log(‘a is bigger’)

else

console.log(‘b is bigger’)

return a + b

}

console.log(nums(4, 2))

console.log(nums(1, 2))

  1. 下面程序输出结果是多少？

function side(arr) {

arr[0] = arr[2];

}

function func1(a, b, c = 3) {

c = 10;

side(arguments);

console.log(a + b + c);

}

function func2(a, b, c) {

c = 10;

side(arguments);

console.log(a + b + c);

}

func1(1, 1, 1);

func2(1, 1, 1);

  1. 下面代码的输出结果是什么？

var a = 3;

var b = new Number(3);

var c = 3;

console.log(a == b);

console.log(a === b);

console.log(b === c);

  1. 执行下列语句后，a.length的值为？

var a = [];

a.push(1, 2);

a.shift(3, 4);

a.concat([5, 6]);

a.splice(0, 1, 2);

  1. 下面这几段代码分别输出结果是多少？为什么？

var a = {}, b = ‘123’, c = 123;

a[b] = ‘b’;

a[c] = ‘c’;

console.log(a[b]);

// example 2

var a = {}, b = Symbol(‘123’), c = Symbol(‘123’);

a[b] = ‘b’;

a[c] = ‘c’;

console.log(a[b]);

// example 3

var a = {}, b = {key:‘123’}, c = {key:‘456’};

a[b] = ‘b’;

a[c] = ‘c’;

console.log(a[b]);

  1. 下面每项的返回值是什么？为什么？

null == undefined

0.1 + 0.2 == 0.3

typeof NaN

typeof Function

typeof Object

typeof {}

‘a’ + 1

‘a’ - 1

Function instanceof Object

Object instanceof Function

  1. 下面程序的输出结果是多少？

var array = []

for(var i = 0; i < 3; i++) {

array.push(() => i)

}

var newArray = array.map(el => el())

console.log(newArray)

  1. 下面程序的输出结果是多少？

function a(m, n) {

var b = function (l) {

return l <= m ? l * b(l + 1) : 1;

}

return b(m - n + 1);

}

console.log(a(4, 2));

  1. 下面程序的输出结果是多少？

console.log(typeof undefined == typeof NULL);

console.log(typeof function () {} == typeof class {});

  1. 执行后a和b.age的值分别为

var a = 10

var b = {

age: 11

}

function fn(x,y) {

–y.age;

return --x;

}

fn(a,b)

  1. 下面程序的执行结果是：

var number = 4;

var numberFactorial = (function (number){

return (number === 0)? 1: number* factorial(number-1)

})(number)

console.log(numberFactorial)

  1. 下面程序的输出结果是：

var array = []

for(var i = 0; i < 3; i++) {

array.push(() => i)

}

var newArray = array.map(el => el())

console.log(newArray)

  1. 下面程序的输出结果是：

function addToList(item, list) {

return list.push(item)

}

const result = addToList(“nowcoder”, [“hello”])

console.log(result)

  1. 下面程序的输出结果是：

const first = () => { console.log(‘first’); return false; }

const second = () => { console.log(‘second’); return true; }

console.log( first() && second() );

console.log( second() || first() );

  1. 下面代码的输出结果是：

var s=‘12ab3cd’, arr=s.split(/\d/);

console.log(arr[3],arr[4])

  1. 下面程序的输出结果是：

function getAge(…args) {

console.log(typeof args);

}

getAge(21);

  1. 下面程序的输出结果是:

var arr=[1,2,3];

arr.push(arr.shift())

console.log(arr[1],arr[2])

JS深入

this指向
  1. 下列程序的输出结果是多少？为什么？

var x = 1;

var obj = {

x: 3,

fun:function () {

var x = 5;

return this.x;

}

};

var fun = obj.fun;

console.log( obj.fun(), fun() );

  1. 下列程序的输出结果是多少？你能理清楚test函数的this指向吗？

var a = 5;

function test() {

a = 0;

alert(a);

alert(this.a);

var a;

alert(a);

}

new test();

  1. 下列程序的输出结果是多少？为什么？

function fun () {

return () => {

return () => {

return () => {

console.log(this.name)

}

}

}

}

var f = fun.call({name: ‘foo’})

var t1 = f.call({name: ‘bar’})()()

var t2 = f().call({name: ‘baz’})()

var t3 = f()().call({name: ‘qux’})

  1. 执行以下代码，输出结果分别是多少？

let obj1 = {

a: 1,

foo: () => {

console.log(this.a)

}

}

// log1

obj1.foo()

const obj2 = obj1.foo

// log2

obj2()

  1. 下面程序的输出结果是什么？为什么？

const Person = (name=“wang”,age=10) => {

this.name = name;

this.age = age;

return this.name +’ is '+ this.age + ‘years old’

}

let result = new Person(‘zhang’,11)

console.log(result)

  1. 请表述以下代码的执行结果和原因

var person = {

age: 18,

getAge: function() {

return this.age;

}

};

var getAge = person.getAge

getAge()

  1. 请按顺序写出打印结果，并说明原因。

var name = ‘global’;

var obj = {

name: ‘local’,

foo: function(){

this.name = ‘foo’;

}.bind(window)

};

var bar = new obj.foo();

setTimeout(function() {

console.log(window.name);

}, 0);

console.log(bar.name);

var bar3 = bar2 = bar;

bar2.name = ‘foo2’;

console.log(bar3.name);

  1. 下面程序的执行结果是：

var obj = {

name:“zhangsan”,

sayName:function(){

console.info(this.name);

}

}

var wfunc = obj.sayName;

obj.sayName();

wfunc();

var name = “lisi”;

obj.sayName();

wfunc();

  1. 下面程序的输出结果是：

var name=‘test’

var a = {

name: ‘ass’,

getName: function() {

return this.name;

}

}

var b = a.getName;

b();

事件循环
  1. 下列程序的输出结果分别是多少？为什么？

const promiseA = Promise.resolve(‘a’)

promiseA. then((res) => {

console.log(res)

}).then((res) => {

console.log(res)

})

const promiseB = Promise.resolve(‘b’)

promiseB. then((res) => {

console.log(res)

})

promiseB. then((res) => {

console.log(res)

})

  1. 下面程序的输出结果依次是多少？

setTimeout(() => {

console.log(1)

}, 0)

const P = new Promise((resolve, reject) => {

console.log(2)

setTimeout(() => {

resolve()

console.log(3)

}, 0)

})

P.then(() => {

console.log(4)

})

console.log(5)

  1. 下面程序的输出结果是

setTimeout(function(){

console.log(1);

}, 0)

new Promise(function(resolve){

console.log(2);

resolve();

console.log(3);

}).then(function(){

console.log(4);

})

console.log(5);

  1. 下面程序的输出结果是？

(async () => {

console.log(1);

setTimeout(() => {

console.log(2);

}, 0);

await new Promise((resolve, reject) => {

console.log(3);

}).then(() => {

console.log(4);

});

console.log(5);

})();

  1. 下面程序的输出结果是:

new Promise((resolve) => {

console.log(‘1’)

resolve()

console.log(‘2’)

}).then(() => {

console.log(‘3’)

})

setTimeout(() => {

console.log(‘4’)

})

console.log(‘5’)

  1. 下面程序的输出结果是:

var p1 = new Promise(function(resolve, reject){

resolve(“2”)

})

setTimeout(function(){

console.log(“1”)

},10)

p1.then(function(value){

console.log(value)

})

setTimeout(function(){

console.log(“3”)

},0)

  1. 下面程序的输出结果是：

setTimeout(function() {

console.log(‘setTimeout’);

}, 0);

Promise.resolve().then(function() {

console.log(‘promise1’);

}).then(function() {

console.log(‘promise2’);

});

  1. 请表述以下代码的执行结果和原因

setTimeout(function() {

console.log(1)

},0)

new Promise(function executor(resolve){

console.log(2)

for (var i = 0; i<10000; i++) {

i - 9999 && resolve()

}

console.log(3)

}).then(function() {

console.log(4)

})

console.log(5)

  1. 在网页中有两个div块，html代码如下

对应的js代码如下：

var outer = document.querySelector(‘.outer’);

var inner = document.querySelector(‘.inner’);

function onClick() {

console.log(‘click’);

setTimeout(function() {

console.log(‘timeout’);

}, 0);

Promise.resolve().then(function() {

console.log(‘promise’);

});

outer.setAttribute(‘data-random’, Math.random());

}

inner.addEventListener(‘click’, onClick);

outer.addEventListener(‘click’, onClick);

当点击class为inner的div块时，控制台依次输出结果是什么？

10. 下面程序的输出结果是？

(async () => {

console.log(1);

setTimeout(() => {

console.log(2);

}, 0);

await new Promise((resolve, reject) => {

console.log(3);

}).then(() => {

console.log(4);

});

console.log(5);

})();

  1. 下面程序的输出结果是：

setTimeout(() => console.log(‘a’));

Promise.resolve().then(

() => console.log('b’);

).then(

() => Promise.resolve(‘c’).then(

(data) => {

setTimeout(() => console.log(‘d’));

console.log(‘f’);

return data;

}

)

).then(data => console.log(data));

  1. 下面程序的输出结果是：

console.log(‘one’);

setTimeout(function() { console.log(‘two’); }, 0);

Promise.resolve()

.then(function() { console.log(‘three’); })

console.log(‘four’);

  1. 下面程序的执行结果是：

setTimeout(function () {

console.log©

},0)

console.log(‘D’)

new Promise(function(resolve){

console.log(‘E’)

resolve()

console.log(‘F’)

}).then(function() {

console.log(‘G’)

})

console.log(‘H’)

  1. 有一个输出函数定义如下：

function log(msg, time) {

return new Promise((resolve) => {

setTimeout(() => {

console.log(msg);

resolve();

}, time);

});

}

则下面三段代码输出的结果是：

// 第一段代码：

(async () => {

for (let i = 0; i < 5; i++) {

await log(i, 1000);

}

})();

// 第二段代码：

最后

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

最后写上我自己一直喜欢的一句名言：世界上只有一种真正的英雄主义就是在认清生活真相之后仍然热爱它

(){

console.log(“1”)

},10)

p1.then(function(value){

console.log(value)

})

setTimeout(function(){

console.log(“3”)

},0)

  1. 下面程序的输出结果是：

setTimeout(function() {

console.log(‘setTimeout’);

}, 0);

Promise.resolve().then(function() {

console.log(‘promise1’);

}).then(function() {

console.log(‘promise2’);

});

  1. 请表述以下代码的执行结果和原因

setTimeout(function() {

console.log(1)

},0)

new Promise(function executor(resolve){

console.log(2)

for (var i = 0; i<10000; i++) {

i - 9999 && resolve()

}

console.log(3)

}).then(function() {

console.log(4)

})

console.log(5)

  1. 在网页中有两个div块，html代码如下

对应的js代码如下：

var outer = document.querySelector(‘.outer’);

var inner = document.querySelector(‘.inner’);

function onClick() {

console.log(‘click’);

setTimeout(function() {

console.log(‘timeout’);

}, 0);

Promise.resolve().then(function() {

console.log(‘promise’);

});

outer.setAttribute(‘data-random’, Math.random());

}

inner.addEventListener(‘click’, onClick);

outer.addEventListener(‘click’, onClick);

当点击class为inner的div块时，控制台依次输出结果是什么？

10. 下面程序的输出结果是？

(async () => {

console.log(1);

setTimeout(() => {

console.log(2);

}, 0);

await new Promise((resolve, reject) => {

console.log(3);

}).then(() => {

console.log(4);

});

console.log(5);

})();

  1. 下面程序的输出结果是：

setTimeout(() => console.log(‘a’));

Promise.resolve().then(

() => console.log('b’);

).then(

() => Promise.resolve(‘c’).then(

(data) => {

setTimeout(() => console.log(‘d’));

console.log(‘f’);

return data;

}

)

).then(data => console.log(data));

  1. 下面程序的输出结果是：

console.log(‘one’);

setTimeout(function() { console.log(‘two’); }, 0);

Promise.resolve()

.then(function() { console.log(‘three’); })

console.log(‘four’);

  1. 下面程序的执行结果是：

setTimeout(function () {

console.log©

},0)

console.log(‘D’)

new Promise(function(resolve){

console.log(‘E’)

resolve()

console.log(‘F’)

}).then(function() {

console.log(‘G’)

})

console.log(‘H’)

  1. 有一个输出函数定义如下：

function log(msg, time) {

return new Promise((resolve) => {

setTimeout(() => {

console.log(msg);

resolve();

}, time);

});

}

则下面三段代码输出的结果是：

// 第一段代码：

(async () => {

for (let i = 0; i < 5; i++) {

await log(i, 1000);

}

})();

// 第二段代码：

最后

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

最后写上我自己一直喜欢的一句名言：世界上只有一种真正的英雄主义就是在认清生活真相之后仍然热爱它

2301_82243839
关注
  • 17
    点赞
  • 踩
  • 17
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
牛客校招面试题（附答案与解析）前端.rar
07-02
本题库均来自海量真实校招面试题目大数据进行的整理，后续也会不断更新，可免费在线观看，如需下载，也可点击进行下载（下载需要用牛币兑换，一次兑换可享受永久下载权限，因为后续会更新） 需要严肃说明的是：面试题库作为帮助同学准备面试的辅助资料，但是绝对不能作为备考唯一途径，因为面试是一个考察真实水平的，不是背会了答案就可以的，需要你透彻理解的，否则追问问题答不出来反而减分，毕竟技术面试中面试官最痛恨的就是背答案这个事情了。注：本篇参考回答为优秀学长学姐所写（传说中的offer收割机们），不过也可能部分地方有疏漏，如果觉得有问题的，欢迎纠错，一经采纳，还有奖励哦，纠错请加qq：1663959531 学完这个题库，把此题库都理解透彻应对各家企业面试完全没有问题。（当然，要加上好的项目以及透彻掌握）
牛客前端面试题附带难度标注
03-08
牛客前端面试题附带难度标注
牛客最新前端JS笔试百题
前端开发博客
11-29 1507
大家好，我是 漫步，分享一篇比较全的面试题，包含单选、多选和笔试题。喜欢记得关注我并设为星标。前言面经部分题目传送门: 牛客最新前端面经面试题汇总(含解析)[1]前几天空闲时间抓取了牛客最...
2024最新前端面试题（附答案及解析）
最新发布
weixin_44735965的博客
07-02 993
BFC 就是块级格式上下文，是页面盒模型布局中的一种 CSS 渲染模式，相当于一个独立的容器，里面的元素和外部的元素相互不影响。html 根元素float 浮动绝对定位overflow 不为 visiabledisplay 为表格布局或者弹性布局清除浮动防止同一 BFC 容器中的相邻元素间的外边距重叠问题主要分成两部分：渲染引擎(Layout Engine或Rendering Engine)和js引擎。
牛客前端面试题
weixin_46106879的博客
01-16 318
牛客前端面试题 https://www.nowcoder.com/ta/front-end-interview?query=&asc=true&order=&page=1
牛客前端面试题库
weixin_50927106的博客
09-16 972
题库 知识点Cookie、SessionStorage、 LocalStorage都是浏览器的本地存储。 共同点👇区别👇 闭包的作用:延申变量的作用范围 闭包带来的问题：由于垃圾回收器不会将闭包中变量销毁，于是就造成了内存泄露跨域是指浏览器的同源策略是不允许执行其他网站上的脚本，只要协议，主机地址，端口其中之一不同就算跨域 解决方法👇定位方案是控制元素的布局，有三种常见方案:BFC 即 Block Formatting Contexts (块级格式化上下文)，它属于上述定位方案的普通流。具有 BFC
FED1 表单类型
Aa12364567的博客
04-04 517
请依次写出以下类型的输入框。 1. 类型为密码，默认值为"nowcoder" 2. 类型为复选框，且状态为已勾选 <form> <!-- 补全代码 --> <input type="password" value="nowcoder"> <input type="checkbox" checked> </form> 请写出具有表格标题为"nowcoder"的2行3列表格结构。 <tab
2022最新牛客网校招面试最全题库（java、前端、c++、测试、算法）（附带解析和答案）
05-09
包括java篇（附带解析与答案）最新版，前端篇（附带解析与答案）最新版，测试篇（附带解析与答案）最新版，c++篇（附带解析与答案）最新版，算法篇（附带解析与答案）。 均为高清pdf，带详细目录
牛客校招面试题（附答案与解析）前端篇.zip
10-15
《牛客校招面试题（附答案与解析）前端篇》是针对前端开发岗位的一份珍贵资源，旨在帮助应届毕业生和求职者准备秋招面试。这份资料由牛客网提供，是一个集成了各类前端面试题及详细解答的文档，旨在帮助应聘者提升...
最新牛客软件测试面试题库.rar
04-05
测试开发面试题库，2020年4月最新版！内容包括软件测试基础知识、工作内容、文档能力、软件测试实例考察、语言基础、数据结构与算法（初步）、Spring框架、前端、Eclipse开发工具、设计模式、场景题以及计算机基础等...
JS数据类型
m0_49471668的博客
06-03 243
JS数据类型分为两类：一类是基本数据类型，也叫简单数据类型，包含7种类型，分别是Number 、String、Boolean、BigInt、Symbol、Null、Undefined。另一类是引用数据类型也叫复杂数据类型，通常用Object代表，普通对象，数组，正则，日期，Math数学函数都属于Object。 数据分成两大类的本质区别：基本数据类型和引用数据类型它们在内存中的存储方式不同。 基本数据类型是直接存储在栈中的简单数据段，占据空间小，属于被频繁使用的数据。 引用数据类型是存储在堆内存中，占据空间
前端面试刷题（牛客）
C-A-L-D
05-02 468
。。。
牛客网收集的前端面试题（html+css+js部分）
qq_65995258的博客
07-02 168
它是一个独立的渲染区域，只有块级元素参与， 它规定了内部的块级元素如何布局，并且与这个区域外部毫不相干。简单来说就是，
2024年前端最新笔试百题(1)，web开发项目实例
2401_84092694的博客
04-03 309
B. Promise.race在给定的promise中，某个fulfilled后才返回结果。A. Promise.all在所有给定的promise都fulfilled后才返回结果。B. 箭头函数不绑定this，会捕获其所在的上下文的this值，作为自己的this值。[“0x1”, “0x2”, “0x3”].map(parseInt) 的结果。C. promise.then的回调函数中，可以返回一个新的promise。A. 函数体内this的指向是定义时所在的对象，而不是使用时所在的对象。
2024 前端高频面试题之 JS 篇
Aybuai的博客
01-19 3568
① 所有引用类型都有一个__proto__(隐式原型)属性，属性值是一个普通的对象② 所有函数都有一个prototype(原型)属性，属性值是一个普通的对象③ 所有引用类型的__proto__属性指向它构造函数的prototype当访问一个对象的某个属性时，会先在这个对象本身属性上查找，如果没有找到，则会去它的__proto__隐式原型上查找，即它的构造函数的prototype，如果还没有找到就会再在构造函数的prototype的__proto__
牛客网前端面试题错题整理（一）
冰雪为融的博客
09-02 494
下面有关HTML的Doctype和严格模式与混杂模式的描述，错误的是？ 正确答案: C    &lt;!DOCTYPE&gt; 声明位于文档中的最前面，处于&lt;html&gt;标签之前。告知浏览器的解析器，用什么文档类型 规范来解析这个文档 在标准模式中，浏览器根据规范呈现页面；在混杂模式中，页面以一种比较宽松的向后兼容的方式显示 DOCTYPE不存在或格式不正确会导致文档以标准模式呈现...
前端经典面试题（摘自牛客）
weixin_45427936的博客
06-04 337
编程语言 说一说HTML 语义化 说一下盒模型 说一下浮动 说一说样式优先级的规则是什么？ 说一说CSS尺寸设置的单位 说一说BFC 说几个未知宽高元素水平垂直居中方法； 说一说三栏布局的实现方案 说一说JS数据类型有哪些，区别是什么？ 说一说null和undefined的区别，如何让一个属性变为null？ 说一说JavaScript有几种方法判断变量的类型？ 说一说数组去重都有哪些方法？ 说一说伪数组和数组的区别？ 说一说map和forEach的区别？ 说一说ES6中箭头函数？ 事件扩展符用过吗（…），什
牛客网前端面试题错题总结
冰雪为融的博客
09-13 946
1、当表单中包含文件上传控件时，需要将enctype设置为（） 正确答案：B application/x-www-form-urlencoded multipart/form-data text/explain file-data 解析： enctype 属性规定在发送到服务器之前应该如何对表单数据进行编码。 属性值 application/x-www-form-urlencoded ...
牛客网web面试题总结汇总
bigorange1的博客
06-22 1106
样式优先级、箭头函数、HTML语义化、Vue2.0 双向绑定
牛客大学前端面试宝典：快速精准备战校招
内容源于真实面试题大数据，但不包含算法部分，该部分将在牛客大学的公开课中免费讲解。宝典强调理解知识点的重要性，而非仅背诵答案。此外，宝典不涵盖项目经历、HR面和技术发展方向的讨论，但提供了准备项目经验和...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值