2017年前端面试题大全集,只发一次!

  1. 云栖社区>
  2. 博客>
  3. 正文

2017年前端面试题大全集,只发一次!

茶花盛开 2017-07-24 10:02:21 浏览8765
展开阅读全文

2017年BAT公司常见的Web前端面试题整理

1.JavaScript是一门什么样的语言,它有哪些特点?

没有标准答案。

2.JavaScript的数据类型都有什么?

基本数据类型:String,boolean,Number,Undefined

引用数据类型:Object(Array,Date,RegExp,Function,Null)

那么问题来了,如何判断某变量是否为数组数据类型?

方法一.判断其是否具有“数组性质”,如slice()方法。可自己给该变量定义slice方法,故有时会失效

方法二.obj instanceof Array 在某些IE版本中不正确

方法三.方法一二皆有漏洞,在ECMA Script5中定义了新方法Array.isArray(), 保证其兼容性,最好的方法如下:

dBrdo1HkSAS9gjOTyfDydVGxMd4A3ZeZsWdicc9J

dBrdo1HkSAS9gjOTyfDydRAZRoGXXMtiafFaIOvY

如果你想学习web前端可以来这个群,首先是二九一,中间是八五一,最后是一八九,里面可以免费的学习交流,也有资料可以下载。

3.已知ID的Input输入框,希望改变文本框的背景颜色,怎么做?(原生JS)

1240

4.希望获取到页面中所有的checkbox怎么做?(原生JS)

dBrdo1HkSAS9gjOTyfDydbV07aibUEeBQGRNiayv

dBrdo1HkSAS9gjOTyfDydZjaLwEXSa2bIQzaRQGk

5.Html事件绑定有几种方式?

直接在DOM里绑定事件:

这种方式称为原生事件或者属性事件

在JS里通过onclick绑定:xxx.onclick = test

Dom标准通过事件添加进行绑定:addEventListener("click",test, false) //第三个参数为是否支持事件捕捉

IE事件:attachEvent("onclick",test)

那么问题来了,Javascript的事件流模型都有什么?

“事件捕捉”:事件由最不具体的节点先接收,然后逐级向下,一直到最具体的

目标事件

“事件冒泡”:事件开始由最具体的元素接受,然后逐级向上传播

“DOM事件流”:三个阶段:事件捕捉,目标阶段,事件冒泡

IE事件流:目标事件和事件冒泡

阻止事件冒泡的方式:

dBrdo1HkSAS9gjOTyfDyddDJG7KpwnGLzP0cLEZn

阻止事件的默认行为:

dBrdo1HkSAS9gjOTyfDydW6zwPczeAFcwBG4icvR

6.看下列代码,将会输出什么?(变量声明提升)

dBrdo1HkSAS9gjOTyfDydaEOgib2ibXnNicj8N5t

上面的代码经过变量提升后,等价于下面的代码

dBrdo1HkSAS9gjOTyfDydTicc2TlS6dDJDKib0DZ

再看下面的输出结果:

dBrdo1HkSAS9gjOTyfDydYdW8Pfcurcngv8yibYh

此时打印a函数,不会打印1,因为下面是一个函数表达式,跟变量声明一样,只会把var a;提升到最前面,a=function(){}保留,会覆盖前面的a=1;因此打印函数。

此题目,我再百度面试的时候问到过。

7.掌握样式的优先级。

!important > style(内联) > Id(权重100) > class(权重10) > 标签(权重1) 同类别的样式,后面的会覆盖前面的。

百度视频部门一道面试题是这样的:

dBrdo1HkSAS9gjOTyfDydeTZZ6pEYHC1c4fe3hRO

8.怎样添加、移除、移动、复制、创建和查找节点

1)创建新节点

createDocumentFragment() //创建一个DOM片段

createElement() //创建一个具体的元素

createTextNode() //创建一个文本节点

2)添加、移除、替换、插入

appendChild() //添加

removeChild() //移除

replaceChild() //替换

insertBefore() //插入

3)查找

getElementsByTagName() //通过标签名称

getElementsByName() //通过元素的Name属性的值

getElementById() //通过元素Id,唯一性

9.用js写一个正则匹配标签中是否包含一个class(百度面试题)

dBrdo1HkSAS9gjOTyfDydZJYxlAcquMbjbw9atqQ

10.事件循环绑定,输出结果(考察闭包)

dBrdo1HkSAS9gjOTyfDydcmDT2sN6VfCL38RK4vN

通过闭包封装后的代码:

dBrdo1HkSAS9gjOTyfDydVLTNicARgfCibLowXl7

闭包我所知道的两个作用:

a.通过闭包可以把局部变量传递出来,就是通过闭包可以访问函数内部的变量,比如下面的代码:

dBrdo1HkSAS9gjOTyfDydRicpLic0YogXwb89yca

通过闭包就可以访问函数内部的局部变量,并且实现数量累加。

b.使用闭包可以避免空间污染,闭包内部的变量都只能在内部使用,这样有效避免和外部变量的混淆。(个人理解)

11.js数组去重。

dBrdo1HkSAS9gjOTyfDydfWDAlg3hNF2F5iaWhMi

12.两个div标签,如何控制标签左边固定,右边自适应,左边div标签的宽度为100px(滴滴面试题)

dBrdo1HkSAS9gjOTyfDydeuNgt1icr4sLsicfCW1

滴滴面试起初问我,现在有并排的三个Div框,如何实现三个div都自适应,我当时就懵了,这个考察的是display:table的使用

dBrdo1HkSAS9gjOTyfDydfib6iadIg1uEhdmicRF

dBrdo1HkSAS9gjOTyfDydZIoegp1axbs58RbJh9b

13.实现一个函数clone,可以对JavaScript中的5种主要的数据类型(包括Number、String、Object、Array、Boolean)进行值复制

考察点1:对于基本数据类型和引用数据类型在内存中存放的是值还是指针这一区别是否清楚

考察点2:是否知道如何判断一个变量是什么类型的

考察点3:递归算法的设计

dBrdo1HkSAS9gjOTyfDydaLBD5wrvZcpgvJGMroL


14.继承的使用

dBrdo1HkSAS9gjOTyfDydeaAs69DGXlscH1YaOwn

15.请评价以下代码并给出改进意见

dBrdo1HkSAS9gjOTyfDydWibUesthujOoKic6M3K

评价:

不应该在if和else语句中声明addListener函数,应该提前先声明,定义全局变量;

不需要使用window.addEventListener或document.all来进行检测浏览器,应该使用能力检测;

由于attachEvent在IE中有this指向问题,所以调用它时需要处理一下

改进如下:

dBrdo1HkSAS9gjOTyfDydS8QXEiaLg1Eq9B7uhcS

16.对作用域上下文和this的理解,看下列代码:

dBrdo1HkSAS9gjOTyfDydQYvKg16fyOUsEqdqeGX

网友评论

登录后评论
0/500
评论
茶花盛开
+ 关注