1、避免大量 if...else...
// 优化前
if (x === a) {
res = A;
} else if (x === b) {
res = B;
} else if (x === c) {
res = C;
}
// 优化后
let mapRes = {
a: A,
b: B,
c: C
}
res = mapRes[x];
// 优化前
const isMammal = (creature) => {
if (creature === "human") {
return true;
} else if (creature === "dog") {
return true;
} else if (creature === "cat") {
return true;
}
return false;
}
// 优化后
const isMammal = (creature) => {
const mammals = ["human", "dog", "cat"];
return mammals.includes(creature);
}
2、CSS中，box-sizing属性值有什么用？
box-sizing用来控制元素的盒子模型的解析模式，默认为content-box
context-box：W3C的标准盒子模型，设置元素的 height/width 属性，指的是content部分的高/宽
border-box：IE传统盒子模型，设置元素的height/width属性，指的是border + padding + content部分的高/宽
3、什么是变量提升
函数在运行的时候，会首先创建执行上下文，然后将执行上下文入栈，然后当此执行上下文处于栈顶时，开始运行执行上下文。 在创建执行上下文的过程中会做三件事：创建变量对象，创建作用域链，确定 this 指向，其中创建变量对象的过程中，首先会为 arguments 创建一个属性，值为 arguments，然后会扫码 function 函数声明，创建一个同名属性，值为函数的引用，接着会扫码 var 变量声明，创建一个同名属性，值为 undefined，这就是变量提升。
4、Null是对象吗？为什么？
null不是对象。 虽然 typeof null 会输出 object，但是这只是 JS 存在的一个悠久 Bug。在 JS 的最初版本中使用的是 32 位系统，为了性能考虑使用低位存储变量的类型信息，000 开头代表是对象然而 null 表示为全零，所以将它错误的判断为 object 。
5、Javascript本地存储的方式有哪些，有什么区别，及有哪些应用场景？
cookie
类型为「小型文本文件」，指某些网站为了辨别用户身份而储存在用户本地终端上的数据。是为了解决 HTTP 无状态导致的问题 作为一段一般不超过 4KB 的小型文本数据，它由一个名称（Name）、一个值（Value）和其它几个用于控制 cookie 有效期、安全性、使用范围的可选属性组成 但是cookie在每次请求中都会被发送，如果不使用 HTTPS 并对其加密，其保存的信息很容易被窃取，导致安全风险。举个例子，在一些使用 cookie 保持登录态的网站上，如果 cookie 被窃取，他人很容易利用你的 cookie 来假扮成你登录网站。
sessionStorage
sessionStorage 和 localStorage 使用方法基本一致，唯一不同的是生命周期，一旦页面（会话）关闭，sessionStorage 将会删除数据。
localStorage
生命周期：持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的存储的信息在同一域中是共享的当本页操作（新增、修改、删除）了localStorage的时候，本页面不会触发storage事件，但是别的页面会触发storage事件。大小：5M（跟浏览器厂商有关系）localStorage本质上是对字符串的读取，如果存储内容多的话会消耗内存空间，会导致页面变卡受同源策略的限制。
区别
- 存储大小： cookie数据大小不能超过4k，sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。
- 有效时间：localStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据； sessionStorage 数据在当前浏览器窗口关闭后自动删除；cookie设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。
- 数据与服务器之间的交互方式： cookie的数据会自动的传递到服务器，服务器端也可以写cookie到客户端； sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。
应用场景
在了解了上述的前端的缓存方式后，我们可以看看针对不对场景的使用选择： 标记用户与跟踪用户行为的情况，推荐使用cookie；适合长期保存在本地的数据（令牌），推荐使用localStorage；敏感账号一次性登录，推荐使用sessionStorage。
网友评论