前端开发面试总结JavaScript部分

最新推荐文章于 2022-03-15 07:43:30 发布

Minn0916

最新推荐文章于 2022-03-15 07:43:30 发布

阅读量932

点赞数

分类专栏：前端开发面试

前端开发面试专栏收录该内容

5 篇文章 0 订阅

订阅专栏

要点：  数据类型、面向对象、继承、闭包、插件、作用域、跨域、原型链、模块化、自定义事件、异步装载回调、模板引擎、Nodejs等。

js的几种数据类型：number,string,boolean,object,undefined

js的常见内置对象类：Date,Array,Math、Number、Boolean、String、Array、RegExp、Function...

通常可以做一些小练习来判断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');
```

1.创建一个对象

      function Person(name, age) {
        this.name = name;
        this.age = age;
        this.sing = function() { alert(this.name) } 
      }

2.谈谈This对象的理解。

this是js的一个关键字，随着函数使用场合不同，this的值会发生变化。

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

this一般情况下：是全局对象Global。 作为方法调用，那么this就是指这个对象

3.事件、IE与火狐的事件机制有什么区别？如何阻止冒泡？

 1. 我们在网页中的某个操作（有的操作对应多个事件）。例如：当我们点击一个按钮就会产生一个事件。是可以被 JavaScript 侦测到的行为。  
 2. 事件处理机制：IE是事件冒泡、火狐是 事件捕获；
 3.  ev.stopPropagation();

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  
```

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

使用instanceof （待完善）

       if(a instanceof Person){
           alert('yes');
       }

6.new操作符具体干了什么呢?

  1、创建一个空对象，并且 this 变量引用该对象，同时还继承了该函数的原型。
  2、属性和方法被加入到 this 引用的对象中。
  3、新创建的对象由 this 所引用，并且最后隐式的返回 this 。

    var obj  = {};
    obj.__proto__ = Base.prototype;
    Base.call(obj);

7.JSON 的了解

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

8.js延迟加载的方式有哪些

defer和async、动态创建DOM方式（用得最多）、按需异步载入js

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

待完善

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

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

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

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

  Ajax可以实现动态不刷新（局部刷新）
  readyState属性 状态 有5个可取值： 0=未初始化 ，1=正在加载 2=以加载，3=交互中，4=完成

ajax的缺点

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

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

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

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

  5、不容易调试。

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

10.模块化怎么做？

立即执行函数,不暴露私有成员

var module1 = (function(){
　　　　var _count = 0;
　　　　var m1 = function(){
　　　　　　//...
　　　　};
　　　　var m2 = function(){
　　　　　　//...
　　　　};
　　　　return {
　　　　　　m1 : m1,
　　　　　　m2 : m2
　　　　};
　　})();

11.对Node的优点和缺点提出了自己的看法：

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

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

12.异步加载的方式

  (1) defer，只支持IE

  (2) async：

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

      documen.write和 innerHTML的区别

      document.write只能重绘整个页面

      innerHTML可以重绘页面的一部分

13.告诉我答案是多少？

(function(x){
    delete x;
    alert(x);
})(1+5);

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

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);

15.Jquery与jQuery UI 有啥区别？

    *jQuery是一个js库，主要提供的功能是选择器，属性修改和事件绑定等等。

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

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

jQuery中没有提供这个功能，所以你需要先编写两个jQuery的扩展：

    $.fn.stringifyArray = function(array) {
        return JSON.stringify(array)
    }

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

    然后调用：
    $("").stringifyArray(array)

17.JavaScript中的作用域与变量声明提升？