js-面试题整理

var Foo = function(){
                getName = function(){alert(1)};
                return this;
            }
            Foo.getName = function(){alert(2)};
            Foo.prototype.getName = function(){alert(3)};
            var getName = function(){alert(4)};
            function getName(){
                alert(5)
            };
    
            Foo.getName();
            getName();
            Foo().getName();
            getName();
            new Foo.getName();
            new Foo().getName();
            new new Foo().getName();

 

1.vue 路由跳转后返回，保持页面滚动条行为

 　　

const router = new VueRouter({
  routes: [...],
  scrollBehavior (to, from, savedPosition) {
    // return 期望滚动到哪个的位置

  }
})

 2.bind,call,apply 的用法与区别

　　bind是返回相对应的函数，稍后执行，call和apply是立即执行，改变this的指向，可以做继承。

function testName (name,age ){
    this.name = name;
    this.age = age;
    this.getName = function(){
      console.log(this.name)
    }
}

function childName(){
  testName.apply(this,arguments); //继承testName上的所有方法
}

let getname = new childName('test',25)
getname.getName();

 3. 给指定数组去重

function testArr(arr){
  var result = new Set(arr); //set 去重
  return Array.from(result); 
}
let arr = [1,2,3,2,3,4,1];
console.log(testArr(arr)); 

4.求给定字符串中出现最多的次数

function getMax(str) {
      let obj = {};
      let maxNum = 0;
      let maxStr = '';
      for (let i = 0; i < str.length; i++) {
        if (!obj[str[i]]) {
          obj[str[i]] = 1;
          if (obj[str[i]] > maxNum) {
            maxNum = obj[str[i]];
            maxStr = str[i]
          }
        } else {
          obj[str[i]]++;
          if (obj[str[i]] > maxNum) {
            maxNum = obj[str[i]];
            maxStr = str[i]
            console.log(maxNum)
          }
        }
      }
      return {
        maxNum: maxNum,
        maxStr: maxStr
      };
    }

    let str = 'aaaffffasscccvdfffgeerghh';
    console.log(getMax(str))

 5.异步的解决方案

　　a.settimeout()，延迟加载;b.回掉函数，callback;3.事件监听；4.promise，减少回调地狱，用then，catch。

6.跨域的解决方案

　　协议，域名，端口号不同就会存在跨域。"跨域资源共享"（Cross-origin resource sharing）是W3C出的一个标准。兼容性方面可以支持IE8+（IE8和IE9需要使用XDomainRequest对象来支持CORS），所以现在CORS也已经成为主流的跨域解决方案；jsonp（只支持get请求）；h5的新api：postMessage();

7.vue-router 的钩子

　　beforeEach(to,from,next);afterEach();updateEach()l;组件内的：beforeRouteEnter,beforeRouteUpdate,beforeRouteLeave

8.vue数据双向绑定的原理是什么？

　　vue是通过数据劫持结合发布者-订阅者模式的方式，通过object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。（ps:只是劫持data中定义的属性，未被定义的属性，在method中创建时，需要通过this.$set()进行插入）(vue响应式原理)

9.vuex的属性

　　state:vuex的变量仓库，定义变量的;

　　mutation:定义同步方法;

　　action:提交mutation的方式，而不是直接提交，也可用于异步操作，

　　getter：相当于computed，返回计算属性的操作直

10.v-if与v-show之间的不同点

　　v-if主要是操作DOM的显示和隐藏，v-show主要是改变元素的display的css属性显示隐藏;

11.vue-loader是什么，有什么用途

　　vue-loader是vue文件的一个加载器，可以让js写es6语言，style使用less或者scss，template可以加jade等。

12.actived 钩子得作用

13. 如何优雅得重置定义在data中得form表单得数据， 查看vue.$option 属性得用法得知答案

14.parseInt('1',0) 输出1，第二位表示进制

15.如何判定一个对象是空对象，1，for ...in   2.通过JSON.stringIfy(obj) === '{}'   3.通过object.Keys(obj).length ===0 判断

16.路由钩子函数，vue生命周期函数得执行顺序，路由钩子一般是在未实例化之前就执行了，做数据拦截一般实在router.beforEach中，单个页面得预加载是在beforeRouterEnter中

17.v-for 为什么一定要绑定key属性， 为了提交效率，如果不绑定，vue就不知道哪个元素是新增或者未改变，造成渲染混乱，绑定了key就目的明确。