博客园 - 紫云飞
uuid:6cbd1ba2-f883-4c34-aed1-30dde64a3a3e;id=722842
2022-12-24T05:44:40Z
紫云飞
https://www.cnblogs.com/ziyunfei/
feed.cnblogs.com
https://www.cnblogs.com/ziyunfei/p/7987254.html
你从未听说过的 JavaScript 早期特性 - 紫云飞
最近这些年在对 JavaScript 进行考古时,发现网景时代的 JavaScipt 实现,存在一些鲜为人知的特性,我从中挑选几个有趣的说一下。 Object.prototype.eval() 方法 在 JavaScript 1.0 中,eval 和现在一样,只是个全局函数。在 JavaScript
2017-12-06T09:28:00Z
2017-12-06T09:28:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】最近这些年在对 JavaScript 进行考古时,发现网景时代的 JavaScipt 实现,存在一些鲜为人知的特性,我从中挑选几个有趣的说一下。 Object.prototype.eval() 方法 在 JavaScript 1.0 中,eval 和现在一样,只是个全局函数。在 JavaScript <a href="https://www.cnblogs.com/ziyunfei/p/7987254.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6761413.html
JS 正则中的命名捕获分组 - 紫云飞
假设你在一段陌生的代码中看到这样一个函数: 单看这个函数你能知道它是想把“日-月-年”替换成“月-日-年”,还是反过来?匿名捕获分组没法做到这一点,那就该命名捕获分组上场了: 俗话说的好,“一个好的变量名赛过一行注释”,命名捕获分组很大的一个作用就是它能起到注释的作用。 另外,命名捕获分组还有一个好
2017-04-25T09:54:00Z
2017-04-25T09:54:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】假设你在一段陌生的代码中看到这样一个函数: 单看这个函数你能知道它是想把“日-月-年”替换成“月-日-年”,还是反过来?匿名捕获分组没法做到这一点,那就该命名捕获分组上场了: 俗话说的好,“一个好的变量名赛过一行注释”,命名捕获分组很大的一个作用就是它能起到注释的作用。 另外,命名捕获分组还有一个好 <a href="https://www.cnblogs.com/ziyunfei/p/6761413.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6753002.html
Chrome 禁止从页面打开 Data URI 网址了 - 紫云飞
现如今,网民的网络账户被盗,很有可能是被“钓鱼”了。去年的一份安全报告中指出:“近85%的资金损失是通过钓鱼网址泄露支付信息造成的”。 传统的钓鱼网站通常是申请一个和被冒充网站相似的域名,比如 taobao000.com ,或者直接利用三四级域名来冒充,比如 taobao.com.evil.com。
2017-04-24T03:32:00Z
2017-04-24T03:32:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】现如今,网民的网络账户被盗,很有可能是被“钓鱼”了。去年的一份安全报告中指出:“近85%的资金损失是通过钓鱼网址泄露支付信息造成的”。 传统的钓鱼网站通常是申请一个和被冒充网站相似的域名,比如 taobao000.com ,或者直接利用三四级域名来冒充,比如 taobao.com.evil.com。 <a href="https://www.cnblogs.com/ziyunfei/p/6753002.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6675930.html
JavaScript 的正则也有单行模式了 - 紫云飞
正则表达式最早是由 Ken Thompson 于 1970 年在他改进过的 QED 编辑器里实现的,正则里最简单的元字符 “.” 在当时所匹配的就是除换行符外的任意字符: "." is a regular expression which matches any character except <
2017-04-07T04:02:00Z
2017-04-07T04:02:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】正则表达式最早是由 Ken Thompson 于 1970 年在他改进过的 QED 编辑器里实现的,正则里最简单的元字符 “.” 在当时所匹配的就是除换行符外的任意字符: "." is a regular expression which matches any character except < <a href="https://www.cnblogs.com/ziyunfei/p/6675930.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6668101.html
滚动锚定(Scroll Anchoring)- 让视口内容不再因视口上方 DOM 元素的高度变化而产生跳动 - 紫云飞
不知道你有没有经历过这样的场景:当你打开一张“多图杀猫”的页面后,正一张图一张图边滚边看,在你刚准备定睛看某一张图的时候,这张图突然被它上面的内容挤到了视口下方,然后你赶紧把滚动条往下拉,试图追赶这张没看完的图,当你刚刚追上的时候,这张图又一次被挤到了你看不见的地方。 发生这种情况的原因是因为在很多
2017-04-05T09:03:00Z
2017-04-05T09:03:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】不知道你有没有经历过这样的场景:当你打开一张“多图杀猫”的页面后,正一张图一张图边滚边看,在你刚准备定睛看某一张图的时候,这张图突然被它上面的内容挤到了视口下方,然后你赶紧把滚动条往下拉,试图追赶这张没看完的图,当你刚刚追上的时候,这张图又一次被挤到了你看不见的地方。 发生这种情况的原因是因为在很多 <a href="https://www.cnblogs.com/ziyunfei/p/6668101.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/5712519.html
esnext:Function.prototype.toString 终于有规范了 - 紫云飞
从 ES1 到 ES5 的这 14 年时间里,Function.prototype.toString 的规范一字未变: 这段话说了两点内容: 1. toString() 返回的字符串应该符合 FunctionDeclaration 的语法 2. 要不要保留原始的空白符和分号,规范不管 规范管的一点引
2017-03-29T08:36:00Z
2017-03-29T08:36:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】从 ES1 到 ES5 的这 14 年时间里,Function.prototype.toString 的规范一字未变: 这段话说了两点内容: 1. toString() 返回的字符串应该符合 FunctionDeclaration 的语法 2. 要不要保留原始的空白符和分号,规范不管 规范管的一点引 <a href="https://www.cnblogs.com/ziyunfei/p/5712519.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6617900.html
fetch 的控制器和观察者 - 紫云飞
因为受 cancelable promise 的拖延,fetch 一直没有传统的 XHR 所拥有的 abort() 和 onprogress 功能,去年年底 cancelable promise 草案被彻底废弃了,所以今年年初的这几个月里,一份完全新的、fetch 专用的、不依赖 JS 规范、与 P
2017-03-26T06:45:00Z
2017-03-26T06:45:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】因为受 cancelable promise 的拖延,fetch 一直没有传统的 XHR 所拥有的 abort() 和 onprogress 功能,去年年底 cancelable promise 草案被彻底废弃了,所以今年年初的这几个月里,一份完全新的、fetch 专用的、不依赖 JS 规范、与 P <a href="https://www.cnblogs.com/ziyunfei/p/6617900.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6430623.html
淘宝网站上的 HTTP 缓存问题两则 - 紫云飞
在阅读本文前推荐你先阅读我的前两篇文章《 扼杀 304,Cache-Control: immutable》和《关于缓存和 Chrome 的“新版刷新”》;下面要说的两个问题是在淘宝(包括天猫等等)任意主流页面中都存在的,所以你可以随便打开一个页面进行测试;这两个问题我去年在微博上都简单提到过,这里做
2017-02-23T07:36:00Z
2017-02-23T07:36:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】在阅读本文前推荐你先阅读我的前两篇文章《 扼杀 304,Cache-Control: immutable》和《关于缓存和 Chrome 的“新版刷新”》;下面要说的两个问题是在淘宝(包括天猫等等)任意主流页面中都存在的,所以你可以随便打开一个页面进行测试;这两个问题我去年在微博上都简单提到过,这里做 <a href="https://www.cnblogs.com/ziyunfei/p/6430623.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6308652.html
关于缓存和 Chrome 的“新版刷新” - 紫云飞
在读本文前你要确保读过我的上篇文章《扼杀 304,Cache-Control: immutable》,因为本文是接着上文写的。上文说到,在现代 Web 上,“条件请求/304 响应”绝大多数都是浪费资源,因为绝大多数静态资源都是永恒不变的,因此 Firefox 实现了 Cache-Control:
2017-01-20T04:25:00Z
2017-01-20T04:25:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】在读本文前你要确保读过我的上篇文章《扼杀 304,Cache-Control: immutable》,因为本文是接着上文写的。上文说到,在现代 Web 上,“条件请求/304 响应”绝大多数都是浪费资源,因为绝大多数静态资源都是永恒不变的,因此 Firefox 实现了 Cache-Control: <a href="https://www.cnblogs.com/ziyunfei/p/6308652.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6098021.html
写正则不要再瞎转义了 - 紫云飞
在 JavaScript 中,有两个地方用到了反斜杠转义序列,一个是在字符串字面量里,一个是在正则字面量里。其中字符串字面量里的反斜杠转义序列又分为下面几种形式: 1. \ 后面跟着单引号(')、双引号(")、反斜杠自己(\)、b、f、n、r、t、v 其中的一个 2. \ 后面跟着某个行终止符序列,
2016-11-28T05:31:00Z
2016-11-28T05:31:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】在 JavaScript 中,有两个地方用到了反斜杠转义序列,一个是在字符串字面量里,一个是在正则字面量里。其中字符串字面量里的反斜杠转义序列又分为下面几种形式: 1. \ 后面跟着单引号(')、双引号(")、反斜杠自己(\)、b、f、n、r、t、v 其中的一个 2. \ 后面跟着某个行终止符序列, <a href="https://www.cnblogs.com/ziyunfei/p/6098021.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6063426.html
不要在控制台上使用 let/const - 紫云飞
考虑下面的这三句代码和对应的报错信息: 假设写这个代码的人一开始不知道 ES6 里新增的构造函数不能省略 new,于是第一行写错了。然后第二行尝试重新声明一次,结果又报错说重复声明了。那干脆不声明,直接赋值总行吧,结果又报错说 map 未定义。 这三个报错直接对应规范里的下面三条规则(并附通俗解释)
2016-11-15T11:31:00Z
2016-11-15T11:31:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】考虑下面的这三句代码和对应的报错信息: 假设写这个代码的人一开始不知道 ES6 里新增的构造函数不能省略 new,于是第一行写错了。然后第二行尝试重新声明一次,结果又报错说重复声明了。那干脆不声明,直接赋值总行吧,结果又报错说 map 未定义。 这三个报错直接对应规范里的下面三条规则(并附通俗解释) <a href="https://www.cnblogs.com/ziyunfei/p/6063426.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6038213.html
用 const 还是用 let? - 紫云飞
ES6 里新增了两种声明变量的方式,let 和 const,加上原来的 var,一共就有三种方式来声明变量了。那到底该用哪个呢?关于“尽可能不用 var” 这一点,大家应该没有什么意见分歧(其实还是有少数人不这么想的),关于“是用 let 还是用 const”,社区里主要有两种不同的观点: 1. 默
2016-11-11T09:33:00Z
2016-11-11T09:33:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】ES6 里新增了两种声明变量的方式,let 和 const,加上原来的 var,一共就有三种方式来声明变量了。那到底该用哪个呢?关于“尽可能不用 var” 这一点,大家应该没有什么意见分歧(其实还是有少数人不这么想的),关于“是用 let 还是用 const”,社区里主要有两种不同的观点: 1. 默 <a href="https://www.cnblogs.com/ziyunfei/p/6038213.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/6043513.html
为什么为 const 变量重新赋值不是个静态错误 - 紫云飞
const 和 let 的唯一区别就是用 const 声明的变量不能被重新赋值(只读变量),比如像下面这样就会报错: const foo = 1 foo = 2 // TypeError: Assignment to constant variable. 但遗憾的是,这个错误不是个静态错误(stat
2016-11-09T16:12:00Z
2016-11-09T16:12:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】const 和 let 的唯一区别就是用 const 声明的变量不能被重新赋值(只读变量),比如像下面这样就会报错: const foo = 1 foo = 2 // TypeError: Assignment to constant variable. 但遗憾的是,这个错误不是个静态错误(stat <a href="https://www.cnblogs.com/ziyunfei/p/6043513.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/5926123.html
带有“非简单参数”的函数为什么不能包含 "use strict" 指令 - 紫云飞
非简单参数就是 ES6 里新加的参数语法,包括:1.默认参数值、2.剩余参数、3.参数解构。本文接下来要讲的就是 ES7 为什么禁止在使用了非简单参数的函数里使用 "use strict" 指令: function f(foo = "bar") { "use strict" // SyntaxErr
2016-11-01T13:11:00Z
2016-11-01T13:11:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】非简单参数就是 ES6 里新加的参数语法,包括:1.默认参数值、2.剩余参数、3.参数解构。本文接下来要讲的就是 ES7 为什么禁止在使用了非简单参数的函数里使用 "use strict" 指令: function f(foo = "bar") { "use strict" // SyntaxErr <a href="https://www.cnblogs.com/ziyunfei/p/5926123.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/5890322.html
arguments 对象的老历史 - 紫云飞
引题:为什么 JavaScript 中的 arguments 对象不是数组 http://www.zhihu.com/question/50803453 JavaScript 1.0 1995 年, Brendan Eich 在 Netscape Navigator 2.0 中实现了 JavaScr
2016-09-21T12:48:00Z
2016-09-21T12:48:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】引题:为什么 JavaScript 中的 arguments 对象不是数组 http://www.zhihu.com/question/50803453 JavaScript 1.0 1995 年, Brendan Eich 在 Netscape Navigator 2.0 中实现了 JavaScr <a href="https://www.cnblogs.com/ziyunfei/p/5890322.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/5881426.html
去掉你代码里的 document.write("<script... - 紫云飞
在传统的浏览器中,同步的 script 标签是会阻塞 HTML 解析器的,无论是内联的还是外链的,比如: 在这个例子中,HTML 解析器会先解析到第一个 script 标签,然后暂停解析,转而去下载 a.js,下载完后开始执行,执行完后,才会继续解析、下载、执行后面的两个 script 标签,最后解
2016-09-18T06:13:00Z
2016-09-18T06:13:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】在传统的浏览器中,同步的 script 标签是会阻塞 HTML 解析器的,无论是内联的还是外链的,比如: 在这个例子中,HTML 解析器会先解析到第一个 script 标签,然后暂停解析,转而去下载 a.js,下载完后开始执行,执行完后,才会继续解析、下载、执行后面的两个 script 标签,最后解 <a href="https://www.cnblogs.com/ziyunfei/p/5881426.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/5637945.html
SameSite Cookie,防止 CSRF 攻击 - 紫云飞
因为 HTTP 协议是无状态的,所以很久以前的网站是没有登录这个概念的,直到网景发明 cookie 以后,网站才开始利用 cookie 记录用户的登录状态。cookie 是个好东西,但它很不安全,其中一个原因是因为 cookie 最初被设计成了允许在第三方网站发起的请求中携带,CSRF 攻击就是利用
2016-07-12T12:13:00Z
2016-07-12T12:13:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】因为 HTTP 协议是无状态的,所以很久以前的网站是没有登录这个概念的,直到网景发明 cookie 以后,网站才开始利用 cookie 记录用户的登录状态。cookie 是个好东西,但它很不安全,其中一个原因是因为 cookie 最初被设计成了允许在第三方网站发起的请求中携带,CSRF 攻击就是利用 <a href="https://www.cnblogs.com/ziyunfei/p/5637945.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/5642796.html
扼杀 304,Cache-Control: immutable - 紫云飞
随着近些年社交网站的流行,越来越多的人学会了“刷”网页 ── 刷微博,刷朋友圈,刷新闻,刷秒杀页。这里的“刷”,就是刷新的意思,在浏览器里,你可以通过点击刷新按钮,或者用快捷键,或者移动端的下拉操作来进行刷新。 但普通网民不知道的是,通过刷新操作导致的页面加载和通过其他操作(比如点击页面链接,地址栏
2016-07-06T12:02:00Z
2016-07-06T12:02:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】随着近些年社交网站的流行,越来越多的人学会了“刷”网页 ── 刷微博,刷朋友圈,刷新闻,刷秒杀页。这里的“刷”,就是刷新的意思,在浏览器里,你可以通过点击刷新按钮,或者用快捷键,或者移动端的下拉操作来进行刷新。 但普通网民不知道的是,通过刷新操作导致的页面加载和通过其他操作(比如点击页面链接,地址栏 <a href="https://www.cnblogs.com/ziyunfei/p/5642796.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/5618152.html
V8 的 typeof null 返回 "undefined" 的 bug 是怎么回事 - 紫云飞
1997 年,IE 4.0 发布,带来的众多新特性中有一个对未来“影响深远”的 DOM API:document.all。在随后的 6 年里,IE 的市场占有率越来越高,直到 2003 年的 95%。 在这段时间里,产生了两种成千上万的页面。第一种:IE only 的页面,由于超高的市场占有率,开发
2016-06-26T12:29:00Z
2016-06-26T12:29:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】1997 年,IE 4.0 发布,带来的众多新特性中有一个对未来“影响深远”的 DOM API:document.all。在随后的 6 年里,IE 的市场占有率越来越高,直到 2003 年的 95%。 在这段时间里,产生了两种成千上万的页面。第一种:IE only 的页面,由于超高的市场占有率,开发 <a href="https://www.cnblogs.com/ziyunfei/p/5618152.html" target="_blank">阅读全文</a>
https://www.cnblogs.com/ziyunfei/p/5558712.html
IntersectionObserver API - 紫云飞
温馨提示:本文目前仅适用于在 Chrome 51 及以上中浏览。 2016.11.1 追加,Firefox 52 也已经实现。 2016.11.29 追加,Firefox 的人担心目前规范不够稳定,未来很难保证向后兼容,所以禁用了这个 API,需要手动打开 dom.IntersectionObser
2016-06-13T10:57:00Z
2016-06-13T10:57:00Z
紫云飞
https://www.cnblogs.com/ziyunfei/
【摘要】温馨提示:本文目前仅适用于在 Chrome 51 及以上中浏览。 2016.11.1 追加,Firefox 52 也已经实现。 2016.11.29 追加,Firefox 的人担心目前规范不够稳定,未来很难保证向后兼容,所以禁用了这个 API,需要手动打开 dom.IntersectionObser <a href="https://www.cnblogs.com/ziyunfei/p/5558712.html" target="_blank">阅读全文</a>