codingmeup
codingmeup
### Service Worker Service Worker 是浏览器在后台独立于网页运行的脚本，它打开了通向不需要网页或用户交互的功能的大门。 现在，它们已包括如离线缓存，转发请求和网络代理等功能。Service Worker**实际上是浏览器和服务器之间的代理服务器，它最大的特点是在页面中注册并安装成功后，运行于浏览器后台，不受页面刷新的影响，可以监听和截拦作用域范围内所有页面的 HTTP 请求**。 在 Service Worker 出现前，存在能够在网络上为用户提供离线体验的另一个 API，称为 AppCache（html5 manifest缓存技术）。 AppCache API 存在的许多相关问题，在设计 Service Worker 时已予以避免。 基于Service Worker和cacheStorage缓存及离线开发，套路非常固定，无侵入，且语言纯正，直接复制粘贴就可以实现缓存和离线功能，纯前端，无需服务器配合。一个看上去很酷的功能只要复制粘贴就可以实现，绝对是成本极低的，小白中的小白也能上手。 由于成本几乎可以忽略不计，此时离线功能支持的投入产出比相当高了，经验告诉我这种技术以后流行和普及的可能性非常高 #### Service Worker 相关注意事项：...
### 函数式编程（Functional Programming，后面简称FP） #### 为什么叫函数式编程 **函数**实际上是一个关系，或者说是一种**映射**，而这种映射关系是可以组合的，一旦我们知道一个函数的输出类型可以匹配另一个函数的输入，那他们就可以进行组合。 在我们的编程世界中，我们需要处理的其实也只有**“数据”和“关系”**，而**关系**就是**函数**。我们所谓的编程工作也不过就是在找一种映射关系，一旦关系找到了，问题就解决了，剩下的事情，就是让数据流过这种关系，然后转换成另一个数据罢了。 我特别喜欢用**流水线**去形容这种工作，把输入当做原料，把输出当做产品，数据可以不断的从一个函数的输出可以流入另一个函数输入，最后再输出结果，这不就是一套流水线嘛？ 现在你明确了函数式编程是什么了吧？它其实就是强调在编程过程中把更多的关注点放在如何去构建关系。**通过构建一条高效的建流水线，一次解决所有问题。而不是把精力分散在不同的加工厂中来回奔波传递数据**。 -------- 函数式编程不修改外部变量，所以根本不存在线程锁的问题。多线程并发的时候不用担心使用的变量被其他线程所修改 React就是典型的FP。它不同于Vue这样的MVVM框架，它仅仅是个View层。 ReactView = render(data) 它只关心你的输入，最终给你返回相应视图。所以你休想在react组件中去修改父组件的状态，更没有与dom的双向绑定。 这个是框架上的应用，那么在我们平常书写JavaScript时有哪些应用呢？换句话说，平常书写js时候，遇到什么情况，我们采用FP会更好。 - **函数是一等公民**。就是说函数可以跟其他变量一样，可以作为其他函数的输入输出。喔，回调函数就是典型应用。这是函数式编程得以实现的前提，因为我们基本的操作都是在操作函数。这个特性意味着函数与其他数据类型一样，处于平等地位，可以赋值给其他变量，也可以作为参数，传入另一个函数，或者作为别的函数的返回值. - **声明式编程** ，函数式编程大多时候都是在声明我需要做什么，而非怎么去做。这种编程风格称为 声明式编程 ，可读性特别高，SQL 语句就是声明式的，你无需关心 Select 语句是如何实现的，不同的数据库会去实现它自己的方法并且优化。React 也是声明式的，你只要描述你的 UI，接下来状态变化后 UI...
### 执行上下文 执行上下文是评估和执行 JavaScript 代码的环境的抽象概念。每当 Javascript 代码在运行的时候，它都是在执行上下文中运行。 - **全局执行上下文** 这是默认或者说基础的上下文，任何**不在函数内部**的代码都在全局上下文中。它会执行两件事：创建一个全局的 window 对象（浏览器的情况下），并且设置 this 的值等于这个全局对象。一个程序中只会有一个全局执行上下文。 - **函数执行上下文** 每当一个函数被调用时, 都会为该函数创建一个新的上下文。每个函数都有它自己的执行上下文，不过是**在函数被调用（运行）时**创建的。函数上下文可以有任意多个。每当一个新的执行上下文被创建，它会按定义的顺序执行一系列步骤。 - **Eval 函数执行上下文** 执行在 eval 函数内部的代码也会有它属于自己的执行上下文，但由于 JavaScript 开发者并不经常使用 eval，所以我不会讨论它。 ### 管理执行栈 执行栈，也就是在其它编程语言中所说的“调用栈”，是一种拥有...
## XSS攻击 XSS （Cross-site scripting） 允许恶意web用户将代码植入到提供给其它用户使用的页面中。其实在web前端方面，可以简单的理解为一种javascript代码注入， 精髓不在于“跨站”，在于“脚本” ```js // 文本 $username = "alert('侯医生');"; $username = "\u003cscript\u003ealert('okok')"; // 图片 $imgsrc="\" onerror=\"javascript:alert('侯医生');\""; $username="\u003cimg src=\'\' onerror=javascript:alert(\'okok\');\u003e"; // 导航栏 url 携带参数 $url = "localhost:8080/id=xxx";...
* nodejs 下操作数据库 > mysql -> sequelize库 > mongodb -> mongoose库 * mysql mongodb 简单的概念区分 > 表 - 集合 - schema - table -collection 行 - 文档 - row -...
评估前端工程师建议标准: S-A-B-C-D 1: 职场能力 - 是否能提出自己对产品和运营能力的思考(S-建议思考卓出, A-能提出合理Idea B-能提出观点, C-能遵循观点, D-不思考) - 是否能清晰接受需求和表达出自己的观点(S-卓越, A-较合理, B-能接受, C-理解不到位, D-错误理解及不反馈) - 是否能按期安排完成好手上工作内容(S-能且推动排期, A-效率完成, B-吃力完成, C-需要协助完成, D-不能完成) - 是否能较好协同好同事之间的关系(S-口碑较好,大家普遍看好潜力, A-能够胜任职级, B-一般般, C-还需加油, D-需淘汰) 2: 技术学习能力...
# AUDIO 前一段时间的一个案子是开发一个有声课件，大致就是通过导入文档、图片等资源后，页面变为类似 PPT 的布局，然后选中一张图片，可以插入音频，有单页编辑和全局编辑两种模式。其中音频的导入方式有两种，一种是从资源库中导入，还有一种就是要提到的录音。 说实话，一开始都没接触过 HTML5 的 Audio API，而且要基于在我们接手前的代码中进行优化。当然其中也踩了不少坑，这次也会围绕这几个坑来说说感受（会省略一些基本对象的初始化和获取，因为这些内容不是这次的重点，有兴趣的同学可以自行查找 MDN 上的文档）： - 调用 Audio API 的兼容性写法 - 获取录音声音的大小（应该是频率） - 暂停录音的兼容性写法 - 获取当前录音时间 # 录音前的准备 开始录音前，要先获取当前设备是否支持 Audio API。早期的方法 `navigator.getUserMedia` 已经被...
### 最近收到需求抽奖Web版需要兼容ie8+的。于是开始踩坑的路程 ## ie8，ie9首先考虑跨域问题 主要是采用服务端代理的方法，在项目代码里面放入java代码 （1）服务端支持在请求的接口加入前缀/v0.1/dispatcher， （2）在请求的接口头部加入Dispatcher头 例如：  这样就可以通过访问同域的服务端转发接口，实现跨域请求 ## 解决es3保留字的问题 保留字如： ``` default, class等 ``` 报错信息： ``` 缺少标识符 ``` 解决方法： 在webpack1的配置文件中加入配置： ``` postLoaders: [{ test: /\.js$/, loaders: ['es3ify-loader']...
23、Git相关
--- Git项目使用规范一-约定 --- > 前提：Git项目管理中存在许多不规范的使用方法，经常使项目中出现一些不必要的工作量，特定义一份Git使用规范，要求一处五组相关同学强制执行 [TOC] ### 一. 开发前 ``` // 本地git配置core.autocrlf，默认换行统一使用LF，不改变远程 git config --global core.autocrlf input // 提取远程项目数据 git checkout master git pull git branch feature/user_import git push origin...