Javascript Study Notes 4 Eval Functions

Source: Internet
Author: User

The function of eval is actually very simple. It is to pass a string to the JS interpreter. The Javascript interpreter interprets the string as Javascript code and runs it.
The simplest example is as follows:
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Eval ("alert (1 + 1 )");
</Script>

It is very easy to interpret the string into JS Code and execute it. Pop-up 2.
Of course, the above example is just a toy. In reality, no one will be so stupid. I think the most basic eval functions should be in the DOM. For example, if we have div1, div2, and div3. when getElementByID is used, our ID cannot be obtained. The simplest way is to use eval to concatenate such a program in the for loop. For example:
Copy codeThe Code is as follows:
<Script type = "text/javascript">
For (var loop = 1; loop <10; loop ++ ){
Eval ('document. getElementById ("div" + loop). innerHTML = "123 "');
}
</Script>

After the basic usage is complete, I believe everyone is still interested in this function. If this function only has such usage, it will be too boring. Let's take a look at the eval () function.
Let's start with the eval scope. Let's first look at such a function:
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Eval ("var I = 3 ");
Alert (I );
</Script>

The code is very simple, and 3 is displayed. Next, compare the Code:
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var test = function (){
Eval ("var I = 3 ");
Alert (I );
}
Test ();
Alert (I );
</Script>

The result is 3 first, and then undefined.
Note: The code dynamically executed by the eval () function does not create a new scope, and its code is executed in the current scope. Therefore, the eval () function can use this, argument, and other objects in the current scope.
In IE, a function that is very similar to eval () is supported: execScript (). We can write simple code.
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var test = function (){
ExecScript ("var I = 3 ");
Alert (I );
}
Test ();
Alert (I );
</Script>

The result shows 2 3 s, which shows the features of the execScript function. First, it is similar to eval and can interpret the string as JS Code and execute it, however, its scope is not the current scope, but the global scope. When we put the above Code on Firefox and Google browsers and try: the code on execScript on Firefox is invalid, it also indicates a problem, the browser compatibility of execScript code is problematic.
So how can we summarize the "advantages" of these two functions, that is, global + browser compatibility. I searched the internet and gave a summary, probably like this:
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var StrongEval = function (code ){
If (window. navigator. userAgent. indexOf ("MSIE")> = 1 ){
ExecScript (code );
}
If (window. navigator. userAgent. indexOf ("Firefox")> = 1 ){
Window. eval (code );
}
Else {
ExecScript (code );
}
};
Var Test = function (){
StrongEval ("var I = 3 ");
}
Test ();
Alert (I );
</Script>

In this way, we can be perfectly compatible with FF and IE. The essential code is that eval and window. eval are not equivalent in FF, which is a wonderful thing.
In addition, we can also use eval + with to implement some odd sex techniques.
In general, we can write such code:
Copy codeThe Code is as follows:
Var obj = function (){
This. a = 1;
This. B = 2;
This. c = 5;
This. fun = function (){
This. c = this. a + this. B;
}
};
Var o = new obj ();
O. fun ();
Alert (o. c );

Or:
Copy codeThe Code is as follows:
Var obj = {
A: 1,
B: 2,
C: 5,
Fun: function (){
This. c = this. a + this. B;
}
}

Or the following code is used:
Copy codeThe Code is as follows:
Var obj = function (){
This. a = 1;
This. B = 2;
This. c = 5;
};
Obj. prototype. fun = function (){
This. c = this. a + this. B;
}
Var o = new obj ();
O. fun ();
Alert (o. c );

In any case, are you bored with this? Let's take a very different approach, so that at least we may feel a little more comfortable.
Copy codeThe Code is as follows:
<Script type = "text/javascript">
Var funtemp = function (){
C = a + B;
}
Var obj = {
A: 1,
B: 2,
C: 5
};
Var fun;
With (obj ){
Eval ("fun =" + funtemp );
}
Fun ();
Alert (obj. c );
</Script>

This is tough, so well, we don't discuss what looks uncomfortable. Let's discuss this situation.
Copy codeThe Code is as follows:
<Script>
Var DBCommon = function (){
Alert ("1."); CreateConnection ();
Alert ("2."); OpenConnection ();
Alert ("3."); CreateCommand ();
Alert ("4."); ExcuteCommand ();
Alert ("5."); CloseConnection ();
}
Var SQLServerCommon = {
CreateConnection: function () {alert ("Creating an SQL Server connection ");},
OpenConnection: function () {alert ("enable SQL Server connection ");},
CreateCommand: function () {alert ("¨ SQL ");},
ExcuteCommand: function () {alert ("execute DSQL Server command ");},
CloseConnection: function () {alert (" ");}
};
Var OracleCommon = {
CreateConnection: function () {alert ("Creating an Oracle connection ");},
OpenConnection: function () {alert ("Open aOracle connection ");},
CreateCommand: function () {alert ("¨ Oracle command ");},
ExcuteCommand: function () {alert ("execute DOracle command ");},
CloseConnection: function () {alert ("close? Oracle connection ");}
};
With (SQLServerCommon ){
Eval ("forSQLServer =" + DBCommon );
}
With (OracleCommon ){
Eval ("forOracle =" + DBCommon );
}
ForSQLServer ();
ForOracle ();
</Script>

Can we regard this as a simple template method mode? Haha. We can also call this to change the context of a function by using eval and.
However, Eval is rarely used in general cases and we can avoid using it.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.