前端面试题(3)，Web前端程序员面试笔试宝典

最新推荐文章于 2024-05-12 06:33:16 发布
最新推荐文章于 2024-05-12 06:33:16 发布
阅读量1k 收藏 16
点赞数 26
分类专栏： 2024年程序员学习 文章标签： 前端 面试 职场和发展
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_60635176/article/details/137742650
版权

先自我介绍一下，小编浙江大学毕业，去过华为、字节跳动等大厂，目前阿里P7

深知大多数程序员，想要提升技能，往往是自己摸索成长，但自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！

因此收集整理了一份《2024年最新Web前端全套学习资料》，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友。
img
img
img
img
img
img

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上前端开发知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

如果你需要这些资料，可以添加V获取：vip1024c （备注前端）
img

正文

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指向

题目解析：this指向题目解析及扩展[3]

关于this还可以看看：可能是最好的 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);

}

})();

// 第二段代码：

(async () => {

[ 1, 2, 3, 4 ].forEach(async (i) => {

await log(i, 1000);

});

})();

// 第三段代码：

(async () => {

for (const i of [ 1, 2, 3, 4 ]) {

await log(i, 1000);

}

})();

原型与原型链

关于原型JS：看完这篇文章，彻底了解 “原型” & “this”

传送门: 原型与原型链题目解析[4]

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

function Fn1(name) {

if(name){

this.name = name;

}

}

Fn1.prototype.name=“jack”

let a = new Fn1();

console.log(‘a:’, a.name);

function Fn2(name) {

this.name = name;

}

Fn2.prototype.name=“jack”

let b = new Fn2();

console.log(‘b:’, b.name);

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

var Foo = (function() {

var x = 0;

function Foo() {}

Foo.prototype.increment = function() {

++x;

console.log(x);

};

return Foo;

})();

var a = new Foo();

a.increment();

a.increment();

var b = new Foo();

a.increment();

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

var name = ‘Jay’

function Person(name){

this.name = name;

console.log(this.name)

}

var a = Person(‘Tom’)

console.log(name)

console.log(a)

var b = new Person(‘Michael’)

console.log(b)

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

class A{}

class B extends A{}

const a = new A()

const b = new B()

a.proto

b.proto

B. proto

B. prototype.proto

b.proto.proto

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

function test() {

getName = function() {

Promise.resolve().then(() => console.log(0));

console.log(1);

};

return this;

}

test.getName = function() {

setTimeout(() => console.log(2), 0);

console.log(3);

};

test.prototype.getName = function() {

console.log(4);

};

var getName = function() {

console.log(5);

};

function getName() {

console.log(6);

}

test.getName();

getName();

test().getName();

getName();

new test.getName();

new test().getName();

new new test().getName();

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

var tmp = {};

var A = function() {};

A. prototype = tmp;

var a = new A();

A. prototype = {};

var b = Object.create(tmp);

b.constructor = A. constructor;

console.log(a instanceof A);

console.log(b instanceof A);

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

最后：

总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。

面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化的资料的朋友，可以添加V获取：vip1024c （备注前端）
img

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

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

}

})();

// 第二段代码：

(async () => {

[ 1, 2, 3, 4 ].forEach(async (i) => {

await log(i, 1000);

});

})();

// 第三段代码：

(async () => {

for (const i of [ 1, 2, 3, 4 ]) {

await log(i, 1000);

}

})();

原型与原型链

关于原型JS：看完这篇文章，彻底了解 “原型” & “this”

传送门: 原型与原型链题目解析[4]

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

function Fn1(name) {

if(name){

this.name = name;

}

}

Fn1.prototype.name=“jack”

let a = new Fn1();

console.log(‘a:’, a.name);

function Fn2(name) {

this.name = name;

}

Fn2.prototype.name=“jack”

let b = new Fn2();

console.log(‘b:’, b.name);

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

var Foo = (function() {

var x = 0;

function Foo() {}

Foo.prototype.increment = function() {

++x;

console.log(x);

};

return Foo;

})();

var a = new Foo();

a.increment();

a.increment();

var b = new Foo();

a.increment();

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

var name = ‘Jay’

function Person(name){

this.name = name;

console.log(this.name)

}

var a = Person(‘Tom’)

console.log(name)

console.log(a)

var b = new Person(‘Michael’)

console.log(b)

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

class A{}

class B extends A{}

const a = new A()

const b = new B()

a.proto

b.proto

B. proto

B. prototype.proto

b.proto.proto

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

function test() {

getName = function() {

Promise.resolve().then(() => console.log(0));

console.log(1);

};

return this;

}

test.getName = function() {

setTimeout(() => console.log(2), 0);

console.log(3);

};

test.prototype.getName = function() {

console.log(4);

};

var getName = function() {

console.log(5);

};

function getName() {

console.log(6);

}

test.getName();

getName();

test().getName();

getName();

new test.getName();

new test().getName();

new new test().getName();

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

var tmp = {};

var A = function() {};

A. prototype = tmp;

var a = new A();

A. prototype = {};

var b = Object.create(tmp);

b.constructor = A. constructor;

console.log(a instanceof A);

console.log(b instanceof A);

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

最后：

总结来说，面试成功=基础知识+项目经验+表达技巧+运气。我们无法控制运气，但是我们可以在别的地方花更多时间，每个环节都提前做好准备。

面试一方面是为了找到工作，升职加薪，另一方面也是对于自我能力的考察。能够面试成功不仅仅是来自面试前的临时抱佛脚，更重要的是在平时学习和工作中不断积累和坚持，把每个知识点、每一次项目开发、每次遇到的难点知识，做好积累，实践和总结。

[外链图片转存中…(img-dTS82mLk-1713072131995)]

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化的资料的朋友，可以添加V获取：vip1024c （备注前端）
[外链图片转存中…(img-c3uAYU8p-1713072131995)]

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

m0_60635176
关注
专栏目录
WEB前端经典笔试/面试题
q_qiong的博客
10-21 1380
1.HTML和XHTML，XML，DHTML有什么区别     HTML：超文本标记语言，专门编写网页内容的语言。    XHTML：严格的html标准，元素必须被正确地嵌套，元素必须被关闭，标签名必须用小写字母，文档必须拥有根元素。     XML：可扩展的标记语言，标签名和属性名可自定义。     DHTML：动态的html技术，是html+css+js的统称。 2.写出几种
面试题-练习
Qixinzhu的博客
12-07 4343
题目来源于：https://mp.weixin.qq.com/s/eMiJbyjJcXkcgUiJU80fWQ JS 基础 js概念与类型检测 1.以下不属于 typeof 运算符返回值的是？ B //D A. “string” B. “function” C. “object” D. “null” 2.执行以下代码，错误的输出结果是？ C A. 输入：typeof {“x”:1} 输出：“object” B. 输入：typeof 1 输出：“number” C. 输入：typeof [{x:1}] 输出
【题解】百度2021校招Web前端工程师笔试卷（第一批）：单选题、多选题
karshey的博客
03-12 832
【题解】百度2021校招Web前端工程师笔试卷（第一批）：单选题、多选题
javaScript面向对象的程序设计(二)
枫叶
04-25 234
前面介绍了创建对象的两种模式即工厂模式和构造函数模式。 除此外一javaScript还提供以下几种模式。 一。原型模式 按照js高级编程的定义。 每一个函数都有一个prototype属性。 这个属性也称之为原型 ，这个属性是一个指针。 指向一个对象。而这个对象的用途是包含可以由特定类型的所有实例共享的属性和方法。 那么换而言之prototype就是通过调用构造函数创建出的那个对象的原型对象。 ...
JavaScript面试题
m0_51520593的博客
10-30 193
JavaScript (1)JS中的对象是什么? JavaScript 中的所有事物都是对象：字符串、数字、数组、日期等等。 (2)JS的对象和Java,C#中的对象有什么区别? java是面向对象的，也就是有继承，封装，多态。 js是基于对象的，就是没有上述三点。js的继承等是通过原型链或其他方法进行实现的，ECMAscript6的class(类)本质上还是对象，与java的class(类)是不同的。java的类是不可以直接运行的。js的对象是可以直接调用运行的。 (3)JS如何创建对象?(你有哪些方法)
牛客最新前端JS笔试百题
前端开发博客
11-29 1604
大家好，我是 漫步，分享一篇比较全的面试题，包含单选、多选和笔试题。喜欢记得关注我并设为星标。前言面经部分题目传送门: 牛客最新前端面经面试题汇总(含解析)[1]前几天空闲时间抓取了牛客最...
2024年Web前端最新牛客最新前端JS面试百题(2)，2024年最新前端面试项目中的难点
最新发布
2401_84433829的博客
05-12 267
如果你已经下定决心要转行做编程行业，在最开始的时候就要对自己的学习有一个基本的规划，还要对这个行业的技术需求有一个基本的了解。有一个已就业为目的的学习目标，然后为之努力，坚持到底。如果你有幸看到这篇文章，希望对你有所帮助，祝你转行成功。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】答案ACCDD。
前端面试宝典V3.0.pdf
07-11
《前端面试宝典》是为前端开发者准备的一份详尽的面试指南，涵盖了从基础到高级的诸多领域。这本书旨在帮助求职者全面了解并掌握前端开发的关键知识点，以提升他们在面试中的竞争力。以下是对其中一些重点内容的详细...
前端笔试题分享 前端面试pdf.pdf
12-14
本资源为前端笔试题分享，涵盖了JavaScript基础、前端web前端相关知识点，以下是从给定的文件中生成的相关知识点： 一、JavaScript基础 1. 手写Object.create思路：将传入的对象作为原型，通过创建一个新的构造...
笔试面试题宝典（前端开发）.pdf
09-19
前端开发面试题中涉及的知识点涵盖了HTML5文档声明、CSS中元素的分类、样式导入方式的区别、浏览器内核的概念及其组成部分、常见浏览器内核类型、HTML5的新特性与移除的元素、HTML5新标签的浏览器兼容性处理方法以及...
程序员面试笔试宝典(何昊,叶向阳) PDF高清扫描版.rar
06-24
程序员面试笔试宝典 目录 前言 上篇 面试笔试经验技巧篇 第1章 面试官箴言 2 第2章 面试心得交流 9 第3章 企业面试笔试攻略 20 第4章 面试笔试技巧 42 第5章 英文面试攻略 82 第6章 智力题攻略 102 下篇 面试笔试...
小米前端笔试题记录——动态规划
swallowblank的博客
06-20 1410
选择题 Promise.all， race，allSettled 下面关于Promise说法正确的是（注意“返回结果”的意思包含成功或者失败）: A. Promise.all在所有给定的promise都fulfilled后才返回结果 B. Promise.race在给定的promise中，某个fulfilled后才返回结果 C. promise.then的回调函数中，可以返回一个新的promise D. 对于一个向后台获取数据已经产生结果的promise:p1，再次调用p1.then，不会去重新发起请求获取
Promise.all()、Promise.allSettled()原理及实现
qq_39085895的博客
12-27 1069
Promise.all() 原理简述： MDN： Promise.all() 方法接收一个promise的iterable类型（注：Array，Map，Set都属于ES6的iterable类型）的输入。 并且只返回一个Promise实例， 输入的所有promise的resolve回调的结果是一个数组。 Promise的resolve回调执行是在所有输入的promise的resolve回调都结束，或者输入的iterable里没有promise了的时候。 它的reject回调执行是，只要任何一个输入的pro
promise.all和promise.race的理解
Liingot的博客
11-30 940
大家肯定都知道promise是es6中提出的异步操作方法，但是promise.all和promise.rece这两个问题大家就肯定会有疑惑接下来咱们就来看看。 1：promise.all 不多说直接上代码 let run = (time) =&gt; { return new Promise((resolve, reject) =&gt; { setTimeout...
理解和使用Promise.all和Promise.race
weixin_43804804的博客
03-17 335
一、Pomise.all的使用 Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。 具体代码如下： let p1 = new Promise((resolve, reject) => { resolve('成功了') }) let p2 = new Promise((resolve, reject) => { resolve('succe
前端程序员面试笔试宝典(1)
2401_84433570的博客
05-02 758
小编的一位同事在校期间连续三年参加ACM-ICPC竞赛。从参赛开始，原计划每天刷一道算法题，实际上每天有时候不止一题，一年最终完成了 600+：凭借三年刷题经验，他在校招中很快拿到了各大公司的offer。入职前，他把他的刷题经验总结成1121页PDF书籍，作为礼物赠送给他的学弟学妹，希望同学们都能在最短时间内掌握校招常见的算法及解题思路。整本书，我仔细看了一遍，作者非常细心地将常见核心算法题和汇总题拆分为4个章节。开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
java程序员面试笔试宝典 + 115个Java面试题和答案+进入IT行业必读的324个java面试题
07-25
Java程序员在面试和笔试过程中，会遇到各种各样的问题，这些问题涵盖了Java语言的基础、进阶、多线程、网络编程、数据库操作、设计模式、框架应用等多个方面。本篇文章将根据提供的资料，深入探讨其中的一些关键知识...
异步篇：Promise.all() & .race()
显磊的博客
12-04 647
一般 Promise 是采用 Promise 链的顺序控制流程的，Promise 还有其他异步模式，用来简化异步的流程控制，易于追踪。 一. Promise.all([…]) 在异步序列中，任意时刻只能有一个异步任务执行，如果想同时执行，怎么实现呢?可以用到 Promise.all([…]),它并不能让两个异步任务同时执行，但是可以让两个异步任务执行完了之后再让后面的流程继续执行，相对于这两个异步...
理解与使用Promise.all 与 Promise.race
前端e栈
08-03 691
es6中Promise对象的 all方法与race方法使用 Promise.all Promise.all()方法用于将多个 Promise 实例，包装成一个新的 Promise 实例,同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。 例如：创建两个都会返回成功的Promise,调用Promise.all方法，会在所有结果都返回成功之后返回结果数组，并且，结果数组的顺序与all方法传入的顺序相同 let p1 = new Promise
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值