分类 Web前端 下的文章

preset-env按需polyfill是怎么实现的?

开发时我们会使用一些新的 api,但用户的浏览器各种版本都有,可能并不支持这些 api,但我们也不能因此就不用了,这时候就可以通过 polyfill 来解决。

polyfill 是垫片的意思,也就是在运行业务代码之前,在全局注入一些 api 的实现,这样之后运行的业务代码用到该 api 时就有了,也就不会有兼容问题。

阅读剩余部分

为什么Eslint可以检查和修复格式问题,而Babel不可以?

Eslint 可以检查出代码中的错误和一些格式问题,并能自动修复,它的实现原理就是基于 AST (抽象语法树)。

通过 Parser 把源码解析成 AST 对象树,源码字符串中的各种信息就被保存到了这个对象树里,然后遍历 AST,对每一部分做检查就能实现 Lint 的功能,而自动 fix 的功能则是基于字符串替换实现的,指定某一段 range,替换成另一段文本即可。

说起来,Babel 也是基于 AST 实现的代码分析和转换,但是却不能检查和修复格式的问题,这是为什么呢?为什么 Eslint 可以检查格式而 Babel 不可以呢?

阅读剩余部分

sass 3代编译器:ruby sass、node-sass、dart-sass

为了简化样式的描述,浏览器设计了 css 作为 DSL(领域特定语言)。css 写起来简单,但在很多方面都不太方便,比如不支持嵌套,代码比较冗余;不支持继承和混合,代码不好复用等。

为了给 css 扩展代码组织和动态计算的能力,社区出现了一些编译为 css 的预处理语言,比如 sass、less、stylus 等。

此外,还有 postcss 这种后处理器,它是从 css 编译到 css,编译的过程中做各种分析和转换。

阅读剩余部分

通过Chrome Devtools的Memory工具证明string的内存分配方式

JS 的字符串是怎么分配内存的?

可能大家都知道,字符串存在字符串常量池中,被栈或堆上的变量引用。如果变量的值是字符串字面量,则在栈上的变量直接引用字符串常量池中的字符串;如果是字符串是 new String 创建的,则会在堆上创建 String 对象,指向字符串常量池中的字符串,栈上变量指向堆中的 String 对象。

阅读剩余部分