前端香菜酱

我们可以根据需求定制规则，激活或者挂起某项规则。 然而现实中，作为搬砖前线的一份子，我们并非单打独斗，团队每个人，都得遵循共同的编码规则，这时候，SonarQube 就出场了。 作为一个本地代码规范警告服务，我们不需要 SonarQube 使用那些花里胡哨的图标和文字展示什么问…

浏览器中的安全，可以按照系统安全、网络安全、页面安全三个方面来了解。 谁也无法保证浏览器自身不存在漏洞，浏览器在执行前又无法分辨从网络拿到的资源是否安全，而操作系统的各种权限让网络资源接触到是有风险的，因此默认所有网络资源都是不可信的。 现代浏览器早已经拥抱了多进程的架构，从输…

在 一段代码搞清楚 js 里的执行上下文和调用栈 中我们理解了 js 里的执行上下文以及调用栈的形成。 js 代码编译阶段，全局代码中，如果遇到了 let 或者 const 声明的变量，会把变量放到全局执行上下文的词法环境（Lexical Environment）中。 函数作用…

js 中有变量提升的概念，意思是：在 JavaScript 代码执行过程中，JavaScript 引擎把变量的声明部分和函数的声明部分提升到代码开头。 变量被提升后，会给变量设置默认值，这个默认值就是我们熟悉的 undefined。 没错，js 代码的确是“从上到下逐行执行”的…

业务开发中，我们几乎不需要关注 npm install/yarn 执行之后，node_modules 中的结构是什么样的，但某些时刻，不知道 node_modules 的安装规则，可能让你的代码写起来很顺滑，build 很艰涩。 比如，如果你的项目是基于 create-reac…

flex 布局中，flex 设置单、双、三值的时候分别有什么意义。 我发现第三个子项并不是期待的 75px ，这个疑问稍后再讲。 也就是说，双值 第一个 flex-grow ，第二个无单位的话，是 flex-shrink 。 三值的话，分别是 flex-grow | flex-…

跨域，即跨域资源共享——Cross-origin resource sharing，这是一个 w3c 标准，这个标准允许浏览器向非同源服务器发出 XMLHttpRequest 请求。 什么是非同源服务器呢？同源的定义是：两个 url 的 protocol（http/https）…

修 bug 时，我常常用 console.log 去查看问题到底出在哪儿了。但当我打印一个对象时，经常不得不使用 JSON.stringify 去打印对象某个时刻的值。 chrome 中，浅蓝色背景的 i 提示我：value below was evaluated just n…

顾名思义，在内存中缓存资源。 控制权在浏览器，前后端没办法干涉。 硬盘缓存。 也可以叫做 http 缓存，因为它的缓存规则严格遵守 http 头部规范。 disk cache 的控制权在后端，disk cache 可以被分为强缓存和协商缓存。 这是一个响应头，它的值是一个 ht…