[解決済み] JavaScriptの "new "キーワードは有害とみなされるか?
質問
その他に
質問
について、ユーザーから指摘がありました。
new
キーワードの使用は危険であるとし、オブジェクトの作成において
new
. PrototypeやScriptaculous、その他の優れたJavaScriptライブラリを使っていて、そのどれもが
new
というキーワードがあります。
にもかかわらず、昨日、YUIシアターでDouglas Crockfordのトークを見ていたら、全く同じことを言った。
new
キーワードを使用するようになりました。
クロックフォード・オン・JavaScript - 第三幕: 究極の関数 - 50分23秒
).
を使うのは「悪いこと」なのでしょうか?
new
というキーワードがあります。また、使用するメリットとデメリットは何ですか?
どのように解決するのですか?
クロックフォードは、優れたJavaScriptのテクニックを普及させるために多くの貢献をしてきました。言語の重要な要素に対する彼の意見的なスタンスは、多くの有益な議論を巻き起こしてきました。とはいえ、「悪い」「有害」という言葉を福音として受け止め、一人の人間の意見以上のものを見ようとしない人があまりにも多いのも事実です。ちょっと悔しいです。
が提供する機能を利用する。
new
キーワードは、各オブジェクトをゼロから構築するよりもいくつかの利点があります。
-
プロトタイプの継承
. クラスベースの OO 言語に慣れた人たちからは疑惑と嘲笑が混じった目で見られがちですが、JavaScript のネイティブ継承はシンプルかつ驚くほど効果的にコードを再利用するための手段です。また
new
キーワードは、このキーワードを使用するための標準的な(そして唯一クロスプラットフォームで利用可能な)手段です。 -
パフォーマンス。これは1の副作用です:もし私が作るすべてのオブジェクトに10のメソッドを追加したい場合、私は
できる
新しいオブジェクトに各メソッドを手動で割り当てる作成関数を書けばよいのです。あるいは、作成関数の
prototype
を使用しnew
で新しいオブジェクトのスタンプを押すことができます。これは高速なだけでなく(プロトタイプの各メソッドに必要なコードがない)、各メソッドに個別のプロパティを設定してオブジェクトを膨らませることも避けることができます。遅いマシン(特にJSインタプリタ)では、多くのオブジェクトを作成する場合、これは時間とメモリの大幅な節約を意味します。
そうそう。
new
使い方を忘れると、警告なしにコードが壊れてしまうのです。幸いなことに、この欠点は簡単に緩和されます - 関数自体にちょっとしたコードを追加するだけです。
function foo()
{
// if user accidentally omits the new keyword, this will
// silently correct the problem...
if ( !(this instanceof foo) )
return new foo();
// constructor logic follows...
}
の長所を生かすことができるようになりました。
new
が、誤って使用した場合の問題を心配する必要はありません。壊れたコードが黙って動くことが気になるなら、チェックにアサーションを追加することもできます。あるいは
いくつかの
というコメントがありますが、このチェックを使って実行時例外を発生させることができます。
if ( !(this instanceof arguments.callee) )
throw new Error("Constructor called as a function");
(このスニペットでは、前の例と違って実際にオブジェクトをインスタンス化する必要がないため、コンストラクタ関数名のハードコーディングが不要です。したがって、そのままターゲット関数にコピーすることができます)
John Resigは、このテクニックについて彼の
シンプルなquot;クラス"インスタンス化
の投稿で、この動作をデフォルトで "クラス" に組み込む方法が紹介されています。近々出版される彼の本と同様、一読の価値があります。
ジャバスクリプト忍者の秘密
この他にも、JavaScript言語の多くの有害な機能の中に隠された金脈を発見することができます(
章
について
with
は、当初この評判の悪い機能をギミックと見なしていた私たちにとって、特に啓発的なものです)。
関連
-
vueにおけるfilterの適用シーンについて解説します。
-
Vueのイベント処理とイベントモディファイアの解説
-
Vueの「データを聴く」原則を解説
-
[解決済み] テスト
-
[解決済み] URLを新しいタブで開く(新しいウィンドウではない)
-
[解決済み] JavaScriptで配列の先頭に新しい配列要素を追加するにはどうすればよいですか?
-
[解決済み] JavaScriptの「new」キーワードとは何ですか?
-
[解決済み] varキーワードの目的と、どのような場合に使用する(または省略する)べきですか?
-
[解決済み] JavaScriptで、数値が精度を失うことなく到達できる最も高い整数値は何ですか?
-
[解決済み】プロトタイプベース継承とクラスベース継承の比較
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
Vueの要素ツリーコントロールに破線を追加する説明
-
JSアレイループと効率解析の比較
-
Vueにシンプルなメモ帳機能を実装
-
Vueの「データを聴く」原則を解説
-
[解決済み】ExpressJS : res.redirect()が期待通りに動かない?
-
JSクリックイベント - Uncaught TypeError: プロパティ 'onclick' に null を設定できません。
-
[解決済み] JavaScriptで "use strict "は何をするのか、その根拠は?
-
[解決済み] JavaScriptの「new」キーワードとは何ですか?
-
[解決済み】Javascriptがプロトタイプベースの言語であるというのはどういう意味ですか?
-
[解決済み】JavaScriptのeval()が悪でないのはどんなとき?