专注前端领域方向的内容

理解了 JavaScript 的作用域和作用域链对我们理解闭包、模块化、高阶函数等特性能够有更好的帮助，也能让我们在实际开发中，更合理运用块级作用域（let/const）、模块化（ES Module），规避变量污染、逻辑混乱等问题，写出更健壮、可扩展的 JavaScript 代码。

虽然SPA 和 MPA 是两种架构，但是随着技术发展，这两种架构的边界变得模糊，并非选了 SPA 就不能选MPA，有时候我们会混合使用，架构的选型，永远是对用户体验、性能、开发效率以及SEO等内容的平衡，也是对业务场景的适配。对比维度单页应用（SPA）多页应用（MPA）架构本质仅 1 个 HTML 页面作为载体，所有视图通过 JS 动态渲染多个独立 HTML 页面，每个页面对应 1 个 URL，页面切换需重新请求 HTML页面载体单一入口 HTML（如index.html）

在 JavaScript 模块化发展历程中，为解决等问题，先后出现了 CommonJS（CJS）、AMD、CMD、UMD、ES6 Module（ESM）五大主流方案。不同方案因设计目标、运行环境（浏览器 / Node）的差异，形成了各自的语法特性与生态定位。其中ES6 Module是 ES6 官方定义的，旨在统一浏览器与服务器端的模块化语法，解决传统模块化方案（如 CommonJS、AMD）的碎片化问题。

你在写代码的过程中，在什么时候才会设置setTimeout的延时为 0？：有如下几种情况。

我们从应用场景的角度分析，JS 沙箱聚焦于 “安全防护” 与 “应用隔离” 这两大核心需求：在 Web 浏览器端，JS 沙箱能够限制用户自行编写的代码作用范围。例如，它可实现拦截弹窗广告、抵御 XSS 攻击等功能，避免不可信的 JS 文件对页面正常运行造成干扰。而在服务器端，如 LeetCode 代码提交、在线编辑器等，沙箱可以提供有力保障。它能够防止用户提交的恶意代码突破权限限制，从而避免服务器配置被篡改以及数据被窃取的风险。

听上去好像没什么用，也很少会遇到问这种问题的面试场景，但现在大厂的面试除了基本的八股外，也在开始搞一些自己的题库用来判断候选人的能力，这种实际就比较灵活化了，无法预测，但也遇到过本文的问题，主要考察两个方面，一是有没有遇到相关的场景，二是前端基本功。浏览器渲染文字时，会先根据 font 相关样式从字体文件中读取字符的“advance width”（字符前进宽度，即字符本身宽度 + 默认间距），再累加得到整个文本的宽度，此过程属于“样式计算（Recalculate Style）” 阶段。简单举两个例子即可。

浅浅的聊一下 WebSocket第一次看到 ws:// 和 wss:// 时候，感觉好高级啊，还有这种协议。Websocket 历史WebSocket是在2008年6月诞生的1。经由IEFT标准化后，2009年chrome 4第一个提供了该标准支持，并默认启用。于2011年由IEFT标准化为RFC 6455。现在的浏览器均已支持该标准。Websocket 出现的背景思考一下我们经常遇到的一种需求场景，要求在某个网页下，网页的内容可以实时更新。这种情况下，最大众化的方式就是轮询接口了，即通过

又是一个有关安全的问题。一般情况下，我们说的水印是指图片角落上的平台用户名水印。类似于下方图片上的这种，通常只要将图片上传到平台上，平台就会在图片上嵌入水印，当然，有些平台也会提供设置是否需要显示这种水印的开关，或者设置保存的时候才会加上水印。明水印这种水印的实现其实是比较简单的，就是将两张图片合成一张，或者是直接在原图上绘制内容就行了：<img id="pic" src="https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/f3c3c98.

XSS（跨站脚本攻击），聊两句，五毛的。XSS的危害：窃取Cookie，盗用用户身份信息这玩意儿是大多数XSS的目标，也好解决，可以先治个标，直接设置HttpOnly=true ，即不允许客户端脚本访问，设置完成后，通过js去读取cookie，你会发现document.cookie 无法读取到被标识为HttpOnly的Cookie内容了。配合其他漏洞，如CSRF（跨站请求伪造）这个其实就没那么好解决了，因为XSS利用用户身份构造的请求其实对于服务端来说是合法的。比如说咱在B站上传了一条.

问题：edge浏览器下，固定列的边框消失原因：ng-zorro-antd表格组件使用nzLeft和nzRight指令固定的表格列，这两个指令的实现css3中的标签：position: -webkit-sticky !important;position: sticky !important;谷歌、火狐及-webkit-内核的浏览器均支持该属性（css3），IE不支持该属性，所以在IE中，会自动降级，表格无固定列，可滑动的形式。Edge浏览器在1703之后的版本使用了chromium内核，对css

canvas简介在学习一项新技术之前，先了解这项技术的历史发展及成因会帮助我们更深刻的理解这项技术。历史上，canvas最早是由Apple Inc. 提出的，在Mac OS X webkit中创建控制板组件使用，而在canvas称为HTML草案及标准之前，我们是通过一些替代方式去绘图的，比如为人所诟病的Flash，以及非常强大的SVG（Scalable Vector Graphics，可伸缩的...

前端缓存缓存概述在计算机领域中，缓存是一项十分重要的技术。在软件开发，亦或者是在硬件设计开发中，缓存对性能的影响是十分显著的。学过Java，会知道在Integer的自动装箱中 [-128, 127] 这个范围中的转换会有些特殊的表现，稍加研究源码，会知道这是因为Integer中的缓存类有关（该缓存类会使用数组存储[-128, 127]范围内的常量）。当然，在实际开发中，可能存在Redi...

前端项目中，我们经常会使用阿里开源的组件库：ant-design，其提供的组件已经足以满足多数的需求，拿来就能直接用，十分方便，当然了，有些公司会对组件库进行二次封装，改造成极具自家风格的产品。在本系列的文章中，不谈高大上的东西，不深究底层源码，只分享一些项目中遇到的小问题。表格（table）——师傅以为是组件库的bug，没想到……不知道正在阅读本文的读者有没有经历过：在使用 ...

用了一个星期把《你不知道的JavaScript》看完了，但是留下了很多疑惑，于是又带着这些疑惑回头看JavaScript的内容，略有所获。第二遍阅读这本书，希望自己能够有更为深刻的理解。词法作用域……如果是 有状态 的解析过程，还会赋予单词语义……这本书是以编译原理的部份内容结合JavaScript来开篇的，所以如果没有学过编译原理，这一小部分内容显得有些晦涩。虽然多数人没有...

本文的所有实例均基于博客园的页面定制。所有表格内容来自W3CSchool。页面背景（background）博客开通之后，很多人最先做的事情一定是改页面的背景，换成一张图片或者换上一个自己喜欢的颜色，这时候用到的就是background属性。但是，在什么地方用呢？所有的html标签都支持这个属性。所以，随便用。我们经常能看到类似background: #fff;这种使用方式，如果...

如果只是看解决方法，可以直接跳到第二小节简述Angular 1.x版本是用JavaScript编写的，我们在百度Angular经常会搜索到AngularJS，并不是JavaScript的什么衍生版本，就是Angular 1.x。在后续版本中，改用TypeScript来重写了Angular框架。改动较大，所以做了个区分，Angular v1.x就叫AngularJS，v2及后续版本统称为An...

提需求的来了某一期迭代时，新增了一个小功能，即：在单元格中的文本内容，字符超过20个字的时候，需要截断，并显示20个字符+一个省略号，未超过，无视。这需求看上去不怎么复杂，看起来可以用css做（写css写魔怔了，啥都想往这上面靠拢），那先搜一下，字还没打完，就有提示“css限制显示字数，文字长度超出部分用省略号表示”，哎哟我c，这下不就简单了吗？接受挑战于是按照其他人的解决方案，对单元...