每日前端签到（第七十二天）

第七十二天（2018-10-15）

• [html] HTML5的应用程序缓存与浏览器缓存有什么不同？
• [css] 说说你对BEM规范的理解，同时举例说明常见的CSS规范有哪些？
• [js] 举例说明什么是IIFEs？它有什么好处？
• [软技能] 一个项目写很多的纯静态页面，有公共的部分（例如头和尾）你是怎么提取公用的？

题目一：
浏览器缓存针对单个文件,H5离线缓存针对整个应用
H5缓存断网还能用,浏览器缓存断网就用不了
H5缓存核心是applicationCache对象,浏览器缓存核心是cache-control
ps:看了楼上大兄弟,才了解H5缓存将要使用service worker替代
题目二：
BEM：block（块）、element（元素）、modifier（修饰符），一种命名约定，可以让代码更易理解
如：
.card
.card__body
.card__button--primary
题目三：
Instantly Invoked Function Expression 即时调用函数表达式

示例
;(function () {
// ... statements
return ...
)()
最好在 IIFE 前追加分号 ; 来避免解析时与前一个表达式合并出现问题
好处
创建一个局部作用域隔离变量；但在 ES6 拥有了块级作用域后变得没有必要，可以用语句块 { ... } 配合 let/const 替代
将运行逻辑转化为可求值的表达式，弥补 JavaScript 基本逻辑语句不是表达式的缺陷
e.g.
const a = (() => {
if (...) return 1
else return 0
})()
基本等价于
let a
if (...) a = 1
else a = 0
题目四：
iframe：我最开始用的就是这种，方便省事
wekpack引入公共模块：${require('html-loader!../../components/header/header.html')}
以上两种都是纯前端的。
另外现在写静态表面也可以用webapck打包呀。只处理sass和引入公共模块就行了，爽的一比