js的执行原理是什么?

JavaScript011

js的执行原理是什么?,第1张

JS是解释执行的,即读取一个语句就执行一个。以前的严格JS是以分号为语句的分隔符,但现在一些浏览器已经接受以换行符为分隔符(似乎是很多人喜欢用基于对象的编程了,而在JS中写对象的函数是需要加分号的,所以很多人都爱忘)。

JS本身只提供语法解析与少部分内部函数支持,其他的均由宿主支持。比如在网页JS中的window, document, navigator等对象,均是由浏览器提供基于其它语言的代码,这些代码通常被隐藏,但很大程度上决定了JS的运行效率。如果你有兴趣,打开Chrome,按F12,调处Console,然后输alert(注意没有()),你就会发现[native code]这个东西。

原生的JS函数或方法一般都是由运行环境提供,运行环境分多个。

1、浏览器,一般浏览器都是用系统API写的,对WINDOWS,UNIX/LINUX系统是,C语言编写,相应的js原生方法,用C语言实现;特例:MAC OS 与IOS由OBJECTIVE-C,SWIFT提供系统API,相应的js原生方法用OBJECTIVE-C或SWIFT实现。

2、adobe,C语言编写依赖操作系统API,js原生方法由C语言或OBJECTIVE-C,SWIFT现;看运行目标平台。

3、node.js,mongodb,C语言实现,js原生方法由C语言实现。

4、微软excel2010及以后版本,有可能C#或.net实现,具体不详,js原生方法由C#或.net实现。

需求:动态获取一段字符串类型的js脚本,动态编译它并且可以完美在vue中运行与之交互。

实现:动态编译js的方式有eval和new function

简单例子:

eval:

new function:

显然后者更利于扩展,详细了解区别可以参考链接内容:

https://www.zhihu.com/question/29743491

https://imys.net/20151222/eval-with-new-function.html

要注意使用new Function,在vue环境中直接赋值的方式函数作用域与赋值vue结构对象不同: https://jsfiddle.net/5neLzn1x/