您的位置:首页 > Web前端 > JavaScript

前端开发面试总结JavaScript部分

2015-12-12 10:50 756 查看
要点:  数据类型、面向对象、继承、闭包、插件、作用域、跨域、原型链、模块化、自定义事件、异步装载回调、模板引擎、Nodejs等。
[/code]
js的几种数据类型:number,string,boolean,object,undefined

js的常见内置对象类:Date,Array,Math、Number、Boolean、String、Array、RegExp、Function...
[/code]

通常可以做一些小练习来判断TA的水平,js 虽然很灵活,但是具体的代码和实现方式能体现出一个人的全局观,随着代码规模的增长,复杂度增加,如何合理划分模块实现功能和接口的能力比较重要。(下面例题)
["1", "2", "3"].map(parseInt)

[typeof null, null instanceof Object]

[ [3,2,1].reduce(Math.pow), [].reduce(Math.pow)] ]

var val = 'smtg';
console.log('Value is ' + (val === 'smtg') ? 'Something' : 'Nothing');
[/code]

1.创建一个对象
function Person(name, age) {
this.name = name;
this.age = age;
this.sing = function() { alert(this.name) }
}
[/code]

2.谈谈This对象的理解。
this是js的一个关键字,随着函数使用场合不同,this的值会发生变化。

但是总有一个原则,那就是this指的是调用函数的那个对象。

this一般情况下:是全局对象Global。 作为方法调用,那么this就是指这个对象
[/code]

3.事件、IE与火狐的事件机制有什么区别? 如何阻止冒泡?
1. 我们在网页中的某个操作(有的操作对应多个事件)。例如:当我们点击一个按钮就会产生一个事件。是可以被 JavaScript 侦测到的行为。
2. 事件处理机制:IE是事件冒泡、火狐是 事件捕获;
3.  ev.stopPropagation();
[/code]

4.什么是闭包(closure),为什么要用?

待完善

执行say667()后,say667()闭包内部变量会存在,而闭包内部函数的内部变量不会存在.使得Javascript的垃圾回收机制GC不会收回say667()所占用的资源,因为say667()的内部函数的执行需要依赖say667()中的变量。这是对闭包作用的非常直白的描述.
function say667() {
// Local variable that ends up within closure
var num = 666;
var sayAlert = function() { alert(num); }
num++;
return sayAlert;
}

var sayAlert = say667();
sayAlert()//执行结果应该弹出的667
[/code]

5.如何判断一个对象是否属于某个类?

使用instanceof (待完善)
if(a instanceof Person){
alert('yes');
}
[/code]

6.new操作符具体干了什么呢?
1、创建一个空对象,并且 this 变量引用该对象,同时还继承了该函数的原型。
2、属性和方法被加入到 this 引用的对象中。
3、新创建的对象由 this 所引用,并且最后隐式的返回 this 。

var obj  = {};
obj.__proto__ = Base.prototype;
Base.call(obj);
[/code]

7.JSON 的了解
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它是基于JavaScript的一个子集。数据格式简单, 易于读写, 占用带宽小
{'age':'12', 'name':'back'}
[/code]

8.js延迟加载的方式有哪些
defer和async、动态创建DOM方式(用得最多)、按需异步载入js

9.ajax 是什么?ajax 的交互模型?同步和异步的区别?如何解决跨域问题?

待完善
1. 通过异步模式,提升了用户体验

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

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

2. Ajax的最大的特点是什么。

Ajax可以实现动态不刷新(局部刷新)
readyState属性 状态 有5个可取值: 0=未初始化 ,1=正在加载 2=以加载,3=交互中,4=完成
[/code]

ajax的缺点
1、ajax不支持浏览器back按钮。

2、安全问题 AJAX暴露了与服务器交互的细节。

3、对搜索引擎的支持比较弱。

4、破坏了程序的异常机制。

5、不容易调试。
[/code]

跨域: jsonp、 iframe、window.name、window.postMessage、服务器上设置代理页面

10.模块化怎么做?

立即执行函数,不暴露私有成员
var module1 = (function(){
    var _count = 0;
    var m1 = function(){
      //...
    };
    var m2 = function(){
      //...
    };
    return {
      m1 : m1,
      m2 : m2
    };
  })();
[/code]

11.对Node的优点和缺点提出了自己的看法:
*(优点)因为Node是基于事件驱动和无阻塞的,所以非常适合处理并发请求,
因此构建在Node上的代理服务器相比其他技术实现(如Ruby)的服务器表现要好得多。
此外,与Node代理服务器交互的客户端代码是由javascript语言编写的,
因此客户端和服务器端都用同一种语言编写,这是非常美妙的事情。

*(缺点)Node是一个相对新的开源项目,所以不太稳定,它总是一直在变,
而且缺少足够多的第三方库支持。看起来,就像是Ruby/Rails当年的样子。
[/code]

12.异步加载的方式
(1) defer,只支持IE

(2) async:

(3) 创建script,插入到DOM中,加载完毕后callBack

documen.write和 innerHTML的区别

document.write只能重绘整个页面

innerHTML可以重绘页面的一部分
[/code]

13.告诉我答案是多少?
(function(x){
delete x;
alert(x);
})(1+5);

函数参数无法delete删除,delete只能删除通过for in访问的属性。
当然,删除失败也不会报错,所以代码运行会弹出“1”。
[/code]

14.JS中的call()和apply()方法的区别?

例子中用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4);

注意:js 中的函数其实是对象,函数名是对 Function 对象的引用。
function add(a,b)
{
alert(a+b);
}

function sub(a,b)
{
alert(a-b);
}

add.call(sub,3,1);
[/code]

15.Jquery与jQuery UI 有啥区别?
*jQuery是一个js库,主要提供的功能是选择器,属性修改和事件绑定等等。

*jQuery UI则是在jQuery的基础上,利用jQuery的扩展性,设计的插件。
提供了一些常用的界面元素,诸如对话框、拖动行为、改变大小行为等等
[/code]

16.jquery 中如何将数组转化为json字符串,然后再转化回来?

jQuery中没有提供这个功能,所以你需要先编写两个jQuery的扩展:
$.fn.stringifyArray = function(array) {
return JSON.stringify(array)
}

$.fn.parseArray = function(array) {
return JSON.parse(array)
}

然后调用:
$("").stringifyArray(array)
[/code]

17.JavaScript中的作用域与变量声明提升?
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: