前端面试题总结

JavaScript分为ECMAScript,DOM,BOM

BOM:浏览器对象模型,它使得js有能力与浏览器进行‘对话’,如alert()就是它提供的
DOM:文档对象模型,通过它可以访问HTML文档的所有元素,如document.getelementByid()就是它提供的

变量提升

将js中的变量或者函数提高到作用域的顶部,如先把var和function声明的变量前置,再去顺序执行代码

阻止冒泡

什么是冒泡:如果一个按钮绑定了一个‘click’事件,那么click事件会依次在它的父元素中触发

w3c的方法是 e.stopPropagation()
ie是e.cancelBubble=true

取消默认事件

什么是默认事件:比如a的链接,input的submit这都属于默认行为,就是不设置方法,自带的方法行为

w3c的方法是:e.preventDefault()
ie是:e.returnValue=false

js的类型

undefined,null,boolean,number,string,Symbol,array,object
ES6新增了一种原始数据类型:Symbol,表示一种独一无二的值

var 和let,const

var声明的变量会挂载在window上,let和const不会
var生命的变量可以状态提升,let和const不能
let和const声明形成块级作用域
同一作用域下,let和const不能声明同名变量,但是var可以
const 声明时不能不赋值 一旦声明不能修改,但是复合型数据,可以修改属性

JS截取字符串

三种:
.substr(下标值,截取个数)
从输入下标向后面截取几个字符串,默认不写截取全部
注意:下标值可以是负数,长度也可以是负数(结果显示为空)
如果所截选长度超过字符串长度,将显示应有的数据,不会报错
.substring()
参数必须为非负整数,否则返回整个字符串
.slice(开始下标,结束下标-1)

我比较喜欢用slice,因为数组也用slice来截取

闭包

闭包是一种保护私有变量的机制,在函数执行时形成私有的作用域,保护里面的私有变量不受外界干扰。
实现方式,就是在一个方法内再创建一个方法来对需要修改的数据进行操作

js排序

冒泡排序:

思想:第一个和第二个比,谁小谁放在前面,然后第二个再和第三个比,还是谁小谁放在前面,依次类推(注意,已经排过的不再考虑,如,第二次不考虑第一个,第三次不考虑前两个)

sort排序:

sort是数组的一个方法,所以可以自定义排序方式
使用其需要定义两个参数:如n1,n2
如果n1-n2,则升序,反则降序

var arr=[1,11,2,22,5,4,0];
            arr.sort(
                function(n1,n2){
                    return n1-n2;
                });
alert(arr);//[0,1,2,4,5,11,22]
升序

var arr=[1,11,2,22,5,4,0];
            arr.sort(
                function(n1,n2){
                    return n2-n1;
                });
alert(arr);
降序

JS操作数据

join() 将数组中所有元素转化为字符串并连接在一起
reverse() 将数组中的元素颠倒顺序
concat() 数组拼接,返回新数组,且原数组不受影响
slice(开始下标,结束下标-1) 截取数组形成新数组,且原数组不受影响
splice(开始下标,要删除的个数,插入的元素) 删除元素,插入元素
push()在数组末尾添加一个或多个元素
pop()从数组末尾删除一个元素
indexOf和lastIndexOf 查找指定元素的下标值,indexOf是从左到右,lastIndexOf反之,如果没有找到返回-1

map() 返回由原数组中每个元素的平方组成的新数组:
let array = [1, 2, 3, 4, 5];

let newArray = array.map((item) => {
return item * item;
})

console.log(newArray) // [1, 4, 9, 16, 25]

cookie、localStorage和SessionStorage的区别和特点

LocalStorage特点:
只保留在客户端
本地永久存储,关闭浏览器不会清除,除非用户从浏览器清除
每个域可以最多存储5MB

SessionStorage特点:
只保留在客户端
本地临时存储,在页面会话结束时会被清除
存储大小与localStorage相同

Cookie特点:
服务端和客户端都可以访问
可以设置有效期,过期后将会自动删除。如果不设置则是关闭浏览器后失效
存储大小只有4kb
有存储个数限制。每个浏览器限制不一样。建议20个以内。最多的浏览器可以支持50个

this的指向

常规函数 谁调用就指向谁
箭头函数的this指向是继承父级的this指向

async/await 和 promise 的区别

async/await 是建立在 Promise上的,不能被使用在普通回调以及节点回调
async/await 和 Promises 很像,不阻塞
async/await 代码看起来像同步代码。
Promise代码完全都是Promise的API(then、catch等等),操作本身的语义反而不容易看出来

在js中0.1+0.2等于多少?如何让它得到正确答案?

等于0.30000000000000004。原因是因为浮点数运算中产生的误差。

性能优化有哪些?

  1. 减少http请求
  2. 使用cdn加速
  3. 压缩静态资源(css,js,图片之类)
  4. 图标使用iconfont管理 ( 阿里图标库 ) 或者 精灵图
  5. 开启gzip加速
  6. vue的话 开启路由懒加载(优化首屏加载)
  7. vue的话 代码上要合理运用v-if和v-show、v-if和v-for不要出现在同标签上,高耦合的要解偶减少重复的代码

你可能感兴趣的:(前端,javascript,js)