ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptでのevalの使い方を詳しく解説

JavaScriptでのevalの使い方を詳しく解説

黄舟
黄舟オリジナル
2017-11-23 11:00:081920ブラウズ

日々の開発作業の中で、JavaScript での eval の使用法に慣れている人は多いと思いますが、JavaScript を初めて使用する人にとっては、eval の使用法は少し馴染みのないものです。今日は詳しく説明します。 JavaScriptでのevalの使い方を解説!

eval 関数はパラメータ s を受け取ります。s が string でない場合は、s を直接返します。それ以外の場合は、s ステートメントを実行します。 s ステートメントの実行結果が値の場合はその値が返され、それ以外の場合は未定義が返されます。
オブジェクト宣言構文 "{}" は値を返すことができないことに注意してください。値を返すには括弧で囲む必要があります。 簡単な例は次のとおりです。

コードは次のとおりです。

ご覧のとおり、オブジェクト宣言ステートメントの場合、つまり、実行されるだけで値を返すことはできません。一般的に使用される「{}」オブジェクト宣言ステートメントを返すには、値を返す前にステートメントをかっこで囲んで式に変換する必要があります。これは、Ajax 開発で JSON を使用する基本原則の 1 つでもあります。この例では、2 番目のアラート ステートメントは未定義を出力し、括弧を追加した後の 3 番目のアラート ステートメントはステートメントで表されるオブジェクトを出力することが明確にわかります。

次に、この記事の焦点である関数内でグローバル コードを実行する方法について説明します。この問題を説明するために、まず例を見てみましょう:

コードは次のとおりです:

var code1='"a" + 2'; //表达式 
varcode2='{a:2}'; //语句 
alert(eval(code1)); //->'a2' 
alert(eval(code2)); //->undefined 
alert(eval('(' + code2 + ')')); //->[object Object]

上記のデモ 1 関数は次の関数と同等です: function Demon1(){var s='local';} 、ローカル変数 s を定義します。

結局のところ、最終出力がグローバルであることは驚くべきことではありません。ローカル変数とグローバル変数は誰でも明確に区別できます。
注意深く体験すると、 eval 関数の特徴がわかります。これは、変数定義であっても呼び出されたコンテキスト変数空間 (パッケージ、クロージャーとも呼ばれます) で常に実行されます。未定義関数のエラーが発生します:

コードは次のとおりです:

var s='global'; //定义一个全局变量 
function demo1(){ 
eval('var s="local"'); 
} 
demo1(); 
alert(s); //->global

これは、テスト関数がローカル空間で定義されており、demo2 関数内でアクセスできるが、アクセスできないためです。外部からアクセスできるようになります。実際の Ajax 開発では、一度に大量のコードをロードする問題を軽減するために、実行するコードをサーバーから動的に取得する必要がある場合や、一部のコードは Javascript 自体によって生成され、それを実行するために eval 関数を使用したい場合があります。

しかし、コードを動的に取得するこのような作業は通常、関数内で完了します。例:


コードは次のとおりです:

var s='function test(){return 1;}'; //一个函数定义语句 
function demo2(){ 
eval(s); 
} 
demo2(); 
alert(test()); //->error:test is not defined

eval はグローバル空間では実行できないことがわかり、開発に多くの問題をもたらします。 . こちらも参照 このことで落ち込んでいる人は少なくありません。

しかし、ついに解決策を見つけました。へー、それは IE と Firefox の両方と互換性があります:



コードは次のとおりです:

function loadCode(){ 
varcode=getCode(); 
eval(code); 
}

さて、関数内でグローバル コードを定義したい場合は、 X2.eval_r( code) メソッドを呼び出すことができます。例は次のとおりです。


コードは次のとおりです。

var X2={} //my namespace:) 
X2.Eval=function(code){ 
if(!!(window.attachEvent && !window.opera)){ 
//ie 
execScript(code); 
}else{ 
//not ie 
window.eval(code); 
} 
}

グローバル変数 s="local" が、demo3 関数で再定義されていることがわかります。

X2.Eval は値を返さないことに注意してください。式を評価したい場合は、システムの eval 関数を使用する必要があります。 X2.Eval は、グローバル コード定義のみに使用されるように設計されています。

実際、これを見ると、問題を解決するのが簡単すぎると感じる人もいるかもしれません(笑)、しかし、この方法を見つけるには、ある程度の運とスキルが必要です:
(1)
IE ブラウザ
の場合、そのような機能はすでに提供されています。デフォルト: execScript はグローバル空間でコードを実行するために使用されますが、それについて知っている人は多くありません。 (2) Firefox ブラウザの場合、eval 関数が直接呼び出された場合は呼び出し元の空間で実行され、window.eval が呼び出された場合はグローバル空間で実行されます。おそらくこれを知っている人はさらに少ないでしょう。結局のところ、alert(eval==window.eval) は true を返します。 Firefox の eval 関数の特性は確かに非常に奇妙ですが、そのソースは JavaScript 仕様にも記載されています:

var s='global'; 
function demo3(){ 
X2.Eval('var s="local"'); 
} 
demo3(); 
alert(s); //->'local'

これはおそらく、eval 関数の実行が呼び出し元に関連していることを意味しますが、問題については記載されていません実行コンテキストとともに。したがって、IE と Firefox のどちらが正しいか間違っているかを言うのは難しいのですが、誰もが解決策を知っているのは良いことです。


概要: この記事では、JavaScript での eval の使用法を具体的な例を通して説明します。これがあなたの仕事に役立つことを願っています。 !

関連する推奨事項:

JavaScript での eval() 関数の戻り値と変数環境の使用例の詳細な説明

eval() の役割とスコープの簡単な説明

JavaScript が eval() 関数を使用して JavaScript 文字列インスタンスを計算する方法の詳細な説明

以上がJavaScriptでのevalの使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。