ホーム>Web デザインのチュートリアル>JavaScript チュートリアル

JavaScript についての詳細なチャット

著者：Eve Cole 更新時間：2022-06-27 09:58:25
この記事では、JavaScript エンジンが必要な理由、ブラウザ カーネルと JS エンジンの関係、環境変数とレコードなど、JavaScript に関する関連知識を紹介します。皆さんの参考になれば幸いです。 。 ヘルプ。

TypeScript は JavaScript に取って代わるのでしょうか?

  1. TypeScript は型の考え方のみをもたらします。これは、JavaScript 自体には長い間、変数や関数パラメーターなどに対する型の制限がなかったためです。これにより、プロジェクトにセキュリティ上のリスクがもたらされる可能性があります。
  2. その後、一連の型制約スキームが JavaScript に登場しました。コミュニティ。
    2014 年に、Facebook は JavaScript で型チェックを実行するフローを開始しました。

3.型は JavaScript に属しており、

実際には、高度なプログラミング言語を最終的な機械命令に変換する必要があるのはなぜですか

。

作成した JavaScript がブラウザに渡されるかノードの実行に渡されるかに関係なく、最終的には CPU によって実行される必要があるため、

関係を

実行するために JavaScript コードをCPU命令に変換するのに役立つ JavaScript エンジンが必要です。

ここで

は

WebKit を列として取り上げます。WebKit は実際には 2 つの部分で構成されています。
WebCore: HTML の解析、レイアウト、レンダリング、およびその他の関連作業を担当します。

JavaScriptCore: JavaScript コードの

変数環境の

解析と実行

、および

VO (Variable Object) 変数オブジェクトの記録 最新の ECMA 標準では、VO にはすでに変数環境 VE

GO (Clobal Object) グローバル オブジェクトとグローバル実行コンテキスト

AO (Activation Object)

の別名が付けられています。

)。 ) には、関数実行コンテキスト

メモリ管理とクロージャ

  1. 対応メモリ管理
が含まれます。

ここに画像の説明を挿入します

JS メモリ管理

JavaScript は変数を定義するときにメモリを割り当てます。
JS は、実行中に基本データ型のメモリをスタック領域に直接割り当てます。
JS が複雑なデータ型にメモリを割り当てると、ヒープ メモリ内にスペースが空き、

メモリのサイズが制限されているため、

JS のガベージ コレクション

ではこのスペースのポインタ戻り値変数が参照されます。

必要な場合は、より多くのメモリ領域を解放するために解放する必要があります。

ガベージ コレクションは英語ではGarbage Collectionまたは GC です。
使用されなくなったオブジェクトは、Java 実行環境 JVM や JavaScript 実行環境 JS エンジンなどの言語実行環境で、メモリ ガベージ コレクタによってリサイクルされる必要があります。ガベージ コレクター、略して GC とも呼ばれます。そのため、多くの場所で、GC は実際にはガベージ コレクターを指します。

これは、

コンピューター サイエンスにおけるクロージャーの定義です (Wikipedia)。
クロージャ（英語: Closure ）、字句クロージャ（Lexical Closure）または関数クロージャ（Function Closure）とも呼ばれます。
これは、ファーストクラス関数をサポートするプログラミング言語に字句バインディングを実装するテクノロジーです。
実装では、クロージャは関数と関連する環境 (シンボル ルックアップ テーブルに相当) を格納する構造です。
クロージャと関数の最大の違いは、クロージャがキャプチャされると、その自由変数がキャプチャ時に決定されるため、キャプチャ時にコンテキスト外にあったとしても通常どおり実行できることです

。クロージャの概念は 1960 年代に登場しました。クロージャを実装する最も初期のプログラムは Scheme でした。そのため、JavaScript にクロージャが存在する理由が理解できます。
JavaScript のデザインの多くは Scheme から派生しているためです。
ここに画像の説明を挿入します

MDN による JavaScript クロージャの説明を見てみましょう。
関数はその周囲の状態 (字句環境) への参照とバンドルされています (または、関数が参照で囲まれています)。つまり、クロージャーを使用すると、スコープの内部関数内で関数にアクセスできます。その外側の機能について。
JavaScript では、関数が作成されるたびに、関数の作成と同時にクロージャーも作成されます

。
    変数名 = 'なぜ'
    var 年齢 = 18
    関数 bar() {
        console.log('バー',名前)
    }
    return bar}var fun = foo()fun()

概要:
通常の関数 function は、外側の層が作用する自由変数にアクセスできる場合はクロージャです。
広い観点から見ると、JavaScript の関数はクロージャです。
狭い観点から見ると、JavaScript の関数が外部変数にアクセスする場合、

それは

グローバル スコープを

指す

クロージャです。


ブラウザ: ウィンドウ
ノード環境: {}

アロー関数 アロー関数

アロー関数は、ES6 以降に追加された関数を記述する方法であり、関数式よりも簡潔です。
アロー関数は this 属性と argument 属性をバインドしません。

アロー関数はコンストラクターとして使用できません (new では使用でき

ませ

ん。エラーがスローされます)。

引数の理解

引数は、関数に渡されるパラメーターに対応する (配列のような) オブジェクトです

。

関数型プログラミングには純粋関数と呼ばれる非常に重要な概念があり、JavaScript は関数型プログラミングの仕様に準拠しているため、純粋関数の概念も

Wikipedia にあります。
プログラミングでは、関数が次の条件を満たす場合、この関数は純粋関数と呼ばれます。関数の入力値が同じ場合、関数の出力は他の隠れた情報とは何の関係もありません。 I/O デバイスによって生成される外部出力に関係のない関数には、「イベントのトリガー」、出力デバイスの出力の原因、または出力値以外のオブジェクトの内容の変更など、意味的に観察可能な関数の副作用を持たせることはできません。 。 まとめ：
決定された入力は、特定の出力を生成する必要があります。
関数の実行中に副作用は発生しません

。

JavaScript カリー化

カリー化は関数型プログラミングにおいても非常に重要な概念です。Wikipedia では次のように説明されています。
コンピューターサイエンスにおいて、カリー化 (カリー化) は、カリー化またはカリー化とも訳され、複数のパラメーターを受け取る関数であり、単一のパラメーター (元の関数の最初のパラメーター) を受け取る関数になり、残りの引数を返し、結果を返します。 カリー化されたクレーム: 特定の引数を修正すると、

残りの引数を受け入れる関数の概要が得られます。
パラメータの一部だけを関数に渡して呼び出すと、残りのパラメータを処理するための関数領域が返されます。
このプロセスはカリー化と呼ばれます。

カリー化が必要な理由は次のとおりです。

関数型プログラミングでは、
関数 foo(x,y,c) { を

処理するために多くの処理を関数に渡すのではなく、関数によって処理される問題ができるだけ単純であることをよく望みます。

    x + y + cを返す
}
console.log(foo(10,20,30))

//カレー関数 sum(x) {
    戻り関数(y) {
        戻り関数(z) {
            x + y + z を返す
        }
    }
}
var a = 合計(10)(20)(30)
コンソールログ(a)

// カリー化を簡略化します var sum2 = x => y => z => {
    x + y + z を返す
}
console.log(sum2(10)(20)(30))

結合関数結合

関数 (Compose) 関数は、JavaScript 開発で関数を使用するための手法およびモードです。
たとえば、特定のデータに対して関数を呼び出し、2 つの関数 fn1 と fn2 を実行する必要があります。これら 2 つの関数を毎回呼び出す必要がある場合、操作は繰り返しのように見えます。これら 2 つの関数を組み合わせて、自動的に次々に呼び出すにはどうすればよいでしょうか?

この処理は、Compose
Function

と

呼ばれる

関数

の組み合わせです。


+機能: 独自のスコープを作成できます。混乱エラーや互換性の問題の原因となる可能性があるため
、

with ステートメントの使用はお勧めできません。

'}

// var message = "ハローワールド"

関数 foo() {
ファンクションバー() {
     with(obj2) {
          console.log(メッセージ)
     }
}
バー（）
}
foo()
eval 関数

eval は、受信した文字列を JavaScript コードとして実行できる特別な関数です。

var strFn = 'var message = "Hello world";';
   eval(strFn)

開発時に eval を使用することはお勧めできません。
eval コードの可読性は非常に悪いです (コードの可読性は高品質コードの重要な原則です)。
eval は文字列であるため、実行中に改ざんされる可能性があり、攻撃される危険性があります。
eval の実行は JS インタープリタを経由する必要があり、JS エンジンによって最適化される必要があります。strict

モード strict

モードは、コードを暗黙的に「ずさんなモード」から離脱させる制限的な JavaScript モードです。
 ストリクト モードをサポートするブラウザは、コード内でストリクト モードを検出すると、より厳密な方法でコードを監視し、実行します。ストリクト モードでは、エラーをスローすることで元のサイレント エラーが排除され、JS エンジンはさらに最適化を実行できます。コードを定期的に実行する場合 (特別な構文を扱う必要はありません)
"use strict"; // strict モードをオンにします var message = "hello world" console.log(message)

strict モードの制限事項について説明します。厳密モードでの厳密な構文制限:
JavaScript は初心者の開発者が簡単に始められるように設計されているため、誤った構文は正常に解析されると見なされますが、厳密モードでは、そのような間違いはエラーとして扱われるため、

  1. 予期しないエラーがすぐに発見されて修正されます。 global variable
// 1. 誤ってグローバル変数 message = "Hello world" を作成してしまう
    console.log(メッセージ)

    関数 foo() {
        年齢=20歳
    }
    foo()
    Console.log(age)
  1. 厳密モードでは、割り当て操作がサイレントに失敗する場合があります (注: エラーは報告されず、影響はありません)。
//デフォルトの静的エラー true.name ='xiaoluo';
NaN = 123
  1. 厳密モードで削除不可能な属性を削除しようとしています
  2. 厳密モードでは、関数パラメータに同じ名前を付けることはできません
// 関数パラメータに同じ名前を付けることはできません function foo(x,y,x) {
    console.log(x,y,x)}foo(10,20,30)
  1. では、8 進構文 0
var num = 0o123 // 8 進数 var num2 = 0x123 // 16 進数 console.log(num,num2)
  1. In strict モード、
var obj2 = {name:'Tom',age:18,message:'obj2'}
での使用は許可されません

with(obj2) {
      console.log(メッセージ)
strict
モード
では、eval は
上位層の
  1. 変数 var を参照しなくなりました。
strFn = 'var message = "Hello world";';
eval(strFn)
console.log(message)
  1. 厳密モードでは、このバインディングはデフォルトでオブジェクトに変換されません。厳密モードでは、自己実行関数は未定義
関数 foo() {
を指します。
    console.log(this) //未定義
}
foo()
関連記事