javascript面试题，js常见面试题及答案

本篇文章给大家谈谈javascript面试题，以及js常见面试题及答案对应的知识点，文章可能有点长，但是希望大家可以阅读完，增长自己的知识，最重要的是希望对各位有所帮助，可以解决了您的问题，不要忘了收藏本站喔。

js基础面试题131-160道题目

131.用原生 JavaScript的实现过什么功能吗？

参考答案：轮播图、手风琴、放大镜、3D动画效果等，切记，所答的一定要知道实现原理！，不知道还不如不说！

参与互动

132.javascript代码中的"use strict";是什么意思?使用它区别是什么？

参考答案：意思是使用严格模式，使用严格模式，一些不规范的语法将不再支持

参与互动

133.简述创建函数的几种方式

参考答案：

参与互动

134.window.location.search()返回的是什么？

参考答案：查询(参数)部分。除了给动态语言赋值以外，我们同样可以给静态页面,并使用 javascript来获得相信应的参数值返回值：?ver=1.0&id=timlq也就是问号后面的！

参与互动

135.window.location.hash返回的是什么？

参考答案：锚点，返回值：#love；

参与互动

136.window.location.reload()作用？

参考答案：刷新当前页面

参与互动

137.为什么不能定义 1px左右的 p容器？

参考答案： IE6下这个问题是因为默认的行高造成的，解决的方法也有很多，例如： overflow:hidden| zoom:0.08| line-height:1px

参与互动

138.BOM对象有哪些，列举 window对象？

参考答案：

参与互动

139.简述 readonly与 disabled的区别

参考答案：

参与互动

140.为什么扩展 javascript内置对象不是好的做法？

参考答案：

参与互动

141.什么是三元表达式？“三元”表示什么意思？

参考答案：三元如名字表示的三元运算符需要三个操作数。

语法是条件?结果1:结果2;.这里你把条件写在问号(?)的前面后面跟着用冒号(:)分隔的结果1和结果2。满足条件时结果1否则结果2。

参与互动

142.我们给一个 dom同时绑定两个点击事件，一个用捕获，一个用冒泡，你来说下会执行几次事件，然后会先执行冒泡还是捕获

参考答案：所有事件的顺序是：其他元素捕获阶段事件->本元素代码顺序事件->其他元素冒泡阶段事件。

参考

参与互动

144.简述一下 Handlebars的基本用法？

参考答案：没有用过的话说出它是干什么的即可

参与互动

143.简述一下 Handlerbars的对模板的基本处理流程，如何编译的？如何缓存的？

参考答案：

参与互动

145.前端 templating(Mustache, underscore, handlebars)是干嘛的,怎么用?

参考答案：

参与互动

146.知道什么是 webkit么?知道怎么用浏览器的各种工具来调试和 debug代码么?

参考答案：Webkit是浏览器引擎，包括 html渲染和 js解析功能，手机浏览器的主流内核，与之相对应的引擎有 Gecko（Mozilla Firefox等使用）和 Trident（也称 MSHTML，IE使用）。对于浏览器的调试工具要熟练使用，主要是页面结构分析，后台请求信息查看，js调试工具使用，熟练使用这些工具可以快速提高解决问题的效率

参与互动

147.如何测试前端代码?知道 BDD, TDD, Unit Test么?知道怎么测试你的前端工程么(mocha, sinon, jasmin, qUnit..)?

参考答案：了解 BDD行为驱动开发与 TDD测试驱动开发已经单元测试相关概念

参与互动

148.JavaScript的循环语句有哪些？

参考答案：while for do while forEach

参与互动

149.作用域-编译期执行期以及全局局部作用域问题

参考答案：js执行主要的两个阶段：预解析和执行期

参与互动

150.如何添加 html元素的事件，有几种方法？请列举

参考答案：直接在标签里添加；在元素上添加、使用事件注册函数添加

参与互动

151.列举浏览器对象模型 BOM里常用的至少 4个对象，并列举 window对象的常用方法至少 5个

参考答案：

对象：Window document location screen history navigator

方法：Alert() confirm() prompt() open() close()

参与互动

152.事件绑定的方式

参考答案：

参与互动

153.事件循环

参考答案：事件循环是一个单线程循环，用于监视调用堆栈并检查是否有工作即将在任务队列中完成。如果调用堆栈为空并且任务队列中有回调函数，则将回调函数出队并推送到调用堆栈中执行。

参与互动

154.事件模型

参考答案：

解析：参考

参与互动

155.如何自定义事件

参考答案：

1.原生提供了 3个方法实现自定义事件 2.createEvent，设置事件类型，是 html事件还是鼠标事件 3.initEvent初始化事件，事件名称，是否允许冒泡，是否阻止自定义事件 4.dispatchEvent触发事件

MDN

参与互动

156.target和 currentTarget区别

参考答案：

参与互动

157.prototype和__proto__的关系是什么

参考答案：

所有的对象都拥有__proto__属性，它指向对象构造函数的 prototype属性

所有的函数都同时拥有__proto__和 protytpe属性函数的__proto__指向自己的函数实现函数的 protytpe是一个对象所以函数的 prototype也有__proto__属性指向 Object.prototype

Object.prototype.__proto__指向 null

参与互动

158.什么是原型属性？

参考答案：从构造函数的prototype属性出发找到原型，这时候就把原型称之为构造函数的原型属性

参与互动

159.什么是原型对象？

参考答案：从实例的__proto__出发，找到原型，这时候就把原型称之为实例的原型对象。

参与互动

160.使用 let、var和 const创建变量有什么区别

参考答案：

let和 const的区别在于：let允许多次赋值，而 const只允许一次。

Web前端5道面试题

1.请说明ECMAScript,JavaScript,Jscript之间的关系?

ECMAScript提供脚本语言必须遵守的规则、

细节和准则，是脚本语言的规范。

比如：ES5，ES6就是具体的一js版本。

JavaScript是ECMAScript的一个分支版本,

JavaScript实现了多数ECMA-262中

描述的ECMAScript规范，但存在少数差异。

JScript是微软公司对ECMA-262语言规范的

一种实现,除了少数例外(这是为了保持向后兼容),

微软公司宣称JScript完全实现了ECMA标准.

关系:

JavaScript和JScript都是ECMAScript的版本分支,

二者在语法上没有多大的区别;

只不过一个是NetScape公司的,一个是微软的;

IE系列默认是JScript,其它的则反之用JavaScript。

2.页面加载过程中可能触发哪些事件?它们的顺序是?

页面加载时，大致可以分为以下几个步骤：1)开始解析HTML文档结构2)加载外部样式表及JavaScript脚本3)解析执行JavaScript脚本4)DOM树渲染完成5)加载未完成的外部资源6)页面加载成功

执行顺序:1)documentreadystatechange事件2)documentDOMContentLoaded事件3)windowload事件

3.函数中在声明变量a前使用a会产生错误吗?为什么?

不会,JS中能够进行变量作用域提升,

把所有变量、函数的声明提升到当前

作用域的最前面,但不进行赋值操作;

所以可能造成获取的值是undefined。

4.什么是hash,以及hashchange事件?

先了解下什么是hash:hash即URL中"#"字符后面的部分。

a)使用浏览器访问网页时，

如果网页URL中带有hash，

页面就会定位到id(或name)

与hash值一样的元素的位置;

b)hash还有另一个特点，

它的改变不会导致页面重新加载;

c)hash值浏览器是不会随请求发送到服务器端的;

d)通过window.location.hash属性获取和设置hash值。

window.location.hash值的变化会直接

反应到浏览器地址栏(#后面的部分会发生变化)，同时，浏览器地址栏hash值的变化也会触发

window.location.hash值的变化，

从而触发onhashchange事件。

再来了解下什么是hashchange事件:

a)当URL的片段标识符更改时，

将触发hashchange事件(跟在#符号后面的URL部分，包括#符号)b)

hashchange事件触发时，

事件对象会有hash改变前的URL(oldURL)和hash改变后的URL(newURL)两个属性。

5.什么是CDN,CDN对于网站有什么意义,它有什么样的缺点?

CDN又称为内容分发网络;本意在于

尽可能避开互联网上有可能影响数据

传输速度和稳定性的瓶颈和环节，

使内容传输的更快、更稳定。

主要目的:

解决因分布、带宽、服务器性能带来的访问延迟问题，

适用于站点加速、点播、直播等场景。

使用户可就近取得所需内容，解决Internet网络拥挤的状况，

提高用户访问网站的响应速度和成功率。

缺点:

a)实施复杂,投资大;

b)目前大部分的CDN还只是对静态内容加速，

对动态加速效果不好;

而双线对动态加速的效果跟静态是一样的。

Web前端岗位面试题有哪些

1.对WEB标准以及W3C的理解与认识

标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性；

2.xhtml和html有什么区别

HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言

最主要的不同：

XHTML元素必须被正确地嵌套。

XHTML元素必须被关闭。

标签名必须用小写字母。

XHTML文档必须拥有根元素。

3.Doctype?严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?

用于声明文档使用那种规范（html/Xhtml）一般为严格过度基于框架的html文档

加入XMl声明可触发，解析方式更改为IE5.5拥有IE5.5的bug

4.行内元素有哪些?块级元素有哪些?CSS的盒模型?

块级元素：div p h1 h2 h3 h4 form ul

行内元素: a b br i span input select

Css盒模型:内容，border,margin，padding

5.CSS引入的方式有哪些? link和@import的区别是?

内联内嵌外链导入

区别：同时加载

前者无兼容性，后者CSS2.1以下浏览器不支持

Link支持使用javascript改变样式，后者不可

6.CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?

标签选择符类选择符 id选择符

继承不如指定 Id>class>标签选择

后者优先级高

7.前端页面有哪三层构成，分别是什么?作用是什么?

结构层 Html表示层 CSS行为层 js

8.css的基本语句构成是?

选择器{属性1:值1;属性2:值2;……}

9.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

Ie(Ie内核)火狐（Gecko）谷歌（webkit） opear(Presto)

10.写出几种IE6 BUG的解决方法

1.双边距BUG float引起的使用display

2.3像素问题使用float引起的使用dislpay:inline-3px

3.超链接hover点击后失效使用正确的书写顺序 link visited hover active

4.Ie z-index问题给父级添加position:relative

5.Png透明使用js代码改

6.Min-height最小高度！Important解决’

7.select在ie6下遮盖使用iframe嵌套

8.为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden,zoom:0.08 line-height:1px）

11.标签上title与alt属性的区别是什么?

Alt当图片不显示是用文字代表。

Title为该属性提供信息

12.描述css reset的作用和用途。

Reset重置浏览器的css默认属性浏览器的品种不同，样式不同，然后重置，让他们统一

13.解释css sprites，如何使用。

Css精灵把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量

14.浏览器标准模式和怪异模式之间的区别是什么?

盒子模型渲染模式的不同

使用 window.top.document.compatMode可显示为什么模式

15.你如何对网站的文件和资源进行优化?期待的解决方案包括：

文件合并

文件最小化/文件压缩

使用CDN托管

缓存的使用

16.什么是语义化的HTML?

直观的认识标签对于搜索引擎的抓取有好处

17.清除浮动的几种方式，各自的优缺点

1.使用空标签清除浮动 clear:both（理论上能清楚任何标签，，，增加无意义的标签）

2.使用overflow:auto（空标签元素清除浮动而不得不增加无意代码的弊端,,使用zoom:1用于兼容IE）

3.是用afert伪元素清除浮动(用于非IE浏览器)

Javascript

1.javascript的typeof返回哪些数据类型

Object number function boolean underfind

2.例举3种强制类型转换和2种隐式类型转换?

强制（parseInt,parseFloat,number）

隐式（==–===）

3.split() join()的区别

前者是切割成数组的形式，后者是将数组转换成字符串

4.数组方法pop() push() unshift() shift()

Push()尾部添加 pop()尾部删除

Unshift()头部添加 shift()头部删除

5.事件绑定和普通事件有什么区别

6.IE和DOM事件流的区别

1.执行顺序不一样、

2.参数不一样

3.事件加不加on

4.this指向问题

7.IE和标准下有哪些兼容性的写法

Var ev= ev|| window.event

document.documentElement.clientWidth|| document.body.clientWidth

Var target= ev.srcElement||ev.target

8.ajax请求的时候get和post方式的区别

一个在url后面一个放在虚拟载体里面

有大小限制

安全问题

应用不同一个是论坛等只需要请求的，一个是类似修改密码的

9.call和apply的区别

Object.call(this,obj1,obj2,obj3)

Object.apply(this,arguments)

10.ajax请求时，如何解释json数据

使用eval parse鉴于安全性考虑使用parse更靠谱

11.b继承a的方法

12.写一个获取非行间样式的函数

function getStyle(obj,attr,value)

{

if(!value)

{

if(obj.currentStyle)

{

return obj.currentStyle(attr)

}

else

{

obj.getComputedStyle(attr,false)

}

}

else

{

obj.style[attr]=value

}

}

13.事件委托是什么

让利用事件冒泡的原理，让自己的所触发的事件，让他的父元素代替执行！

14.闭包是什么，有什么特性，对页面有什么影响

闭包就是能够读取其他函数内部变量的函数。

15.如何阻止事件冒泡和默认事件

canceBubble return false

16.添加删除替换插入到某个接点的方法

obj.appendChidl()

obj.innersetBefore

obj.replaceChild

obj.removeChild

17.解释jsonp的原理，以及为什么不是真正的ajax

动态创建script标签，回调函数

Ajax是页面无刷新请求数据操作

好了，文章到此结束，希望可以帮助到大家。