转发请标明来源:http://www.cnblogs.com/johnhou/p/javascript.html  请尊重笔者的劳动成果  --John Hou

在javascript中有多种方法可以让一段字符串当做一段js代码来执行:

  1. 使用eval("要执行的字符串")
  2. 使用new Function("要执行的字符串")
  3. setTimeOut("要执行的字符串",500)
  4. setInterval("要执行的字符串",500)

当然根据javascript最佳实践,我们是不推荐上面的任何一种方式的,当然eval()在处理JSON串时还是必须使用的,但是最佳实践禁止使用new Function构造函数来创建函数,而且禁止给setTimeout()和setInterval()方法传递字符串,应该传递函数名。

一、eval和new Function()的区别:

console.log("执行Function");

var val = new Function("console.log('houquan')");

console.log(typeof val);

console.log(val);

val();//如果不调用,那么就永远也不会输出“houquan”

/**

通过new Function("...")执行返回的结果是一个名为anonymous的函数,函数体就是传到new Function()中的字符串。

anonymous的中卫意思是:匿名的

*/

val = new Function("(function(){console.log('test');})()");

console.log(typeof val);

console.log(val);

val();

new Function("alert('test1')");

eval("alert('test2')");

/**

new Function()和eval()的区别是,前者把传入的字符串封装为一个function对象

的语句返回,直到调用这个返回的函数时,才会执行字符串所要执行的操作;后者则是

直接把字符串当做js代码执行,返回的结果是一个Object对象。

*/

console.log("执行eval");

val = eval("console.log('houding')");

console.log(typeof val);

console.log(val);

/**

eval的执行结果在FireFox下是一个对象,在IE8中不返回结果

该对象在FireFox中的结构如下:

*/

执行结果:

FireFox下的执行结果

IE8下的执行结果:

二、使用eval的注意事项:

console.log("第一个执行");

try{

eval("function(){console.log('error');}");

}catch(e){

console.log("error1");

console.log(e.toString());

}

/**上面代码执行的结果就类似于在全局作用域中定义一个匿名函数是一个道理,

果断报错,这就相当于给全局对象window,添加一个匿名的属性,或者方法一

样,显然是无法做到的!

*/

console.log("第二个执行");

try{

eval("(function(){console.log('right')})()");

}catch(e){

console.log("error2");

console.log(e.toString());

}

/**

上面的代码就相当于执行一个即时函数一样

*/

console.log("第三个执行");

try{

eval("function test(){console.log('test');}");

test();

}catch(e){

console.log("error3");

console.log(e.toString());

}

/**

上面的代码相当于定义一个函数

*/

执行结果:

eval 执行创建对象字面量注意事项

console.log("错误的创建对象字面量的情况");

try{

eval("{name:'houquan'}");

}catch(e){

console.log("error");

console.log(e.toString());

}

/**

上面的代码等同于下面的代码

*/

name:"houquan";

console.log("正确的创建对象字面量的情况");

try{

eval("({name:'houquna'})");

}catch(e){

console.log("error0");

console.log(e.toString());

}

/**

上面第一段代码中javascript引擎把{}中档次代码块来执行,所以不会返回

预期的对象

应该把对象字面量的创建语句用()括起来,当成一个表达式来执行,这样

就能得到正确的结果了。

*/

执行结果:

单独执行

try{

eval("{name:'houquan'}");

}catch(e){

console.log("error");

console.log(e.toString());

}

执行结果:

以下是我的微信公众号,技术大牛集结号,欢迎您的关注!

给我足够的时间,我能模拟整个世界!

javascript系列1--把字符串当代码来执行的更多相关文章

  1. 深入理解JavaScript系列(46):代码复用模式(推荐篇)

    介绍 本文介绍的四种代码复用模式都是最佳实践,推荐大家在编程的过程中使用. 模式1:原型继承 原型继承是让父对象作为子对象的原型,从而达到继承的目的: function object(o) { fun ...

  2. 深入理解JavaScript系列(45):代码复用模式(避免篇)

    介绍 任何编程都提出代码复用,否则话每次开发一个新程序或者写一个新功能都要全新编写的话,那就歇菜了,但是代码复用也是有好要坏,接下来的两篇文章我们将针对代码复用来进行讨论,第一篇文避免篇,指的是要尽量 ...

  3. 研磨JavaScript系列(四):代码的时空

    对于过程式编程来说,代码执行的时间与数据标识的空间是密不可分的.我们只有把指令执行的具体时刻与标识映射的具体地址结合起来,才能确定程序在执行瞬间的上下文状态.于是,代码时刻与数据标识的结构,就形成了作 ...

  4. 深入理解JavaScript系列

    转自http://www.cnblogs.com/TomXu/archive/2011/12/15/2288411.html 深入理解JavaScript系列(1):编写高质量JavaScript代码 ...

  5. 深入理解JavaScript系列(转自汤姆大叔)

    深入理解JavaScript系列文章,包括了原创,翻译,转载,整理等各类型文章,如果对你有用,请推荐支持一把,给大叔写作的动力. 深入理解JavaScript系列(1):编写高质量JavaScript ...

  6. [转]深入理解JavaScript系列

    文章转自:汤姆大叔-深入理解JavaScript系列文章 深入理解JavaScript系列文章,包括了原创,翻译,转载,整理等各类型文章,如果对你有用,请推荐支持一把,给大叔写作的动力. 深入理解Ja ...

  7. [转载]深入理解JavaScript系列 --汤姆大叔

    深入理解JavaScript系列文章,包括了原创,翻译,转载,整理等各类型文章,如果对你有用,请推荐支持一把,给大叔写作的动力. 深入理解JavaScript系列(1):编写高质量JavaScript ...

  8. 深入理解JavaScript系列(转载)

    深入理解JavaScript系列 深入理解JavaScript系列(1):编写高质量JavaScript代码的基本要点 深入理解JavaScript系列(2):揭秘命名函数表达式 深入理解JavaSc ...

  9. 研磨JavaScript系列

    JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言.同时也是一种广泛用于客户端Web开发的脚本语言,常用来给HTML网页添加动态功能,比如响应用户的各种操作.它最初由网景公司 ...

随机推荐

  1. Linux文件与目录管理 - ls, cp, mv

    [root@www ~]# ls [-aAdfFhilnrRSt] 目录名称 [root@www ~]# ls [--color={never,auto,always}] 目录名称 [root@www ...

  2. C语言实现字符串中(10进制和16进制)转成十进制数

    如何将字符串中的10进制数和16进制数提取出来,看以下代码: #include <stdio.h> typedef char TUINT8 ; typedef int TUINT32; T ...

  3. VS Code python初体验笔记

    之前一直都是使用Notepad++来编写Python代码,后来想起来之前查资料的时候有个VS Code可以编写一些的脚本语言(js,node.js)甚至是高级编程语言(C#,PHP,JAVA,Pyth ...

  4. pandas数据处理基础——筛选指定行或者指定列的数据

    pandas主要的两个数据结构是:series(相当于一行或一列数据机构)和DataFrame(相当于多行多列的一个表格数据机构). 本文为了方便理解会与excel或者sql操作行或列来进行联想类比 ...

  5. Day7 小练习(统计初始化数据的次数和对象之间的交互)

    写一个小练习,定义好一个类,每初始化一次,计数器+1,统计最后次数. class OldboyStudent: school = 'oldboy' count= def __init__(self,n ...

  6. Entity Framework分页扩展

    Entity Framework分页在我初入门时总是困扰这我,无论是SQL分页还是Entity Framework的分页,总是显得那么麻烦,因此对于Entity Framework单独封装了分页. 一 ...

  7. C语言实现输出一组数字中的所有奇数

    /*第二题*/ #include<stdio.h> //输入186732468 //输出173 //输入12345677 //输出13577 main(){ ;//输入的数字,数字的长度 ...

  8. 基于puppeteer模拟登录抓取页面

    关于热图 在网站分析行业中,网站热图能够很好的反应用户在网站的操作行为,具体分析用户的喜好,对网站进行针对性的优化,一个热图的例子(来源于ptengine) 上图中能很清晰的看到用户关注点在那,我们不 ...

  9. href="#" 是什么意思?

    <a href="#" onclick="process1()">开始你表演</a>作用:书签的另一种用法建立书签语法:<a na ...

  10. C#学习笔记 day_three

    C#学习笔记 day three Chapter 3 类型 3.3引用类型 引用类型的变量也成为对象,有六种类型:(1)对象类型 (2)字符串类型 (3)类类型 (4)数组类型 (5)接口类型 (6) ...