JavaScript基础面试题--20题比较详细,基础

128 阅读10分钟

1、介绍JavaScript的基本数据类型?

基本数据类型:Number、String、Boolean、Null、Undefined

object是JavaScript中所有对象的父对象

数据封装类对象:object、Array、Boolean、Number、String

其它对象:Function、Arguments、Math、Date、Error、RegExp

其它数据类型:Symbol

2、浅谈JavaScript中变量和函数声明的提升?

在JavaScript中变量和函数的声明会提升到最顶部执行

函数的提升高于变量的提升

函数内部如果用var声明了相同名称的外部变量,函数将不会向上寻找

匿名函数不会提升

不同

3、什么是闭包,闭包有什么特性?

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

闭包是指有权访问另一个函数作用域中变量的函数,创建闭包最常见的方式就是在一个函数内部创建另一个函数,通 过另一个函数访问这个函数的局部变量,利用闭包可以突破作用域链

闭包的特性

函数内再嵌套函数

内部函数可以引用外部的参数或变量

参数和变量不会被垃圾回收机制回收

4、说说对闭包的理解和闭包的作用

使用闭包主要是为了设计私有的方法和变量。闭包的优点是可以避免全局变量的污染,缺点是闭包会常驻内存,增大内存使用量,使用不当很容易造成内存泄漏。在JS中,函数即闭包,只有函数才会产生作用域的概念

闭包的最大用处有2个,一个是可以读取函数内部的变量,另一个就是可以让这些变量始终保持在内存中

闭包的另一个用处是封装对象的私有属性和方法

好处:能够实现封装和缓存

坏处:就是消耗内存、不正当使用会造成内存溢出的问题 使用闭包的注意点

由于闭包会使得函数中的变量都保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄漏。

解决方法是,在退出函数之前,将不使用的局部变量全部删除。

5、说说对This对象的理解

this总是指向函数的直接调用者,而非间接调用者

如果有new关键字,this指向new出来的那个对象

在事件中,this指向触发这个事件的对象,特殊的是,IE中的attachEvent中的this总是指向全局对象window

6、说说对事件模型的理解

W3C中定义时间的发生精力三个阶段

捕获阶段

目标阶段

冒泡阶段

冒泡型事件:当你使用事件冒泡时,子元素先触发,父元素后触发

捕获型事件:当你使用事件捕获时,父元素先触发,子元素后触发

DOM事件流:同时支持两种事件模型,捕获型事件和冒泡型事件

阻止冒泡:在W3C中,使用stopPropagation()方法;在IE下设置cancelBubble = true

阻止捕获:阻止事件的默认行为,例如click - < a > 后的跳转。在W3C中,使用preventDefault()方法,在IE下设置window.event.returnValue = false

7、new 操作符具体干了什么?

创建一个空对象,并且this变量引用该对象,同时还继承了该函数的原型

属性和方法被加入到this引用的对象中

新创建的对象由this所引用,并且最后隐式的返回this

8、说说栈和堆的理解,以及它们的区别?

栈内存:栈内存首先是一片内存区域,存储的都是局部变量,凡是定义在方法中的都是局部变量(方法外的是全局变量),for循环内部定义的也是局部变量,是先加载函数才能进行局部变量的定义,所以方法先进栈,然后再定义变量,变量有自己的作用域,一旦离开作用域,变量就会被释放。栈内存的更新速度很快,因为局部变量的生命后期都很短

堆内存:存储的是数组和对象(其实数组就是对象),凡是new建立的都是在堆内存中,堆内存的都是放的实体(对象),实体用于封装数据,而且是封装多个(实体的多个属性),如果一个数据消失,这个实体也不会消失,还可以使用,所以堆是不会随时释放的,但是栈不一样,栈里存放的都是单个变量,变量被释放了,那就没有了。堆里的实体虽然不会被释放,但是会被当成垃圾,有垃圾回收机制不定时的收取

栈和堆的区别:

栈内存存储的是局部变量,而堆内存存储的是实体

栈内存更新速度要快于堆内存,因为局部变量的生命周期都很短

栈内存存放的变量生命周期一旦结束就会被释放,而堆内存存放的实体会被垃圾回收机制不定时的回收

9、JS数组和对象的遍历方式,以及几种方式的比较

for in 循环

for 循环

forEach 循环

这里的forEach回调中两个参数分别为:value , index

forEach无法遍历对象

IE不支持该方法;FireFox和Chrome支持

forEach无法使用break ,continue跳出循环,且使用return是跳过本次循环

for-in 需要分析出array的每个属性,这个操作性能开销很大。用在key已知的数组上是不划算的。所以尽量不要用for-in,除非你不清楚要处理哪些属性,例如JSON对象这样的情况

for循环每进行一次,就要检查一下数组长度。读取属性(数组长度)要比读局部变量慢,尤其是当array里存放的都是DOM元素,因为每次读取都会扫描一遍页面上的选择器相关元素,速度会大大降低

10、map和forEach的区别

forEach方法,是最基本的方法,就是遍历与循环,默认有3个参数:分别是遍历的数组内容item、数组索引index、当前遍历的数组Array

map方法,基本用法与forEach一致,但不同的是,它会返回一个新的数组,所以callback需要有return值,如果没有,会返回undefined

11、谈一谈箭头函数与普通函数的区别?

函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象

不可以当做构造函数,也就是不可以使用new命令,否则会抛出一个错误

不可以使用arguments对象,该对象在函数体内不存在,如果要用,可以使用Rest参数代替

不可以使用yield命令,因为箭头函数不可以用作Generator函数(遍历器函数)

12、对原生Javascript了解程度

数据类型、运算、对象、Function、继承、闭包、作用域、原型链、时间、RegExp、JSON、Ajax、DOM、BOM、内存泄漏、跨域、异步装载、模板引擎、前端MVC、路由、模块化、Canvas、ECMAScript

13、JS动画与CSS动画区别及相应实现

CSS3动画的优点

在性能上会稍微好些,浏览器会对CSS3的动画做一些优化代码相对简单

CSS3动画的缺点

在动画控制上不够灵活兼容性不好

JavaScript的动画正好弥补了这两个缺点,控制能力很强,可以单帧的控制、变换,同时写得好完全可以兼容IE6,并且功能强大。对于一些复杂的控制动画,使用JavaScript会比较靠谱。而在实现一些小的交互动效的时候,可以考虑CSS。

14、谈一谈你理解的函数式编程

简单说,“函数式编程”是一种“编程范式”,也就是如何编写程序的方法论

它具有以下特性:闭包和高阶函数、惰性计算、递归、函数是“第一等公民”、只用“表达式”

15、说说你对作用域链的理解

作用域链的作用是保证执行环境里有权访问的变量和函数是有序的,作用域链的变量只能向上访问,访问到window对象即会终止,作用域链向下访问是不被允许的

作用域就是变量与函数的可访问范围,即作用域控制着变量和函数的可见性和生命周期

16、什么是JavaScript原型,原型链?有什么特点?

每个对象都在其内部初始化一个属性,就是prototype(原型),当我们访问一个对象的属性时,如果这个对象内部不存在这个属性,那么它就会去prototype里找这个属性,这个prototype又会有自己的prototype,于是就这样一直找下去,也就是我们平时所说的原型链的概念。

关系:instance.constructor.prototype = instance.proto

JavaScript对象是通过引用来传递的,我们创建的每个新对象实体中并没有一份属于自己的原型副本。当我们修改原型时,与之相关的对象也会继承这一改变

当我们需要一个属性时,JavaScript引擎会先看当前对象中是否有这个属性,如果没有就会找他的prototype中是否有这个属性,如此递推下去,直到Object内建对象

17、说说什么是事件代理?

事件代理,又称之为事件委托。是JavaScript中绑定事件的常用技巧。顾名思义,“事件代理”就是把原本需要监听的事件委托给父元素,由父元素担当事件监听的职务。事件代理的原理是DOM元素的事件冒泡。使用事件地理的好处是可以提高性能。

可以大量节省内存占用,减少事件注册,比如在table上代理所有td的click事件就非常棒

可以实现新增子对象时无需再次对其绑定

18、说说Ajax原理?

Ajax的原理简单来说是在用户和服务器之间加了一个中间层(AJAX引擎),由XMLHttpRequest对象来向服务器发异步请求,从服务器获得数据,然后用JavaScript来操作DOM而更新页面。使用户操作与服务器响应异步化。这其中最关键的一步就是从服务器获得请求数据

Ajax的过程只涉及JavaScript、XMLHttpRequest和DOM。XMLHttpRequest是Ajax的核心机制

Ajax的优点:

通过异步模式提升了用户体验

优化了浏览器和服务器之间的传输,减少了不必要的数据往返,减少了带宽占用

Ajax在客户端运行,承担了一部分本来由服务器承担的工作,减少了大用户量下的服务器负载

Ajax可以实现局部刷新

Ajax的缺点:

安全问题,Ajax暴露了与服务器的交互细节

对搜索引擎的支持比较弱

19、介绍JS有哪些内置对象?

Object是JavaScript中所有对象的父对象

数据封装类对象:Object、Array、Boolean、Number、String

其它对象:Function、Arguments、Math、Date、RegExp、Error

20、说几条写JavaScript的基本规范

不要在同一行声明多个变量

请使用 === / !== 号来比较 true / false 或者数值

使用对象字面量替代 new Array这种形式

不要使用全局函数

Switch 语句必须带有 default 分支

if 语句必须使用大括号

for-in 循环中的变量应该使用var关键字明确限定作用域,从而避免作用域污染