Powerful usage of apply and eval combinations in JavaScript

eval is a function that can accept a parameter that can be interpreted as a JS statement, which, using this feature, combines eval and apply to greatly simplify the code .

The following example

<a class= "click" data-click= "First" >firstClick<a>//Click to execute function firstclick

<a class= "click" data-click= "Second" >secondclick<a>//Click to execute function secondclick

<a class= "click" data-click= "Third" >thirdclick<a>//Click to execute Thirdclick

If you implement the function directly, you need to bind three click, or a variety of judgments, respectively, implemented as follows:

Direct implementation

$ ("[Data-click=first]"). Click (function () () {Firstclick ($ (this). Text ())});

$ ("[Data-click=second]"). Click (function () () {Secondclick ($ (this). Text ())});

$ ("[Data-click=third]"). Click (function () () {Thirdclick ($ (this). Text ())});

var firstclick=function (r) {alert (R)}

var secondclick=function (r) {alert (R)}

var thirdclick=function (r) {alert (R)}

　The direct implementation to bind three times the Click event, bad Maintenance, if the Click event is 10, or more, it would be too scary to write

Judgment Implementation

$ (". Click"). Click (function (r) {

var _click=this.data ("click");

var _text=this.text ();

if (_click== "Firstclick")

{

Firstclick (_text);

}

else if (_click== "Secondclick")

{

Secondclick (_text);

}

Else

{

Thirdclick (_text);

}});

var firstclick=function (r) {alert (R)}

var secondclick=function (r) {alert (R)}

var thirdclick=function (r) {alert (R)}

judge Data-click attributes to achieve, although achieved, but make people feel good nausea, so many times the judgment, more difficult to maintain.

Apply combined with Eval implementation

$ (". Click"). Click (function () {

var _click=$ (this). Data ("click");

var _text=$ (this). text ();

var _func=eval (_click);

_func.apply ($ (this), [_text]);

});

apply in conjunction with Eval implementation:eval directly defines the Data-click value as a function variable, and then the variable to invoke the Apply function is clear and understandable, but this is not absolute, for the students who do not have the knowledge point, It is too painful, because I can not understand, but this is the basic knowledge of JS, but also a very practical knowledge, should be mastered, the following simple introduction of the Eval function and apply function

The Eval function describes:

Definition and Usage

The eval () function computes a string and executes the JavaScript code in it.

Grammar

Eval (String)

The value (if any) that is obtained by calculating the string. return value

The method only accepts the original string as an argument, and if the string parameter is not the original string, the method returns without any change. Therefore, do not pass a String object as a parameter for the eval () function.

If you attempt to override the Eval property or assign the eval () method to another property and call it through the property, the ECMAScript implementation allows a Evalerror exception to be thrown.

Throws an SyntaxError exception if there are no valid expressions and statements in the argument.

If Eval () is called illegally, a Evalerror exception is thrown.

If the Javascript code passed to eval () generates an exception, eval () passes the exception to the caller.

Introduction to the Apply function

　Apply is very powerful, there are many points of knowledge, but I think, very useful things are the following knowledge points

Function.apply (Obj,args) method can receive two parameters
OBJ: This object will replace the This object in the function class
Args: This is an array, which is passed as a parameter to function (args-->arguments)

It is important to note that the args are arrays, but the parameters in function are multiple, and they correspond to args one by one, for example, args=[1,2,3],function is defined as function (x) and the value of X is 1 instead of If the function is defined as function (x, y), then the value of X is 1,y of 2.

 

Powerful usage of apply and eval combinations in JavaScript