Firefoxの新しいシンプルなJavaScriptエディター

スクラッチパッドの紹介



リリースされたばかりのFirefox 6には、Web開発者向けの新しいツールが含まれています。シンプルなJavaScriptエディター(メモトランスレーター-英語ではScratchpad(「ノートパッド」)と呼ばれます。 。)考え方は簡単です。ブラウザはJavaScriptを試すのに最適な場所です。 ほとんどのJS開発者はすでにこれを知っており、WebコンソールやFirebugコマンドラインなどのツールを使用して、Webページの外観を正確に把握している単一の環境を利用します。



Webコンソールは、一度に1行のコードを入力するように最適化されています(ヒント:Shift + Enterで複数行を入力できます)。 Firebugには、複数行の入力モードを有効にするボタンがありますが、操作はすべてコードの交互実行と線形実行に基づいています。



これはスクラッチパッドには適用されません。 彼は「入力ライン-出力ライン」アプローチを完全に拒否します。 これは、JavaScriptを実行できる単なるテキストエディターです。



スクラッチパッドを使用する



スクラッチパッドは、Web開発メニューにあります。 このメニューで[Simple JavaScript Editor]を選択すると、テキストエディターウィンドウが表示されます。 起動すると、使用のプロンプトが表示されます。



どこで作業するのも簡単です:

  1. コードを入力してください
  2. その一部を選択してください
  3. コンテキストメニューまたは[実行]メニューで3つのコマンドのいずれかを選択します。

    • 走る
    • 探検する
    • ディスプレイ


    もちろん、それらにアクセラレータがあり、マウスに手を伸ばす必要はありません。




実行は、選択したコードを実行するだけです。 このコマンドを使用して、関数を定義したり、ページを制御するコードを実行したりできます。



「Explore」はコードを実行し、返された値でオブジェクトインスペクターを開きます。



最後に、「表示」はコード実行の結果をエディターに表示します。 このコマンドを使用すると、エディターを電卓に変えることができます。 ただし、ページの正しい動作を確認するときに結果を追跡するために使用するとより便利です。



ちなみに、Scratchpadのアイデアの多くはSmalltalk環境からのものです。 30年が過ぎましたが、私たちはまだ彼に追いついています:)



Scratchpadが何であるかを自分で理解するには、実際の動作を確認する必要があります。 自分で実行するか、 Rob Campbellのビデオをご覧ください。

スクラッチパッドで新しいコードを書く



スクラッチパッドは、コードを動作するはずの場所(ブラウザー内)で試す非常に便利な方法です。 誤った結果を与える何らかの種類の関数があるとします。 ページをダウンロードし、関数コードをエディターにコピーし、それを呼び出すコードを数行追加します。 関数を少し変更してコードを再起動することにすぐに慣れます。 最終的に目的の結果が得られたら、関数をエディターから定義されているファイルにコピーします。 そして、これらすべては、単一のページのリロードなしでデバッグできます!

コードフラグメントの使用



Scratchpadは、JavaScriptコードでファイルをロードし、そのコンテンツを保存できます。 これにより、頻繁に使用する機能のセットを保存できます。 たとえば、サイトでAJAXを使用してさまざまなデータをロードする場合、そのような呼び出しをすべて1つのファイルに保存すると、サイトでの作業中にいつでもこのデータを取得できます。

スコープについて



Webコンソールと同様に、Scratchpadのコードはページ上のすべての変数を参照しますが、Scratchpadで定義された変数はページで使用できません。 ページのJavaScriptコードに表示される変数(たとえば、 foo



)を定義する場合は、それをwindow



window.foo = 1



オブジェクトに割り当てることができます。



ただし、Webコンソールとは異なり、タブを切り替えるときにScratchpadの内容が保存され、現在開いているページで実行中のコードが常に実行されます。 これにより、たとえば、開発サーバーとデバッグサーバーでコードが等しく機能することを確認できます。



最後に、Firefox自体またはその拡張機能で作業している場合は、Scratchpadにブラウザ内部へのアクセスを許可できます。 これを行うには、 about:config



devtools.chrome.enabled



設定をtrueにし、エディターの「環境」を「コンテンツ」から「ブラウザー」に変更します。 ただし、ブラウザがモチベーションをGoogle+に送信し始めるコードを入力した場合、それは私のせいではありません!

今後の計画



スクラッチパッドはシンプルであり、それを維持したいです。 Firefoxの次のバージョンに現れるいくつかの改善を計画していますが、その本質-「JavaScriptを実行できるテキストエディター」は変更されません。



Scratchpadに関するフィードバックをお待ちしています! dev-apps-firefoxメーリングリスト (英語の翻訳者のメモ)にあなたの考えを書いてください。 または、作業に参加して、 Scratchpadおよびその他の開発者ツールをさらに改善してください。



追加:Firefox 8では、Scratchpad用の Orionエディターを使用する予定です。これにより、構文が強調表示されます(ただし、デフォルトでは無効になります)。 devtools.editor.component



"orion"



設定することで有効にできます。



All Articles