Javascript study notes 4 Eval function_basic knowledge

The function of eval is actually very simple. It is to pass a string to the JS interpreter, and the Javascript interpreter will interpret the string into Javascript code and execute it.
The simplest example:

Copy code The code is as follows:

< script type="text/javascript">
eval("alert(1 1)");

Very simple, interpret the string into JS The code is executed and 2 pops up.
Of course, the above example is just a toy, and no one would be stupid enough to use it in reality. I think the most basic way to use the eval function is in the DOM. For example, if we have div1, div2, and div3, then there is no way to get our ID when using document.getElementByID. So the simplest way is to use it in a for loop. Use eval to splice such a program. For example:

Copy code The code is as follows:

After talking about the most basic usage, I believe everyone is still interested in this function. If this function only has so many uses, it would be too boring. Then let's take a look at the eval() function bit by bit.
Let’s start with the scope of eval and look at this function:

Copy code The code is as follows:

The code is very simple and the result can pop up 3. Next, compare this code:

Copy code The code is as follows:

The result is that 3 pops up first, then undefined.
Then explain: the code dynamically executed by the eval() function does not create a new scope, and its code is executed in the current scope. So in other words, the eval() function can also use this, argument and other objects in the current scope.
In IE, a function very similar to eval() is supported called: execScript(). We can write a simple code.

Copy code The code is as follows:

The result is that two 3s pop up, which also shows the characteristics of the execScript function. First of all, it is similar to eval and can interpret strings into JS The code is executed, but its scope is not the current scope, but the global scope. When we put the above code into Firefox and Google Chrome and try it: we find that the code on execScript is invalid on Firefox, which also illustrates a problem. There is a problem with the browser compatibility of the execScript code.
Then this leads to the question, how can we bring together the "advantages" of these two functions, that is, global browser compatibility. I searched online and summarized it myself. It looks like this:

Copy the code The code is as follows:

This can be perfectly compatible with FF and IE. The essential code is that eval and window.eval are not equivalent in FF. This is a very strange thing.
In addition, we can also use eval with to achieve some weird tricks.
We can write code like this in a general sense:

Copy code The 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 like this:

Copy the code The code is as follows:

var obj = {
a: 1,
b: 2,
c: 5,
fun: function () {
this.c = this.a this.b;
}
}

Or this:

Copy code The 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);

No matter what, are you tired of this? Then let us take a very different approach, so that it may be more comfortable for the senses at least.

Copy code The code is as follows:

This is very forced, so good, we are not going to discuss whether it looks comfortable or not. Let's discuss such a situation.

Copy code The code is as follows:

<script> <br>var DBCommon = function ( ) { <br>alert("1."); CreateConnection(); <br>alert("2."); OpenConnection(); <br>alert("3."); CreateCommand(); <br> alert("4."); ExcuteCommand(); <br>alert("5."); CloseConnection(); <br>} <br>var SQLServerCommon = { <br>CreateConnection: function () { alert(" Establish a SQL Server connection"); }, <br>OpenConnection: function () { alert("Open a SQL Server connection"); }, <br>CreateCommand: function () { alert("Create a SQL Server command"); }, <br>ExcuteCommand: function () { alert("Execute DSQL Server command"); }, <br>CloseConnection: function () { alert("Close SQL Server connection"); } <br>}; <br>var OracleCommon = { <br>CreateConnection: function () { alert("Establish an Oracle connection"); }, <br>OpenConnection: function () { alert("Open an Oracle connection"); }, <br>CreateCommand : function () { alert("Create ¨Oracle command"); }, <br>ExcuteCommand: function () { alert("Execute DOracle command"); }, <br>CloseConnection: function () { alert("Close ?Oracle connection"); } <br>}; <br>with (SQLServerCommon) { <br>eval("forSQLServer=" DBCommon); <br>} <br>with (OracleCommon) { <br>eval(" forOracle=" DBCommon); <br>} <br>forSQLServer(); <br>forOracle(); <br></script>

Can we think of this as What about a crude template method pattern? hehe. We can also call this using eval and with to change the context of the function.
But then again, Eval is rarely used in general situations, and we can completely avoid using it.