最后
小编的一位同事在校期间连续三年参加ACM-ICPC竞赛。从参赛开始,原计划每天刷一道算法题,实际上每天有时候不止一题,一年最终完成了 600+:
凭借三年刷题经验,他在校招中很快拿到了各大公司的offer。
入职前,他把他的刷题经验总结成1121页PDF书籍,作为礼物赠送给他的学弟学妹,希望同学们都能在最短时间内掌握校招常见的算法及解题思路。
整本书,我仔细看了一遍,作者非常细心地将常见核心算法题和汇总题拆分为4个章节。
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
而对于有时间的同学,作者还给出了他结合众多数据结构算法书籍,挑选出的一千多道题的解题思路和方法,以供有需要的同学慢慢研究。
正则
- 正则表达式 d+[d]+ 能匹配下列哪个字符串?
A. 123
B. 123a
C. d123
D. 123def
- 下面哪个不是RegExp对象的方法
A. test
B. match
C. exec
D. compile
- 以下哪项可以去除变量str中的所有空格
A. str.replace(/\s*/g,""
)
B. str.replace(/^\s|\s$/g,""
)
C. str.replace(/^\s*/, ""
)
D. str.replace(/(\s*$)/g, ""
)
答案
CBA
其他
- 下列函数哪个不是JavaScript的全局函数
A. encodeURI
B. parseFloat
C. round
D. eval
- 编写高性能JavaScript,以下描述错误的是
A. 遵循严格模式:“use strict”
B. 将js脚本放在页面顶部,加快渲染页面
C. 将js脚本成组打包,减少请求,尽量减少使用闭包
D. 使用非阻塞方式下载js脚本,最小化重绘(repaint)和回流(reflow)
- 有关JavaScript中系统方法的描述,错误的是?
A. parseFloat方法:该方法将一个字符串转换成对应的小数
B. isNaN方法:该方法用于检测参数是否为数值型,如果是,返回true,否则,返回false。
C. escape方法: 该方法返回对一个字符串编码后的结果字符串
D. eval方法:该方法将某个参数字符串作为一个JavaScript执行题
- 下面列出的浏览器,无webkit内核的是()
A. chrome
B. Safari
C. 搜狗浏览器
D. Firefox
- 下列代码哪个能够实现获取形式为 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;
};
- 如何最小化重绘(repaint)和回流(reflow)
A. 需要对元素进行复杂的操作时,可以先隐藏(display:“none”),操作完成后再显示
B. 需要创建多个DOM节点时,使用DocumentFragment创建完后一次性的加入document
C. 尽量避免用table布局(table元素一旦触发回流就会导致table里所有的其它元素回流)
D. 尽量不要使用 css 属性简写,如:用border-width, border-style, border-color代替border
答案
CBBDD
深入题
this
- 下列哪种方法不能改变this指向()
A. eval
B. apply
C. bind
D. call
- 在JavaScript中下面选项关于this描述正确的是
A. 在使用new实例化对象时, this指向这个实例对象
B. 将对象的方法赋值给变量A。执行A()时 该方法中的this指向这个对象。
C. 在函数定义时,this指向全局变量
D. 在浏览器下的全局范围内,this指向全局对象
- 下面有关JavaScript中call和apply方法的描述,错误的是?
A. call与apply都属于Function.prototype的一个方法,所以每个function实例都有call、apply属性
B. 两者传递的参数不同,call函数第一个参数都是要传入给当前对象的对象,apply不是
C. apply传入的是一个参数数组,也就是将多个参数组合成为一个数组传入
D. call传入的则是直接的参数列表。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。
答案
AAB
作用域(闭包)
- 内存泄漏是 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)
- 那个操作不会造成内存泄露
A. 没有清理的DOM元素引用
B. 被遗忘的定时器
C. 事件侦听没有移除
D. 局部变量不用时,没有设为null
- 下列关于闭包理解错误的是
A. 增加一定的内存消耗
B. 使用不当可能会导致内存泄漏
C. 可以使用闭包模拟私有方法
D. 闭包会改动对象的原型链
答案
DDD
原型与继承
- JavaScript实现继承的方式,不正确的是:
A. 原型链继承
B. 构造函数继承
C. 组合继承
D. 关联继承
- 所有对象都有原型
A. T
B. F
- 以下关于原型链的描述正确的是:
A. 通过原型链继承的属性和对象自己定义的属性等效
B. 通过原型链可以模拟对象的私有属性
C. 在对象上访问不存在的属性时,会依次遍历整条原型链
D. 所有 JavaScript 中的对象都是位于原型链顶端的 Object
的实例
答案
DBC
其他
- 以下不属于前端数据存储方式的是?
A. jsonp
B. cookie
C. localStorage
D. sessionStorage
答案
A
DOM题
事件流
- 将A元素拖拽并放置到B元素中,B元素需要做哪项操作()?
A. event.preventDefault()
B. event.prevent()
C. event.drag()
D. event.drop()
- 以下不支持冒泡的鼠标事件为( )?
A. mouseover
B. click
C. mouseleave
D. mousemove
- 在javascript中,用于阻止默认事件的默认操作的方法是
A. stopDeafault()
B. stopPropagation()
C. preventDefault()
D. preventDefaultEven()
- 事件传播的三个阶段是什么
目标 -> 捕获 -> 冒泡
冒泡 -> 目标 -> 捕获
目标 -> 冒泡 -> 捕获
捕获 -> 目标 -> 冒泡
- 下面有关 javascript 常见事件的触发情况,描述错误的是?
A. onchange:用户改变域的内容
B. onkeypress:某个键盘的键被按下或按住
C. onmousedown:某个鼠标按键被按下
D. onblur:元素获得焦点
答案
ACCDD
DOM遍历
- 下列哪项不属于DOM查找节点的属性()?
A. parentObj.firstChild
B. parentObj.children
C. neborNode.previousSibling
D. neborNode.siblings
- DOM中,给父节点添加子节点的正确方法为()?
A. appendChild(parentNode,newNode);
B. append(parentNode,newNode);
C. parentNode.append(newNode);
D. parentNode.appendChild(newNode);
- JavaScript中document.getElementById()返回值的类型为?
A. Array
B. Object
C. String
D. Function
- DOM中,给父节点添加子节点的正确方法为()?
A. appendChild(parentNode,newNode);
B. append(parentNode,newNode);
C. parentNode.append(newNode);
D. parentNode.appendChild(newNode);
答案
DDBD
其他
- DOM元素的以下属性改变会导致重排(reflows)的是
outline
visiblity
font-size
background-color
答案
C
BOM题
- setInterval(updateClock,60)的含义是( )?
A. 每隔60秒调用一次updateClock()
B. 每隔60毫秒调用一次updateClock()
C. 每隔60分钟调用一次updateClock()
D. 每分钟调用60次updateClock()
- 使用方法( )可以获取到地理位置所在的经纬度?
A. Geolocation.watchPosition()
B. Geolocation.getCurrentPosition()
C. Geolocation.getPosition()
D. Geolocation.Position()
- setInterval(“alert(‘welcome’);”,1000);这段代码的意思是
A. 等待1000秒后,再弹出一个对话框
B. 等待1秒钟后弹出一个对话框
C. 每隔一秒钟弹出一个对话框
D. 语句报错,语法有问题
答案
BBC
ES6题
箭头函数
- 下列对js箭头函数描述错误的是()
A. 箭头函数没有原型属性
B. 箭头函数不绑定this,会捕获其所在的上下文的this值,作为自己的this值
C. 箭头函数可以作为构造函数,使用new
D. 箭头函数不绑定arguments,取而代之用rest参数解决
- 关于箭头函数下列说法错误的一项是:
A. 函数体内this的指向是定义时所在的对象,而不是使用时所在的对象
B. 箭头函数内不能使用arguments对象
C. 箭头函数不能使用yield命令
D. 可以使用new创建一个箭头函数的实例
答案
CD
promise
- 关于将 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 会被输出
- 以下方案中,不是用于解决回调陷阱的的是:
A. Promise
B. Generator
C. async
D. Proxy
- 在 ECMAScript6 中,不属于promise的状态是:
A. Pending
B. Pause
C. Fulfilled
D. Rejected
答案
CDB
解构赋值
- 关于ES6解构表达式,描述正确的是()
let [a,b, c,d, e] = “hello”;
A. e = “hello”;
B. 其它都为undefined
C. 当中 a = “h”, b = “e”;
D. 语法报错
答案
C
JS基础
- 下面哪些数组方法会改变原数组
A. push
B. concat
C. splice
D. map
- 下面可以声明数字的js代码是
A. const a = 0xa1
B. const a = 076
C. const a = 0b21
D. const a = 7e2
- 以下属于操作符 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)
- 以下()结果等于字符串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
- 下面的等式成立的是?
A. parseInt(46.8) ==
parseFloat(46.8)
B. NaN !==
NaN
C. isNaN(‘abc’) ==
NaN
D. typeof NaN ===
‘number’
- 以下哪些选项可以将集合A转化为数组?
A. Array.from(A)
B. [].slice.apply(A)
C. […A]
D. [].map.call(A, o => o)
- 下列结果返回 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深入
- 关于以下代码,说法正确的有哪些?
function Person() { }
var person = new Person();
A. 每一个原型都有一个constructor属性指向关联的构造函数。
B. 每一个对象都有一个prototype属性。
C. Object.getPrototypeOf(person) === Person.prototype
D. person.constructor === Person
- 下列在 JS 时间循环机制中属于微任务(microTask)的是?
A. process.nextTick
B. promise
C. setTimeout
D. setInterval
答案
ACD AB
ES6
- 以下关于let和const的说法中正确的是:
A. let声明的变量值和类型都可以改变
B. const声明的常量不可以改变
C. 两者都不存在变量提升,同时存在暂时性死区,只能在声明的位置后面使用
D. const可以先声明再初始化,可以后赋值
- 下面关于Promise说法正确的是(注意“返回结果”的意思包含成功或者失败)
A. Promise.all在所有给定的promise都fulfilled后才返回结果
B. Promise.race在给定的promise中,某个fulfilled后才返回结果
C. promise.then的回调函数中,可以返回一个新的promise
D. 对于一个向后台获取数据已经产生结果的promise:p1,再次调用p1.then,不会去重新发起请求获取数据
答案
ABC CD
DOM
- 下列关于使用 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’
- 下列方法可用于阻止事件冒泡的有
A. event.cancelBubble = true;
B. event.stopPropagation();
C. event.preventDefault();
D. return false;
答案
BCD ABD
类型检测
-
在JavaScript中,有var arr = []; typeof arr的结果为
-
以下使用 typeof 操作符的代码的输出结果为
var x = typeof x
var res = typeof typeof x;
console.log(x, res)
-
[typeof null, null instanceof Object]的结果是什么
-
typeof typeof 0
-
JavaScript的typeof运算符的可能结果为array?解释为什么
-
下面代码的输出结果是多少?
var arr = [];
console.log(typeof arr, Object.prototype.toString.call(arr));
- console.log(Object.prototype.toString.call(undefined))
类型转换
-
表达式 “2”+3+4 的值为
-
console.log(‘5’ + 3, 5 + ‘3’)
-
var a=parseInt(“111办公室”);alert(a);
-
[“0x1”, “0x2”, “0x3”].map(parseInt) 的结果
-
在js中执行 1+'1’的结果是?
-
在js中执行 parseInt(‘77’,40)的结果是?
逻辑判断
-
请给出 [5<6<3,3<2<4] 代码的运行结果
-
(2<3)||(3<2) 表达式将返回值为
-
console.log(true||false&&false, true&&false||true)的输出结果是?
其他
-
1 + - + + + - + 1 的结果是
-
[ ‘a’, ,‘b’, ,].length 的结果是
JS基础
- 下面两个程序的输出结果分别是?
// 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’));
- p标签的的内容会显示什么?
- document.write的结果会是什么?
function funcA(x){
var temp = 4;
function funcB(y){
document.write( ++x + y + (temp–));
}
funcB(5);
}
funcA(6)
- 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);
- 下面程序的输出结果是多少?
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));
- 下面程序的输出结果是多少?
String.prototype.GetNum = function() {
var regEx = /[^\d]/g;
return this.replace(regEx, ‘’);
};
var str = “a1b2c3”;
str = str.GetNum();
alert(str);
- 下面程序的输出结果是多少?
function sum(a, b) {
return a + b;
}
sum(1, “2”);
- 下面程序的输出结果是多少?
var str = “我非常喜欢编程”;
str.length = 3;
console.log(str);
- 下面程序的输出结果是多少?
let number = 0;
console.log(number++);
console.log(++number);
console.log(number);
- 下面程序的输出结果是多少?
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))
- 下面程序输出结果是多少?
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);
- 下面代码的输出结果是什么?
var a = 3;
var b = new Number(3);
var c = 3;
console.log(a == b);
console.log(a === b);
console.log(b === c);
- 执行下列语句后,a.length的值为?
var a = [];
a.push(1, 2);
a.shift(3, 4);
a.concat([5, 6]);
a.splice(0, 1, 2);
- 下面这几段代码分别输出结果是多少?为什么?
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]);
- 下面每项的返回值是什么?为什么?
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
- 下面程序的输出结果是多少?
var array = []
for(var i = 0; i < 3; i++) {
array.push(() => i)
}
var newArray = array.map(el => el())
console.log(newArray)
- 下面程序的输出结果是多少?
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));
- 下面程序的输出结果是多少?
console.log(typeof undefined == typeof NULL);
console.log(typeof function () {} == typeof class {});
- 执行后a和b.age的值分别为
var a = 10
var b = {
age: 11
}
function fn(x,y) {
–y.age;
return --x;
}
fn(a,b)
- 下面程序的执行结果是:
var number = 4;
var numberFactorial = (function (number){
return (number === 0)? 1: number* factorial(number-1)
})(number)
console.log(numberFactorial)
- 下面程序的输出结果是:
var array = []
for(var i = 0; i < 3; i++) {
array.push(() => i)
}
var newArray = array.map(el => el())
console.log(newArray)
- 下面程序的输出结果是:
function addToList(item, list) {
return list.push(item)
}
const result = addToList(“nowcoder”, [“hello”])
console.log(result)
- 下面程序的输出结果是:
const first = () => { console.log(‘first’); return false; }
const second = () => { console.log(‘second’); return true; }
console.log( first() && second() );
console.log( second() || first() );
- 下面代码的输出结果是:
var s=‘12ab3cd’, arr=s.split(/\d/);
console.log(arr[3],arr[4])
- 下面程序的输出结果是:
function getAge(…args) {
console.log(typeof args);
}
getAge(21);
- 下面程序的输出结果是:
var arr=[1,2,3];
arr.push(arr.shift())
console.log(arr[1],arr[2])
JS深入
this指向
- 下列程序的输出结果是多少?为什么?
var x = 1;
var obj = {
x: 3,
fun:function () {
var x = 5;
return this.x;
}
};
var fun = obj.fun;
console.log( obj.fun(), fun() );
- 下列程序的输出结果是多少?你能理清楚test函数的this指向吗?
var a = 5;
function test() {
a = 0;
alert(a);
alert(this.a);
var a;
alert(a);
}
new test();
- 下列程序的输出结果是多少?为什么?
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’})
- 执行以下代码,输出结果分别是多少?
let obj1 = {
a: 1,
foo: () => {
console.log(this.a)
}
}
// log1
obj1.foo()
const obj2 = obj1.foo
// log2
obj2()
- 下面程序的输出结果是什么?为什么?
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)
- 请表述以下代码的执行结果和原因
var person = {
age: 18,
getAge: function() {
return this.age;
}
};
var getAge = person.getAge
getAge()
- 请按顺序写出打印结果,并说明原因。
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);
- 下面程序的执行结果是:
var obj = {
name:“zhangsan”,
sayName:function(){
console.info(this.name);
}
}
var wfunc = obj.sayName;
obj.sayName();
wfunc();
var name = “lisi”;
obj.sayName();
wfunc();
- 下面程序的输出结果是:
var name=‘test’
var a = {
name: ‘ass’,
getName: function() {
return this.name;
}
}
var b = a.getName;
b();
事件循环
- 下列程序的输出结果分别是多少?为什么?
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)
})
- 下面程序的输出结果依次是多少?
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)
- 下面程序的输出结果是
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);
- 下面程序的输出结果是?
(async () => {
console.log(1);
setTimeout(() => {
console.log(2);
}, 0);
await new Promise((resolve, reject) => {
console.log(3);
}).then(() => {
console.log(4);
});
console.log(5);
})();
- 下面程序的输出结果是:
new Promise((resolve) => {
console.log(‘1’)
resolve()
console.log(‘2’)
}).then(() => {
console.log(‘3’)
})
setTimeout(() => {
console.log(‘4’)
})
console.log(‘5’)
- 下面程序的输出结果是:
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)
- 下面程序的输出结果是:
setTimeout(function() {
console.log(‘setTimeout’);
}, 0);
Promise.resolve().then(function() {
console.log(‘promise1’);
}).then(function() {
console.log(‘promise2’);
});
- 请表述以下代码的执行结果和原因
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)
- 在网页中有两个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);
})();
- 下面程序的输出结果是:
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));
- 下面程序的输出结果是:
console.log(‘one’);
setTimeout(function() { console.log(‘two’); }, 0);
Promise.resolve()
.then(function() { console.log(‘three’); })
css
1,盒模型
2,如何实现一个最大的正方形
3,一行水平居中,多行居左
4,水平垂直居中
5,两栏布局,左边固定,右边自适应,左右不重叠
6,如何实现左右等高布局
7,画三角形
8,link @import导入css
9,BFC理解
js
1,判断 js 类型的方式
2,ES5 和 ES6 分别几种方式声明变量
3,闭包的概念?优缺点?
4,浅拷贝和深拷贝
5,数组去重的方法
6,DOM 事件有哪些阶段?谈谈对事件代理的理解
7,js 执行机制、事件循环
8,介绍下 promise.all
9,async 和 await,
10,ES6 的 class 和构造函数的区别
11,transform、translate、transition 分别是什么属性?CSS 中常用的实现动画方式,
12,介绍一下rAF(requestAnimationFrame)
13,javascript 的垃圾回收机制讲一下,
14,对前端性能优化有什么了解?一般都通过那几个方面去优化的?
开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
log(5);
})();
- 下面程序的输出结果是:
new Promise((resolve) => {
console.log(‘1’)
resolve()
console.log(‘2’)
}).then(() => {
console.log(‘3’)
})
setTimeout(() => {
console.log(‘4’)
})
console.log(‘5’)
- 下面程序的输出结果是:
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)
- 下面程序的输出结果是:
setTimeout(function() {
console.log(‘setTimeout’);
}, 0);
Promise.resolve().then(function() {
console.log(‘promise1’);
}).then(function() {
console.log(‘promise2’);
});
- 请表述以下代码的执行结果和原因
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)
- 在网页中有两个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);
})();
- 下面程序的输出结果是:
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));
- 下面程序的输出结果是:
console.log(‘one’);
setTimeout(function() { console.log(‘two’); }, 0);
Promise.resolve()
.then(function() { console.log(‘three’); })
css
1,盒模型
2,如何实现一个最大的正方形
3,一行水平居中,多行居左
4,水平垂直居中
5,两栏布局,左边固定,右边自适应,左右不重叠
6,如何实现左右等高布局
7,画三角形
8,link @import导入css
9,BFC理解
[外链图片转存中…(img-AyrAjxht-1715755327245)]
js
1,判断 js 类型的方式
2,ES5 和 ES6 分别几种方式声明变量
3,闭包的概念?优缺点?
4,浅拷贝和深拷贝
5,数组去重的方法
6,DOM 事件有哪些阶段?谈谈对事件代理的理解
7,js 执行机制、事件循环
8,介绍下 promise.all
9,async 和 await,
10,ES6 的 class 和构造函数的区别
11,transform、translate、transition 分别是什么属性?CSS 中常用的实现动画方式,
12,介绍一下rAF(requestAnimationFrame)
13,javascript 的垃圾回收机制讲一下,
14,对前端性能优化有什么了解?一般都通过那几个方面去优化的?
[外链图片转存中…(img-1zZJxxdz-1715755327246)]