webview脚本js一些兼容性记录

自动化拦截思路

js方面

1 hook方式,改变原有流程
2.监控方式, 比如添加事件, 循环

端

拦截所有请求, 修改对应资源

兼容性问题

安卓 4.4 不能使用ES6, nodelist不能 foreach
MutationObserver 需要37

解决方案

1、使用Babel，通过的方式，让代码在babel中工作，此种办法性能较差，且引用的一些库无法工作，未最终弄采用，只做参考。
2、使用前端打包工具，如grunt，webpack等，将ES6代码自动编译为ES5。
3、更换浏览器内核，备选项有两个，X5和crosswalk，看技术文章说crosswalk体积比较大，果断抛弃，使用了与微信QQ共享内核的X5。

ES5和ES6区别

1、var 和 const、let

ES5：var存在变量提升。
ES6：let和const不存在变量提升。

2、for…in 和 for…of

ES5：for…in，循环的是key，手动给对象添加属性后，可以遍历到新属性。
ES6：for…of，循环的是value，手动给对象添加属性后，不可以遍历到新属性。

3、Number.isFinite(),Number.isNaN()和isFinite(),isNaN()的区别

ES5：isNaN()，isFinite()，这两个方法先调用Number()将非数值的值转为数值，再进行判断。
ES6：Number.isNaN()，Number.isFinite()，这两个方法直接进行判断。

Number.isFinite()对于非数值一律返回false，Number.isNaN()只有对于NaN才返回true，非NaN一律返回false。

4、Number.parseInt(),Number.parseFloat()和parseInt(),parseFloat()

ES5：parseInt(),parseFloat()
ES6：Number.parseInt(),Number.parseFloat()

参考

https://blog.csdn.net/henouren/article/details/77934183
https://blog.csdn.net/xuxuan1997/article/details/82153551
https://blog.csdn.net/u010716530/article/details/103681316
https://segmentfault.com/a/1190000023155533
https://developer.mozilla.org/en-US/docs/web/api