JavaScript 演算子の優先順位の詳細な分析 (例付き)

不言
リリース: 2018-11-26 15:40:39
転載
2120 人が閲覧しました

この記事では、JavaScript 演算子の優先順位について詳しく説明します (例を示します)。必要な方は参考にしてください。

JavaScript を 2 年間書いてきたので、構文の罠に陥ることはないだろうと思っていましたが、実際には顔を平手打ちされました。最近、製品開発チームのイケメン男性から相談を受けました。問題です。誰でも読みやすくするために、この問題のモデルを抽象化しました。

var provider = {
    test: {
        $get: function(){
            return function anonymous(config){
            };
        }
    }
};
var type = "test";
var config = {};
new provider[type].$get()(config);
ログイン後にコピー

なぜ this が関数 anonymous にあるのか。上記のステートメントを実行すると、new によって作成された新しいオブジェクトの代わりに ##window をポイントします。この質問を聞いて最初に思ったのは、「ナニ! new 演算子に対応するコンストラクター内の this が新しく作成されたオブジェクト インスタンスを指していないということがあり得るのですか?」ということでした。 ?その時は、ビジネスから問題をうまく抽象化しなかったので、実際には少し混乱しました。しかし、よく考えてみると、この文章は一体何を表現しているのでしょうか?

#思考

この式の意味について説明する前に、新しい演算子についていくつか説明させてください:

#コンストラクターの戻り値

JavaScript コンストラクターは、値を返すことも、返さないこともできます。例:

function Person(){

}
var person = new Person()
ログイン後にコピー
コンストラクターは、この時点で作成されたインスタンス、つまりオブジェクトを返すことがわかります。コンストラクター内の

this

によって指されるオブジェクト。ただし、コンストラクターに戻り値がある場合は、状況に応じて区別する必要があります。非参照型の値が返された場合でも、実際に返されるのは新しく作成されたインスタンス オブジェクトです。ただし、参照型の値が返される場合は、参照オブジェクト自体が返されます。例:

function Person(){
    return function(){}
}
var person = new Person()
typeof person // "function"
ログイン後にコピー
JavaScript では、関数は第一級市民として、本質的に参照型であるため、 person は返される匿名関数です。

新しい演算子の 2 つの形式

実際、MDN の新しい演算子の説明では、構文は

new constructor[([arguments])]
ログイン後にコピー

です。([arguments ])角括弧で囲まれているのは省略できることを意味します。 したがって、パラメータのないコンストラクタの場合、 new Person() と new Person に違いがない場合は、 を返す前の As についての質問を考えます。関数で、new Person() が実行されるとき、(new Person)() の代わりに new Person() が実行されるのはなぜですか?私の以前の記事を読んだことがある方は、パラメータを持つ新しい演算子の方が、パラメータ リストのない新しい演算子よりも高い優先順位を持っていることをご存知でしょう。したがって、最初の実行は常に 2 番目の実行ではなく実行されます。

JavaScript 演算子の優先順位の詳細な分析 (例付き)上記の手順を理解すると、JavaScript エンジンが式

new provider[type].$get()(config);
ログイン後にコピー
# をどのように解析するかが問題の本質に近づきます。 ## Into:

(new provider[type].$get())(config);
ログイン後にコピー

または

new (provider[type].$get())(config);
ログイン後にコピー

最初の形式では、(new Provider[type].$get()) は匿名関数を返すため、anonymous(config) Internal ではこのポイントが返されます。窓へ。 2 番目のモードでは、provider[type].$get() は匿名関数を返すため、new anonymous(config) を実行すると、内部 this ポインタは新しく作成されたインスタンス this を指します。

もちろん、質問からわかります。なぜこれが new によって作成された新しいオブジェクトではなくウィンドウを指すのかということです。実際、作者が当時表現したかったのは 2 番目の意味でした。道は走っているという形で表現されました。なぜ?理由は非常に簡単です。最初の実行メソッドでは、JavaScript エンジンが最初にパラメータ リストを使用して new 演算子を解析します。一方、2 番目のメソッドでは、関数呼び出しが最初に実行され、次に new 演算子が実行されます。レベル図からわかるように、パラメーター リストを含む new は関数呼び出しよりも優先度が高いため、最初の方法で実行する必要があります。

実のところ、この記事にはあまり有益な情報はありませんが、それでも 2 つの洞察が得られます。まず、以前の同様の記事から、このような曖昧な表現を避け、より少ない言葉を使用することを強調しました。括弧を使った問題はすべて簡単に解決できます。たとえば、次のようなことを書く生徒もいます。

var str = "Hello" + true ? "World" : "JavaScript";
ログイン後にコピー

では、str の内容は何ですか? ある人は、これが Hello World であると考えるかもしれません。 World. 本質的に、上記の演算の結果は World,

演算子の優先順位が条件演算子よりも高いため、この時点で括弧を追加するとコードが読みやすくなります。第二に、テクノロジーに対する畏怖の念を持ち続けてください。最大の恐怖は、テクノロジーをすべて知っていると思っているのに、実際には何も知らないことです。 ########################################

以上がJavaScript 演算子の優先順位の詳細な分析 (例付き)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:segmentfault.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!