JavaScript中的eval()函数详解

eval(“1+2”)，-> 3

动态判断源代码中的字符串是一种很强大的语言特性，几乎没有必要在实际中应用。如果你使用了eval()，你应当仔细考虑是否真的需要使用它。

一、eval()是一个函数还是一个运算符

eval()是一个函数，但由于它已经被当成运算符来对待了。。JavaScript语言的早期版本定义了eval函数，现代JavaScript解释器进行了大量的代码分析和优化。而eval的问题在于，用于动态执行的代码通常来讲不能分析，换句话说，如果一个函数调用了eval，那么解释器将无法对这个函数做进一步优化，而将eval定义为函数的另一个问题是，它可以被赋予其他的名字，var f=eval；那么解释器就无法放心的优化任何调用了f()的函数。而当eval是一个运算符的时候，就可以避免这些问题。

二、eval()

eval()只有一个参数。如果传入的参数不是字符串，它直接返回这个函数。如果参数是字符串，它会把字符串当成JavaScript代码进行编译，如果编译失败者抛出一个语法错误异常。如果编译成功，则开始执行这一段代码，并返回字符串中的最后一个表达式会或语句的值，如果最后一个表达式或语句没有值，则最终返回undefined。如果字符串抛出一个异常，这个异常将把该调用传递给eval()。

关于eval最重要的是，它使用了调用它的变量作用域环境。也就是说，它查找变量的值和定义新变量和函数的操作和局部作用域中的代码完全一样。如果一个函数定义了一个局部变量x，然后调用eval(“x”)，它会返回局部变量的值。如果它调用eval(“x=1”)，它会改变局部变量的值。如果函数调用了eval(“var y=2;”),它声明了一个新的局部变量y，同样地，一个函数可以通过如下代码声明一个局部变量：

eval(“function f(){return x+1;}”);

如果在最顶层的代码中调用eval，当然，它会作用于全局变量和全局函数。

需要注意的是，传递给eval的字符串必须在语法上将的通，不能通过eval往函数中任意粘贴代码片段，比如：eval(“return ;”)是没有意义的，因为return只有在函数中才起到作用，并且事实上，eval的字符串执行时的上下文环境和调用函数的上下文环境是一样的，这不能使其作为函数的一部分来运行。如果字符串作为一个单独的脚本是有语义的，那么将其传递给eval作参数是完全没有问题的，否则，eval会抛出语法错误异常。

三、全局eval()

eval()具有更改布局变量的能力，这对于JavaScript优化器来说是一个很大的问题。然而作为一种权宜之计，JavaScript解释器针对那些调用了eval的函数所做的优化并不多。但当脚本定义了eval的一个别名，且用另一个名称调用它，JavaScript解释器又会如何工作呢？为了让JavaScript解释器的实现更加简化，ECMAScript3标准规定了任何解释器都不允许对eval赋予别名。如果eval函数通过别名调用的话，则会抛出一个EavlError异常。

实际上，大多数的实现并不是这么做的。当通过别名调用时，eval会将其字符串当成顶层的全局代码来执行。执行的代码可能会定义新的全局变量和全局函数，或者给全局变量赋值，但却不能使用或者修改主调函数中的局部变量，因此，这不会影响到函数内的代码优化。

ECMAScript5是反对使用EavlError的，并且规范了eval的行为，“直接的eval”，当直接使用非限定的“eval”名称来调用eval（）函数时，通常称为“直接eval”。直接调用eval（）时，它总是在调用它的上下文作用域内执行。其他的间接调用则使用全局对象作为其上下文作用域，并且无法读、写、定义局部变量和函数。下面有一段示例代码：

代码如下:

var geval=eval;                //使用别名调用evla将是全局eval
var x="global",y="global";    //两个全局变量
function f(){                //函数内执行的是局部eval
    var x="local";            //定义局部变量
    eval("x += ' chenged';");//直接使用eval改变的局部变量的值
    return x;                //返回更改后的局部变量
}
Function g(){                //这个函数内执行了全局eval
    var y="local";
    geval("y += ' changed';"); //直接调用改变了全局变量的值
    return y;
}
console.log(f(),x);            //改变了布局变了，输出 “local changed global”
console.log(g(),y);            //改变了全局变量，输出    “local global changed”

全局的eval的这些行为不仅仅是处于代码优化其的需要而作出的一种折中方案，它实际上是一种非常有用的特性，它允许我们执行那些对上下文没有任何依赖的全局脚本代码段。真正需要eval来执行代码段的场景并不多见。但当你真的意识到它的必要性的时候，你更可能会使用全局eval而不是局部eval。

四、严格eval()

ECMAScript5严格模式对eval（）函数的行为施加了更多的限制，甚至对标识符eval的使用也施加了限制。当在严格模式下调用eval时，或者eval执行的代码段以“Use strict” 指令开始，这里的eval是私有上下文环境中的局部eval。也就是说，在严格模式下，eval执行的代码段可以查询或更改局部变量，但不能在局部作用域中定义新的变量或函数。

此外，严格模式将“eval”列为保留字，这让eval（）更像一个运算符。不能用一个别名覆盖eval（）函数。并且变量名，函数名。函数参数或者异常捕获的参数都不能取名为eval。

宝剑锋从磨砺出，梅花香自苦寒来。

赞 (0)

相关推荐

  • JavaScript eval() 函数介绍及应用示例

    eval(String) 函数可计算某个字符串,并执行其中的的 JavaScript 代码. 返回值 通过计算 string 得到的值(如果有的话). 说明 该方法只接受原始字符串作为参数,如果 string 参数不是原始字符串,那么该方法将不作任何改变地返回.因此请不要为 eval() 函数传递 String 对象来作为参数. 如果试图覆盖 eval 属性或把 eval() 方法赋予另一个属性,并通过该属性调用它,则 ECMAScript 实现允许抛出一个 EvalError 异常. 抛出 如

  • JavaScript中eval()函数用法详解

    eval() 函数计算 JavaScript 字符串,并把它作为脚本代码来执行. 如果参数是一个表达式,eval() 函数将执行表达式.如果参数是Javascript语句,eval()将执行 Javascript 语句. 语法 复制代码 代码如下: eval(string) 参数 描述 string 必需.要计算的字符串,其中含有要计算的 JavaScript 表达式或要执行的语句. eval()函数用法详解: 此函数可能使用的频率并不是太高,但是在某些情况下具有很大的作用,下面就介绍一下eva

  • JS中eval函数的使用示例

    eval(obj) ; 该函数会将 obj 当做代码去执行一遍. 例子: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

  • javascript中eval函数用法分析

    本文实例分析了javascript中eval函数用法.分享给大家供大家参考.具体分析如下: eval()只有一个参数,如果传入的参数不是字符串,则直接返回这个参数.否则会将字符串当成js代码进行编译,如果编译失败则抛出语法错误(SyntaxError)异常.如果编译成功则开始执行这段代码,并返回字符串中的最后一个表达式或语句的值:如果最后一个表达式或语句没有值,则最终返回undefined.如果字符串抛出异常,则该异常将把该调用传递给eval(); eval()最为重要的是,它使用了调用它的变量

  • 对js eval()函数的一些见解

    一.eval是基本使用规则 •1 eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码. •2 eval(string) •3 string必需.要计算的字符串,其中含有要计算的 JavaScript 表达式或要执行的语句. •4 eval()只有一个参数. •5 eval使用比较不安全,忘慎重使用 二.eval的错误使用方法 •1 如果传入的参数不是字符串,它直接返回这个函数. •2 如果参数是字符串,它会把字符串当成JavaScript代码进行编译,如果编译失败者抛

  • JavaScript学习小结之被嫌弃的eval函数和with语句实例详解

    前面的话 eval和with经常被嫌弃,好像它们的存在就是错误.在CSS中,表格被嫌弃,在网页中只是用表格来展示数据,而不是做布局,都可能被斥为不规范,矫枉过正.那关于eval和with到底是什么情况呢?本文将详细介绍eval()函数和with语句 eval 定义 eval()是一个全局函数,javascript通过eval()来解释运行由javascript源代码组成的字符串 var result = eval('3+2'); console.log(result,typeof result)

  • JavaScript中eval函数的问题

    今天看代码,遇到一个eval函数的问题,到现在翻了很多博文,还是不是很懂eval函数,有个一直没法理解的代码如下: /* var start = [] , end = [] , timings = []; */ function f(){ //模拟程序执行时间 var sum = 0; for(var i =0 ;i < 100000; i++){ sum = sum/(i+1); } } function repeat(n, action){ for(var i=0; i<n ;i++){

  • JavaScript中的eval()函数使用介绍

    在JavaScript中,可以使用eval()函数来解析字符串中的JavaScript代码,并返回相应的代码执行结果: 复制代码 代码如下: console.log(eval("42 * 2"));//84 就本质而言,eval()是JavaScript全局对象的一个函数.比如,上述代码等价于: 复制代码 代码如下: console.log(this.eval("42 * 2"));//84 不过在使用eval()语句时,一般都采用上述第一种做法,也即忽略全局对象直

  • JavaScript中的eval()函数详解

    eval("1+2"),-> 3 动态判断源代码中的字符串是一种很强大的语言特性,几乎没有必要在实际中应用.如果你使用了eval(),你应当仔细考虑是否真的需要使用它. 一.eval()是一个函数还是一个运算符 eval()是一个函数,但由于它已经被当成运算符来对待了..JavaScript语言的早期版本定义了eval函数,现代JavaScript解释器进行了大量的代码分析和优化.而eval的问题在于,用于动态执行的代码通常来讲不能分析,换句话说,如果一个函数调用了eval,那么

  • javascript中Array()数组函数详解

    在程序语言中数组的重要性不言而喻,JavaScript中数组也是最常使用的对象之一,数组是值的有序集合,由于弱类型的原因,JavaScript中数组十分灵活.强大,不像是Java等强类型高级语言数组只能存放同一类型或其子类型元素,JavaScript在同一个数组中可以存放多种类型的元素,而且是长度也是可以动态调整的,可以随着数据增加或减少自动对数组长度做更改. Array()是一个用来构建数组的内建构造器函数.数组主要由如下三种创建方式: array = new Array() array =

  • Javascript中的async函数详解

    Javascript中的async函数详解

    前言:async 是“异步”的简写,async 用于申明一个 function 是异步的,而 await 用于等待一个异步方法执行完成,await 只能出现在 async 函数中. Generator 函数: var fs = require('fs'); var readFile = function (fileName){ return new Promise(function (resolve, reject){ fs.readFile(fileName, function(error,

  • JavaScript中 ES6 generator数据类型详解

    1. generator简介 generator 是ES6引入的新的数据类型, 看上去像一个函数,除了使用return返回, yield可以返回多次. generator 由function* 定义, (注意*号), 2. 示例 函数无法保存状态, 有时需要全局变量来保存数字: 2.1 'use strict'; function next_id(){ var id = 1; while(id<100){ yield id; id++; } return id; } // 测试: var x,

  • javascript 中的继承实例详解

    javascript 中的继承实例详解 阅读目录 原型链继承 借用构造函数 组合继承 寄生组合式继承 后记 继承有两种方式:接口继承和实现继承.接口继承只继承方法签名,而实现继承则继承实际的方法. 由于函数没有签名,在ECMAScript中无法实现接口继承.ECMAScript只支持实现继承,而且实现继承主要依靠原型链来实现. 下面介绍几种js的继承: 原型链继承 原型链继承实现的本质是重写原型对象,代之以一个新类型的实例.代码如下: function SuperType() { this.pr

  • JavaScript中的函数式编程详解

    函数式编程 函数式编程是一种编程范式,是一种构建计算机程序结构和元素的风格,它把计算看作是对数学函数的评估,避免了状态的变化和数据的可变,与函数式编程相对的是命令式编程.我们有这样一个需求,给数组的每个数字加一: // 数组每个数字加一, 命令式编程 let arr = [1, 2, 3, 4]; let newArr = []; for(let i = 0; i < arr.length; i++){ newArr.push(arr[i] + 1); } console.log(newArr)

  • JavaScript中BOM和DOM详解

    目录 BOM(浏览器对象模型) 1. window 获取浏览器c窗口尺寸 2. screen 获取电脑屏幕大小 3. window 开启关闭窗口 4. 浏览器事件 5. location 6. history 7. navigator 获取浏览器相关信息 8. 弹窗 DOM (文档对象模型) DOM 分类 DOM对象 Document文档对象 element文档对象 DOM事件操作 鼠标事件 键盘事件 触屏事件 特殊事件 表单事件 浏览器兼容处理 兼容性写法,封装工具 BOM(浏览器对象模型)

  • JavaScript中深拷贝与浅拷贝详解

    目录 1 浅拷贝概念 2 深拷贝概念 3 浅拷贝的实现方式 3.1 Object.assign() 3.2 Array.prototype.concat() 3.3 Array.prototype.slice() 3.4 直接赋值 4 深拷贝的实现方式 4.1 JSON.parse(JSON.stringify()) 4.2 函数库lodash 总结 1 浅拷贝概念 深拷贝和浅拷贝是只针对Object和Array这样的引用数据类型的. 浅拷贝是创建一个新对象,该对象有着原始对象属性值的一份精确拷

  • vue2.x中h函数(createElement)与vue3中的h函数详解

    目录 1. vue2.x的 h 函数(createElement) 2. vue3 h函数配置项 2.1 v-model实现(以下开始为官网实现) 2.2 v-on 2.3 事件修饰符 2.4 插槽 2.5 component 和 is 2.6 自定义指令 2.7 内置组件 2.8 渲染函数的返回值 2.9 JSX 总结 1. vue2.x的 h 函数(createElement) 使用方法及介绍:(参考官网提取) h函数第一个是标签名字 或者是组件名字,第二个参数是配置项,第三个参数是 inn

  • angularjs中的$eval方法详解

    在controller中定义了一个变量 $scope.a_1 = "abc"; 想在view里面动态输出,因为这个数字是动态的,这么输出肯定是不行的{{'a_' + '1'}},因为输出来的是a_1这个字符串,而不是a_1这个变量的值 想输出a_1这个变量的值,可以使用$eval方法:{{$eval('a_' + '1')}} $eval是作为scope的方法来使用的,在controller中使用的话,是这么使用:$scope.$eval() 以上这篇angularjs中的$eval方

随机推荐