HTML5遇到IE版本太老不支持？用Polyfill来解决

Vedu • 2017-07-30 07:33 • 程序开发 • 阅读 2305

网络在快速发展中，新的框架、工具甚至语言来来去去。然而，许多程序员不得不将速度调整到和最慢更新的用户一样快。

新浏览器在后台自动更新，不需要许可，并且在新的API方面正在实现跨越式发展。然而即使现代浏览器也在不同的时间实现不同的功能，即便你认为是潮流的功能在几年之后未必还是潮流。

如果对所有网友进行调查，很可能现在还有用户在使用IE9，你可以选择继续编代码，或者将所有内容委托给jQuery或一些框架？这里还有一个不错的选择让程序员永远不需要在纠结于浏览器版本：polyfill。

Polyfill是什么？为什么需要它？

Remy Sharp在2009年的书和博客中创造了这个词。如果浏览器中存在该功能，则polyfill会让浏览器执行其操作，如果没有，则扩展单元会插入缺少的功能。polyfill填补了旧版浏览器的漏洞，对于缺少的功能，它可以使用非本地代码复制本机API。

2009年，ECMAScript第五版登陆，这是语言的一大进步。ECMAScript 2015发布了类似的更新。展望未来，对语言的改进将是增量的，每年都至少发生一次。新的功能不断进入编程语言，除了核心语言本身，还有DOM和Web平台的各种API。

为了突出显示现代和旧版浏览器之间的差异，如果是最新的Chrome版本与Internet Explorer 9比较（某些公司仍然不满意地支持），你会发现，IE9甚至IE11对ECMAScript 6的支持几乎为零。

程序员在编码的时候有没有想过代码需要什么？代码可能需要闪亮的新语法，并吐出纯朴的老式ECMAScript 5。如果想在代码中使用异步/等待、扩展参数、类等，则需要将ES6代码转换为ES5，这时候可以试试Babel，这个号称下一代 JavaScript 的语法编译器。

但是，程序员不能填充JavaScript语法。虽然Babel可以将部分功能转换为常规功能，但Polyfill将为全局范围和本机原型添加方法。Babel提供自己的ES6 polyfill，用Babel网站的话来说是提供“内置的Promise或WeakMap”，静态方法如Array.from orObject.assign，实例方法如Array.prototype.includes和生成器函数。 ”

所以polyfill就足以提供所有ES6功能，也许你使用classList API添加和删除类，或者使用matchMedia进行媒体查询，但是仍然使用IE9。这里还有一个很棒的服务，可以促使你选择polyfill。

Polyfill.io是“Financial Times”开发的开源计划。它目前每天可收到多达2.04亿个请求，并将其描述为“一个规范的聚合库”。这种Polyfills-on-demand交付系统使程序员能够仔细阅读说明并决定是否使用。

理想情况下，程序员将实际需要的多重填充功能发送给特定浏览器，并且只发送特定浏览器实际需要的Polyfill。Polyfill.io可以实现这两个需求，该服务不会向新版浏览器传递过多支持，而是读取User-Agent HTTP头，以便它只能传递必要内容。新版浏览器将收到几乎空的文件，旧版本的IE则将收到一个巨大的代码包。

程序员可以通过查询字符串中指定要使用的功能列表来减轻传递给旧机器的代码重量。如果省略，将使用一组默认值。使用该服务一定要查看HTTP请求，但它的易用性是值得肯定的。

Polyfill.io非常全面，它包括一些流行的浏览器API，如Fetch和Promises。但API远远不足以满足程序员的需求，Polyfill目前还存在许多待填充的新兴API，如果程序员感兴趣，不妨加入到其中，一起来完善这个不错的项目吧。

内容出处：，

声明：本网站所收集的部分公开资料来源于互联网，转载的目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。如果您发现网站上有侵犯您的知识产权的作品，请与我们取得联系，我们会及时修改或删除。文章链接：http://www.yixao.com/procedure/4253.html

HTML5遇到IE版本太老不支持？用Polyfill来解决

相关推荐

发表评论