JavaScript 常见面试题解析：数组去重、多维数组遍历与继承实现

JavaScript 面试核心问题汇总

本文整理并解析了 JavaScript 开发中常见的面试题目，旨在为求职者提供参考与学习方向。

JavaScript 面试核心问题汇总

数组去重算法

第一类考点涉及数组去重算法：给定一个包含重复元素的数组，要求编写代码去除其中的重复值。

(function() {
    var arr = [1, 2, 3, 3, 4, ];
    function unique() {
      var result = [];
      var tem = {};
      for (var i = 0; i < arr.length; i++) {
        if (!tem[arr[i]]) {
          result.push(arr[i]);
          tem[arr[i]] = 1;
        }
      }
      return result;
    }
})();

多维数组展平处理

第二类考点关注多维数组处理：针对至少包含三层的嵌套数组，需要将其展平合并为一维数组，此处列举了网络上常见的解决方案思路。

//遍历多维数组
var arr = [1, 2, 3, [4, [5, [6]]]]; // arr.length
Array.prototype.each = function(fn) {
  try {
    //1 目的： 遍历数组的每一项 //计数器 记录当前遍历的元素位置
    this.i || (this.i = 0); //var i = 0 ;
    //2 严谨的判断什么时候去走each核心方法
    // 当数组的长度大于0的时候 && 传递的参数必须为函数
    if (this.length > 0 && fn.constructor == Function) {
      // 循环遍历数组的每一项
      while (this.i < this.length) { //while循环的范围
        //获取数组的每一项
        var e = this[this.i];
        //如果当前元素获取到了 并且当前元素是一个数组
        if (e && e.constructor == Array) {
          // 直接做递归操作
          e.each(fn);
        } else {
          //如果不是数组 （那就是一个单个元素）
          // 这的目的就是为了把数组的当前元素传递给fn函数 并让函数执行
          //fn.apply(e,[e]);
          fn.call(e, e);
        }
        this.i++;
      }
      this.i = null; // 释放内存 垃圾回收机制回收变量
    }
  } catch (ex) {
    // do something
  }
  return this;
}

URL 查询参数获取方案

第三类考点为 URL 查询参数的获取方法，主要探讨如何从浏览器地址栏中提取特定参数。

其中一种实现方式是利用正则表达式进行匹配提取。

//获取url参数
function GetQueryString(name) {
  var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
  //js match返回的是一数组
  var r = location.search.substr(1).match(reg);
  if (r != null) {
    return r[2];
  } else {
    return null;
  }
}

另一种方式则是结合 split 方法与数组遍历来实现，该方案逻辑相对直观，此处省略具体代码展示。

字符串去空格处理

第四类考点涉及正则表达式的应用，具体场景为去除字符串首尾的所有空格。

/**去掉字符串前后所有空格*/
function trim(str){
return str.replace(/(^\s*)|(\s*$)/g, "");
}

闭包概念考察

第五类考点考察对闭包（Closure）概念的理解与应用场景。

原型继承实现方案

第六类考点探讨原型继承的实现机制，主要包含两种主流方案。

第一种方案是基于 prototype 属性进行原型链的构建与赋值。

var obj={name:'seven'};
var a=function(){};
a.prototype=obj;
var aa=new a();
alert(aa.name);

第二种方案是利用 apply 或 call 方法改变函数执行上下文，从而实现属性的借用与继承。

function people(name,age){
  //属性
  this.name=name;
  this.age=age;
  //方法
  this.show=function(){
    console.log("my name is"+this.name+" and I am "+this.age+" years old");
  };
}
function student(name,age,school){
  people.apply(this,arguments);
  this.school=school;
  this.showYourself=function(){
    console.log("my name is"+this.name+" and I am "+this.age+" years old"+" my school is"+ this.school);
  };
}
var tom=new student('tom','19','xtu');
tom.showYourself();

ES6 常用知识点

第七类考点覆盖 ES6 标准中的常用新特性与语法知识。

读者可使用在线 HTML/CSS/JavaScript 代码运行工具：http://tools.jb51.net/code/HtmlJsRun 对上述示例代码进行实际测试，以验证运行效果。

如需深入了解 JavaScript 其他领域，可参考本站系列专题，包括《JavaScript 数学运算用法总结》、《JavaScript 数据结构与算法技巧总结》、《JavaScript 数组操作技巧总结》、《JavaScript 排序算法总结》、《JavaScript 遍历算法与技巧总结》、《JavaScript 查找算法技巧总结》以及《JavaScript 错误与调试技巧总结》。

希望上述内容能对从事 JavaScript 程序设计的读者提供实质性的帮助。