【入門編】 eval関数がスコープに与える影響 – JavaScript実践ガイド

こんにちは。フロントエンドの現場で長年コードと向き合ってきた「おじさん」こと、チーフアーキテクトです。

JavaScriptを学び始めると、必ず一度は「魔法のような関数」に出会うはずです。それが今回取り上げる`eval`関数。文字列をそのままコードとして実行してくれる、一見すると非常に便利で強力なツールです。

しかし、この`eval`は、いわば「見知らぬ人を自分の部屋に招き入れる」ような危うさを持っています。今日は、なぜ現場のエンジニアが「`eval`を使うな」と口を酸っぱくして言うのか、それが私たちのプログラムの「スコープ（部屋のルール）」をどう乱すのか、優しく解き明かしていきますね。

—

そもそも「スコープ」って何だろう？

プログラムにおけるスコープとは、簡単に言えば「変数が生きている部屋」のことです。

例えば、あなたの家のリビングにある「リモコン」は、リビングの中では自由に使えますよね。でも、お隣さんの家からは見えません。これがスコープです。JavaScriptでは、`let`や`const`で変数を定義すると、その変数を作った「ブロック（`{ }`）」という部屋の中にだけ存在が許されます。

{
const mySecret = “内緒の話”;
console.log(mySecret); // ここなら聞こえるよ！
}

// console.log(mySecret); // エラー！壁の外からは見えません

この「壁」のおかげで、私たちは変数名が衝突する心配をせずに安心してコードが書けるんです。

—

招かれざる客「eval」の登場

では、ここに`eval`を投入してみましょう。`eval`は、文字列をコードとして解釈して実行する機能です。

const name = “メインの住人”;

// evalは文字列をプログラムとして実行する魔法の箱
eval(“var name = ‘侵入者です！'”);

console.log(name); // 結果は「侵入者です！」になってしまう

見てください。本来、`name`という変数は「メインの住人」という名前を守っていたはずなのに、`eval`がやってきた瞬間に、勝手に中身を書き換えてしまいました。

まるで、誰かが勝手にあなたの部屋に上がり込んで、家具の配置を勝手に変えて帰っていったようなものです。これでは、プログラムの挙動が予測不能になってしまいますよね。「さっきまであそこに置いてあったはずのものが消えた！？」なんてことが起きたら、バグを追いかけるのは至難の業です。

—

「厳格モード（strict mode）」という守護神

そんな恐ろしい`eval`ですが、JavaScriptにはこれを食い止めるための「厳格モード（`”use strict”;`）」という強力な盾が用意されています。

これをファイルの先頭に一行書くだけで、JavaScriptはとても真面目で厳格な性格になります。

“use strict”; // これを書くだけで、JavaScriptの先生が厳しく見守ってくれます

function myRoom() {
const localVariable = “私の宝物”;

// 厳格モードだと、evalの中で変数を作っても外には漏れません！
eval(“var localVariable = ‘悪い魔法使い'”);

console.log(localVariable); // 「私の宝物」のまま。守られました！
}

myRoom();

厳格モードを使うと、`eval`が勝手に部屋の外（親のスコープ）を汚染することを防いでくれます。現代のフロントエンド開発では、`”use strict”;`を記述することは、もはや「基本の礼儀」とも言える大切な習慣なんです。

—

最後に：なぜ使ってはいけないのか

ここまで読んで「なるほど、厳格モードを使えば安全なんだね！」と思ったかもしれません。でも、ベテランのエンジニアが`eval`を避ける理由は、スコープの汚染だけではありません。

1. 実行速度が極端に遅くなる: JavaScriptのエンジン（ブラウザの心臓部）は、コードを事前に解析して最適化します。しかし、`eval`の中身は実行するまで誰にも分からないので、エンジンが最適化を諦めてしまい、アプリが重くなります。
2. セキュリティのリスク: もし、Webサイトの入力フォームに悪意のあるユーザーが`eval`を動かすようなコードを書き込んだら…あなたのサイトが乗っ取られる危険性があります。

まとめると…

`eval`は、変数という「部屋の壁」を突き破って中身を書き換えてしまう厄介者です。
`”use strict”;`を使うと、その汚染被害を最小限に抑えることができます。
でも、基本は「使わない」のが一番の正解です。

プログラミングの世界には、もっと安全で便利な代替手段がたくさんあります。もし「どうしても動的にコードを変えたい！」という場面に出会ったら、一度立ち止まって「本当に`eval`以外に方法はないかな？」と自問自答してみてください。

大丈夫、最初はみんな遠回りするものです。一つずつ、こうやって安全なコードの書き方を覚えていけば、あなたの書くプログラムは必ずもっと素敵で堅牢なものになりますよ。

また何か分からないことがあったら、いつでも聞いてくださいね。応援しています！