vue面试题(第十天)

1.简述同步和异步的区别

同步，是所有的操作都做完，才返回给用户结果。即写完数据库之后，在响应用户，用户体验不好。
异步，不用等所有操作等做完，就相应用户请求。即先响应用户请求，然后慢慢去写数据库，用户体验较好。

2.数组去重

1>利用indexof遍历数组去重

 var arr = [1, 2, 3, 3, 2, 4, 5, 11, 11];
    //定义一个空数组
    var newArr = [];
    for (var i in arr) {
      if (newArr.indexOf(arr[i]) == -1) {
        //判断数组newArr内有没有此元素
        newArr.push(arr[i]);
      }
    }
    console.log(newArr);//[1,2,3,4,5,11]

2>使用es6

let arr = [56, 78, 45, 56, 78, 90, 90];
    arr = [...new Set(arr)];
    //or
    arr = Array.from(new Set(arr));
    console.log(arr);// [56, 78, 45, 90]

3>相邻元素去重

function fun1(arr) {
      // Array.isArray判断是否是一个数组
      if (!Array.isArray(arr)) {
        console.log("type error!");
        return;
      }
      arr = arr.sort();
      //console.log(arr);//[1, 1, 2, 2, 234, 3, 3, 35, 4]
      let res = [];
      for (let i = 0; i < arr.length; i++) {
        if (arr[i] !== arr[i - 1]) {
          res.push(arr[i]);
        }
      }
     // console.log(res);//[1, 2, 234, 3, 35, 4]
      return res;
    }
    var arr = [1, 2, 3, 2, 234, 35, 3, 4, 1];
    fun1(arr);

4>利用对象属性去重
将数组中的值设为对象的属性，并给该属性赋初始值1，每出现一次，对应的属性值增加1，这样属性值就是该元素出现的次数

  function fun1(arr) {
      if (!Array.isArray(arr)) {
        console.log("数组类型错误");
        return;
      }
      //定义一个空数组
      let res = [],
        obj = {};
      for (let i = 0; i < arr.length; i++) {
        // console.log(obj[arr[i]]);
        if (!obj[arr[i]]) {
          res.push(arr[i]);
          obj[arr[i]] = 1;
        } else {
          obj[arr[i]]++;
        }
      }
      //console.log(res);//[1, 2, 3, 234, 35, 4]
      return res;
    }
    var arr = [1, 2, 3, 2, 234, 35, 3, 4, 1];
    fun1(arr);

3.在JavaScript中什么是伪数组？如何将伪数组转化为标准数组

符合以下条件的对象称为伪数组：

1，具有length属性
2，按索引方式存储数据
3，不具有数组的push,pop等方法

伪数组(类数组)无法直接调用数组方法或期望length属性有什么特殊的行为，不具有数组的push,pop等方法，但仍可以对真正数组遍历方法来遍历它们(function的arguments对象，还有getElementsByTagName、ele.childNodes等返回的NodeList对象，或者自定义的某些对象，这些都可以是伪数组。)

通过以下几种方式将伪数组转换为标准数组：
1、使用Array.prototype.slice.call()或[].slice.call();

Array.prototype.slice.call({
      0: "Jackson",
      1: 19,
      2: true,
      length: 3
    });
    //["Jackson", 19, true]

2、使用ES6中Array.from方法;

Array.from({  
 0:"xizige",  
 1:19,  
 2:2019,  
 3:"中戏",  
 length:4  
});  
//["xizige", 19, 2019, "中戏"]  

4.SPA路由history模式，打包上线都遇到了哪些问题？你是如何解决的？

5.JavaScript中callee和caller的作用

1.callee:对象的一个属性，该属性指向参数arguments对象的函数
作用:用来指向当前对象

返回正被执行的 Function 对象，也就是所指定的 Function 对象的正文.
callee是arguments 的一个属性成员，它表示对函数对象本身的引用，这有利于匿名 函数的递归或者保证函数的封装性。

//首先来写个阶乘函数  公式:n!=n*(n-1)!
    function fun1(x) {
      if (x <= 1) {
        return 1;
      } else {
        return x * fun1(x - 1);
      }
    }
    //这里用到递归函数(在内部调用)，若改变函数名，里面的函数名也要跟着改变
    //用callee来写
    function fun2(x) {
      if (x <= 1) {
        return 1;
      } else {
        return x * arguments.callee(x - 1);
      }
    }
    //callee是arguments对象的一个属性，指向arguments对象的函数，这个函数就是fun1(fun1=arguments.callee)

2.caller函数对象的一个属性，该属性保存着调用当前函数的函数的引用（指向当前函数的直接父函数）
　　返回一个对函数的引用，该函数调用了当前函数。
　　functionName.caller
　　functionName 对象是所执行函数的名称。

 //caller是函数对象的一个属性，该属性保存着调用当前函数的函数的引用（指向当前函数的直接父函数）
    function a() {
      b();
    }
    function b() {
      alert(b.caller);
    }
    a();//弹出函数a
    //函数b的属性caller调用当前函数b的函数引用a（就是指向当前函数b的父函数a），所以结果就是弹出 function a(){ b();};

注意：
对于函数来说，caller 属性只有在函数执行时才有定义。 如果函数是由 Javascript 程序的顶层调用的，那么 caller 包含的就是 null 。

caller和callee结合使用

 (function a(){
         b()
     })()

     function b(){
         alert(argument.callee.caller)
     }
     //argument.callee代替了b函数

应用场景：
callee的应用场景一般用于匿名函数
caller的应用场景 主要用于察看函数本身被哪个函数调用