每日五题(3)

1.伪数组和真数组的区别

（1）伪数组不是真实的数组，它的_proto_中只有几个方法
（2）伪数组其实是一个对象，其原型是Object，.length是它的一个键值，可以获取长度，但对象的键值通常不会自动更新，则当我们改变伪数组长度时，其length值不会变化；
（3）伪数组拥有角标索引，可以通过length属性遍历获取所有值；
（4）伪数组不可以使用数组的内置方法。

伪数组转化成真数组：
（1）遍历伪数组，将值通过索引逐个添加到新数组
（2）利用Array的原型对象的slice方法，配合call()或apply()方法修改

let arr = Array.prototype.slice.apply(argument)
#等同于
let arr = Array.prototype.slice.call(argument)
let arr = [].slice.call(argument)

（3）利用ES6扩展运算符（…）转化（必须保证伪数组是可迭代的）

let arr = […argument]

（4）利用ES6的Array.from方法

let arr = Array.from(argument)

2.C3新增了哪些特性

-弹性布局flex
为盒状模型提供最大的灵活性。

• flex-direction 决定主轴的方向
• flex-wrep 定义如果一条轴线排不下，如何换行
• flex-flow 是flex-direction属性和flex-wrap属性的简写形式，默认值为row nowrap
• justify-content 定义项目在主轴上的对齐方式
• align-items 定义项目在交叉轴上的对齐方式
• align-content 定义了多根轴线的对齐方式

-盒子模型box-sizing
box-sizing：borderbox
作用是添加后设置padding和border不会撑大盒子

-字体图标
font-face，引入字体图标，字体图标可通过网站获取

-三个与动画相关的特性

• Transition，才元素从一种样式变换到另一种样式时为元素添加效果
• Transform，用来向元素应用各种2D和3D转换，该属性允许我们对元素进行旋转、缩放、移动或倾斜等操作
• Animation，制作动画效果需要两步，首先用关键帧声明动画，再用animation调用动画。
  关键帧语法：@keyframes animation-name

-border边框效果

• border-radius，创建圆角边框
• box-shadow，为元素添加阴影
• border-image，使用图片来绘制边框

-文字效果

-背景

• background-clip，设置背景颜色或图片的覆盖范围
• background-origin，用于确定背景的位置
• background-size，调整背景图片的大小

-媒体查询

-渐变
包括linear-gradient（线性渐变）和radial-gradient（径向渐变），常与2D转换使用

3.什么是本地存储？怎么使用，详细阐述其流程

localStorage: 长期存储于浏览器，可存储5M，所有同源窗口共享数据
sessionStorage: 浏览器关闭，数据就被销毁，也可存储5M，只在同一浏览器窗口共享数据
cookie： 有有效期，可存储4kB，所有同源窗口共享数据，数据会随着请求存储到请求报文中

本地存储：直接在客户端存储用户信息。
HTML5常用的几种本地存储方式：

• Cookie
  cookie是与特定域名绑定的，设置cookie后，它会与请求一起发送到创建它的域。
• Web Storage
  包括LocalStorage，SessionStorage
  两者用法基本一致，唯一不同的是，一旦关闭网页，SessionStorage将会删除数据
• IndexedDB（前端数据库）

流程！！！（未完待续）

https://juejin.cn/post/7025416782810710024
https://juejin.cn/post/6925311938419408904

4.对闭包的了解

无论何时声明新函数并将其赋值给变量，都要存储函数定义和闭包。
当一个函数被创建并传递或从另一个函数返回时，会携带一个背包，包含在函数创建时作用域中的所有变量。
函数定义附带一个背包，它的包中存储了函数定义创建时作用域中的所有变量。

 1: function createCounter() {
 2:   let counter = 0
 3:   const myFunction = function() {
 4:     counter = counter + 1
 5:     return counter
 6:   }
 7:   return myFunction
 8: }
 9: const increment = createCounter()
10: const c1 = increment()
11: const c2 = increment()
12: const c3 = increment()
13: console.log('example increment', c1, c2, c3)

如上代码所示，打印出来c1，c2，c3结果分别为1，2，3
在执行第10行代码后，闭包中此时变量counter的值是1，在执行第11行代码时，寻找变量counter，在查找本地或全局执行上下文之前，检查一下闭包，得到counter的值为1，进而计算函数内第四行代码，return出2赋值给c2

5.什么是vue（学习一下）

vue是一套用于构建用户界面的渐进式JavaScript框架，即就是一个js库，并且不依赖别的js库。
与传统的JS和JQuery框架不同，vue的渐进式框架表示开发者可以从简单组件写起，渐渐搭建出一个复杂的前端平台。
形成vue渐进式框架的核心概念为：组件化，MVVM，响应式，生命周期