前端面试分享
什么vuex ,谈谈你对它的理解?
首先vuex的出现是为了解决web组件化开发的过程中,各组件之间传值的复杂和混乱的问题将我们在多个组件中需要共享的数据放到store中,
要获取或格式化数据需要使用getters,
改变store中的数据,使用mutation,但是只能包含同步的操作,在具体组件里面调用的方式this.$store.commit('xxxx')
Action也是改变store中的数据,不过是提交的mutation,并且可以包含异步操作,在组件中的调用方式this.$store.dispatch('xxx'); 在actions里面使用的commit('调用mutation')
数据类型的判断有哪些方法?他们的优缺点及区别是什么?
然后判断数据类型的方法一般可以通过:typeof、instanceof、constructor、toString四种常用方法不同类型的优缺点 typeof instanceof constructor Object.prototype.toString.call
优点 使用简单 能检测出引用类型 基本能检测所有的类型(除了null和undefined) 检测出所有的类型
缺点 只能检测出基本类型(出null) 不能检测出基本类型,且不能跨iframe constructor易被修改,也不能跨iframe IE6下,undefined和null均为Object
知道symbol 吗?
ES6 引入新的原始数据类型Symbol,表示独一无二的值。请描述一下ES6中的class类?
es6中的class可以把它看成是es5中构造函数的语法糖,它简化了构造函数的写法, 类的共有属性放到 constructor 里面通过class 关键字创建类, 类名我们还是习惯性定义首字母大写
类里面有个constructor 函数,可以接受传递过来的参数,同时返回实例对象
constructor 函数 只要 new 生成实例时,就会自动调用这个函数, 如果我们不写这个函数,类也会自动生成这个函数
多个函数方法之间不需要添加逗号分隔
生成实例 new 不能省略
语法规范, 创建类 类名后面不要加小括号,生成实例 类名后面加小括号, 构造函数不需要加function
继承中,如果实例化子类输出一个方法,先看子类有没有这个方法,如果有就先执行子类的
继承中,如果子类里面没有,就去查找父类有没有这个方法,如果有,就执行父类的这个方法(就近原则)
如果子类想要继承父类的方法,同时在自己内部扩展自己的方法,利用super 调用 父类的构造函数,super 必须在子类this之前调用
时刻注意this的指向问题,类里面的共有的属性和方法一定要加this使用.
constructor中的this指向的是new出来的实例对象
自定义的方法,一般也指向的new出来的实例对象
绑定事件之后this指向的就是触发事件的事件源
在 ES6 中类没有变量提升,所以必须先定义类,才能通过类实例化对象。
谈谈盒子模型?
在标准盒子模型中,width 和 height 指的是内容区域的宽度和高度。增加内边距、边框和外边距不会影响内容区域的尺寸,但是会增加元素框的总尺寸。
IE盒子模型中,width 和 height 指的是内容区域+border+padding的宽度和高度。
promise是什么?它有哪些作用?
Promise 是异步编程的一种解决方案.简单说就是一个容器,里面保存着某个未来才会结束的事件(通常是一个异步操作)的结果。从语法上说,Promise 是一个对象,可以从改对象获取异步操作的消息。它可以解决回调地狱的问题,也就是异步深层嵌套问题
.catch()
获取异常信息
.finally()
成功与否都会执行(不是正式标准)
/* 1. Promise基本使用 我们使用new来构建一个Promise Promise的构造函数接收一个参数,是函数,并且传入两个参数: resolve,reject, 分别表示异步操作执行成功后的回调函数和异步操作执行失败后的回调函数 */ var p = new Promise(function(resolve, reject){ //2. 这里用于实现异步任务 setTimeout setTimeout(function(){ var flag = false; if(flag) { //3. 正常情况 resolve('hello'); }else{ //4. 异常情况 reject('出错了'); } }, 100); }); // 5 Promise实例生成以后,可以用then方法指定resolved状态和reject状态的回调函数 // 在then方法中,你也可以直接return数据而不是Promise对象,在后面的then中就可以接收到数据了 p.then(function(data){ console.log(data) },function(info){ console.log(info) });
vue-cli 2.0和3.0 有什么区别?
3.0 把配置webpack的文件隐藏了,如果需要配置它需要创建一个vue.config.js文件,3.0 是2018.10月出来的。
箭头函数有哪些特征,请简单描述一下它?
箭头函数没有自己的this,this指向定义箭头函数时所处的外部执行环境的this即时调用call/apply/bind也无法改变箭头函数的this
箭头函数本身没有名字
箭头函数不能new,会报错
箭头函数没有arguments,在箭头函数内访问这个变量访问的是外部执行环境的arguments
箭头函数没有prototype。
#前端#