目次
TypeScript JavaScript を置き換えますか?
#JavaScript エンジンが必要な理由
this指向
箭头函数 arrow function
认识arguments
理解JvaScript纯函数
JavaScript 柯里化
组合函数
其他内容
with语句
eval函数
严格模式 strict Mode
ホームページ ウェブフロントエンド jsチュートリアル JavaScript についての詳細なチャット

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

Jun 16, 2022 am 11:53 AM
javascript

この記事では、javascript に関する関連知識を提供します。主に、JavaScript エンジンが必要な理由、ブラウザ カーネルと JS エンジンの関係、環境変数とレコードなどが含まれます。ぜひご覧ください。皆さんのお役に立てれば幸いです。

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

[関連する推奨事項: JavaScript ビデオ チュートリアル Web フロントエンド ]

TypeScript JavaScript を置き換えますか?

  1. TypeScript は型思考をもたらすだけです
    JavaScript 自体には長い間変数、関数パラメータ、その他の型に対する制限がないため
    これにより、プロジェクトにセキュリティ上の問題が生じる可能性があります隠れた危険
  2. 一連の型制約スキームが JavaScript コミュニティに出現しました
    2014 年、Facebook は JavaScript で型チェックを実行するフローを開始しました

3.型ソースを JavaScript に、 JavaScript へ

#JavaScript エンジンが必要な理由

高級プログラミング言語は、実行のために最終的な機械命令に変換する必要があります
実際には、どのような JavaScript を作成しても、実行はブラウザまたはノードに任せ、最終的には CPU
によって実行される必要があります。そのため、JavaScript コードを CPU## に変換するのに役立つ JavaScript エンジンが必要です。 # 実行手順

ブラウザ コアと JS エンジンの関係

ここでは WebKit を列として取り上げます。WebKit は実際には 2 つの部分で構成されています:

WebCore: HTML の解析、レイアウト、レンダリング、およびその他の関連作業を担当します
JavaScriptCore: JavaScript コードを解析して実行します

変数環境と記録

VO (変数オブジェクト) 変数オブジェクト 最新の ECMA 標準では、VO はすでに別の変数環境を持っています。 変数環境 VE

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

AO (Activation Objece) ) には、関数実行コンテキストが含まれます

#メモリ管理とクロージャ

メモリ管理について

JavaScript についての詳細なチャット#JS のメモリ管理

変数を定義するときに JavaScript がメモリを割り当てます

JS による基本データ型メモリの割り当ては、スタック領域に直接割り当てられます実行中; JS による複素データ型メモリの割り当て 割り当てによりヒープ メモリに領域が開かれ、この領域のポインタ戻り値変数が参照されます

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

理由メモリのサイズには制限があるため

なので、メモリが不要になったら解放してメモリ領域を増やす必要があります

ゴミ英語のコレクションはガベージコレクション

略してGCです

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


詳細なクロージャ

コンピュータ サイエンスにおけるクロージャの定義 (Wikipedia): クロージャ (英語: Closure)、字句クロージャ (Lexical Closure) とも呼ばれます。または関数クロージャ (関数クロージャ) );

は、ファーストクラス関数をサポートするプログラミング言語で字句バインディングを実装するためのテクノロジです。

実装では、クロージャは関数と関連する環境を格納する構造です (シンボル ルックアップ テーブルと同等);
クロージャと関数の最大の違いは、クロージャがキャプチャされると、その
自由変数
がキャプチャ時に決定されることです。キャプチャ時のコンテキストから分離されており、通常どおり実行することもできます
クロージャの概念は 1960 年代に登場し、クロージャを実装した最も古いプログラムは Scheme でした。そのため、クロージャが存在する理由が理解できます。 JavaScript では;JavaScript には多くのクロージャがあるため、設計は Scheme から派生しています;



MDN の JavaScript クロージャの説明を見てみましょう: JavaScript についての詳細なチャット 関数とその周囲の状態 (字句環境、字句環境) 参照は一緒にバンドルされ (または関数が参照で囲まれ)、この組み合わせがクロージャです

つまり、クロージャを使用すると、その外側の関数のスコープにアクセスできます。内部関数内;

JavaScript では、関数が作成されるたびに、関数の作成と同時にクロージャが作成されます;

function foo() {
    var name = 'why'
    var age = 18
    function bar() {
        console.log('bar ',name)
    }
    return bar}var fun = foo()fun()
ログイン後にコピー

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

狭い観点から: JavaScript の関数 (アクセスする場合)外側の層が変数に作用すると、それはクロージャになります;

this指向

在全局作用域下:
浏览器:window
node环境:{}

箭头函数 arrow function

箭头函数是ES6 之后增加的一种编写函数的方法,并且它比函数表达式更加简洁;
箭头函数不会绑定this、arguments属性;
箭头函数不能作为构造函数来使用(不能和new一起来使用,会抛出错误)

认识arguments

arguments是一个对应于 传递给函数的参数的类(伪)数组(array-like) 对象

理解JvaScript纯函数

函数式编程中有一个非常重要的概念叫做纯函数,JavaScript符合函数式编程的规范,所以也有纯函数的概念;

纯函数的维基百科定义:
在程序设计中,若一个函数符合以下条件,那么这个函数辈称为纯函数
此函数在相同的输入值时,需要产生相同的输出
函数的输出和输入值以外的其他隐藏信息或状态无关,也和由I/O设备产生的外部输出无关
改函数不能有语义上可观察的函数副作用,诸如 “触发事件”,使输出设备输出,或更改输出值以外物件的内容等
总结:
确定的输入,一定产生确定的输出;
函数在执行过程中,不能产生副作用;

副作用:

JavaScript 柯里化

柯里化也是属于函数式编程里面一个非常重要的概念
维基百科解释:
在计算机科学中,柯里化(Currying) ,又译为卡瑞化 或加里化
是八接收多个参数的函数,变成接收一个单一参数(最初函数的第一个参数)的函数,并且返回接受余下的参数,而且返回结果的新函数
柯里化声称:如果你固定某些参数,你将得到接受余下参数的一个函数

总结:
只传递给函数一部分参数来调用它,让它返回一个函数区处理剩余的参数;
这个过程就称为柯里化

为什么需要柯里化:
在函数式编程中,我们其实往往希望一个函数处理的问题尽可能的单一,而不是将一大堆的处理过程交给一个函数来处理

function foo(x,y,c) {
    return x + y + c
}
console.log(foo(10,20,30))

//柯里化
function sum(x) {
    return function(y) {
        return function(z) {
            return x + y + z
        }
    }
}
var a = sum(10)(20)(30)
console.log(a )

//简化柯里化
var sum2 = x => y => z => {
    return x + y + z
}
console.log(sum2(10)(20)(30 ))
ログイン後にコピー

组合函数

组合函数(Compose) 函数是在JavaScript开发中一种对函数的使用技巧、模式:
比如我们现在需要对某个数据进行函数的调用,执行两个函数fn1 和 fn2,这两个函数是依次执行的
那么如果我们每次都需要进行两个函数的调用,操作上就会显示的重复
那么是否可以将这两个函数组合起来,自动依次调用呢?
这个过程就是对函数的组合,我们称之为组合函数(Compose Function)

其他内容

with语句

with 语句
+作用: 可以形成自己的作用域
不建议使用with语句 ,因为它可能是混淆错误和兼容性问题的根源

var obj2 = {name:'Tom',age:18,message:'obj2'}

// var message = "hello world"

function foo() {
function bar () {
     with(obj2) {
          console.log(message)
     }
}
bar()
}
foo()
ログイン後にコピー
eval函数

eval是一个特殊的函数,它可以将传入的字符串当作JavaScript 代码来运行

   var strFn = 'var message = "Hello world"; console.log(message);';
   eval(strFn)
ログイン後にコピー

不建议在开发中使用eval:
eval代码的可读性非常的差(代码的可读性是高质量代码的重要原则);
eval是一个字符串,那么有可能在执行的过程中辈可以篡改,那么可能会造成被攻击的风险;
eval的执行必须经过JS解释器,不能不被JS引擎优化;

严格模式 strict Mode

 严格模式是一种具有限制性的JavaScript模式,从而使代码隐式的脱离了"懒散(sloppy) 模式"
 支持严格模式的浏览器在监测到代码中有严格模式时,会以更加严格的方式对代码进行监测和执行

 严格模式通过抛出错误来消除一些原有的静默(silent)错误
 严格模式让Js引擎周期执行代码时可以进行更多的优化(不需要对一些特殊的语法进行处理)
ログイン後にコピー
"use strict"; // 开启严格模式var message = "hello world"console.log(message)
ログイン後にコピー

严格模式限制
这里我们来说几个严格模式下的严格语法限制:
JavaScript被设计为新手开发者更容易上手,所以有时候本来错误语法,被认为也是可以正常被解析的
但是在严格模式下,这种失误会被当成错误,以便可以快速的发现和修正

  1. 无法意外的创建全局变量
// 1. 意外创建全局变量
    message = "Hello world"
    console.log(message)

    function foo() {
        age = 20
    }
    foo()
    console.log(age)
ログイン後にコピー
  1. 严格模式会时引起静默失败(silently fail ,注:不报错也没有任何效果)的赋值操作抛出异常
//默认静态错误
true.name ='xiaoluo';
NaN = 123
ログイン後にコピー
  1. 严格模式下试图删除不可删除的属性
  2. 严格模式不允许函数参数有相同的名称
// 不允许函数参数有相同的名称function foo(x,y,x) {
    console.log(x,y,x)}foo(10,20,30)
ログイン後にコピー
  1. 不允许0 的八进制语法
var num = 0o123 // 八进制
var num2 = 0x123 // 十六进制
console.log(num,num2)
ログイン後にコピー
  1. 在严格模式下, 不允许使用with
var obj2 = {name:'Tom',age:18,message:'obj2'}

with(obj2) {
      console.log(message)
     }
ログイン後にコピー
  1. 在严格模式下,eval 不再为上层引用变量
var strFn = 'var message = "Hello world"; console.log(message);';
eval(strFn)
console.log(message)
ログイン後にコピー
  1. 严格模式下,this绑定不会默认转成对象
    严格模式下,自执行函数会指向undefined
function foo() {
    console.log(this) //undefined
}
foo()
ログイン後にコピー

【相关推荐:javascript视频教程web前端

以上がJavaScript についての詳細なチャットの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 Dec 17, 2023 pm 02:54 PM

WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 はじめに: 技術の継続的な発展により、音声認識技術は人工知能の分野の重要な部分になりました。 WebSocket と JavaScript をベースとしたオンライン音声認識システムは、低遅延、リアルタイム、クロスプラットフォームという特徴があり、広く使用されるソリューションとなっています。この記事では、WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法を紹介します。

WebSocket と JavaScript: リアルタイム監視システムを実装するための主要テクノロジー WebSocket と JavaScript: リアルタイム監視システムを実装するための主要テクノロジー Dec 17, 2023 pm 05:30 PM

WebSocketとJavaScript:リアルタイム監視システムを実現するためのキーテクノロジー はじめに: インターネット技術の急速な発展に伴い、リアルタイム監視システムは様々な分野で広く利用されています。リアルタイム監視を実現するための重要なテクノロジーの 1 つは、WebSocket と JavaScript の組み合わせです。この記事では、リアルタイム監視システムにおける WebSocket と JavaScript のアプリケーションを紹介し、コード例を示し、その実装原理を詳しく説明します。 1.WebSocketテクノロジー

JavaScript と WebSocket を使用してリアルタイムのオンライン注文システムを実装する方法 JavaScript と WebSocket を使用してリアルタイムのオンライン注文システムを実装する方法 Dec 17, 2023 pm 12:09 PM

JavaScript と WebSocket を使用してリアルタイム オンライン注文システムを実装する方法の紹介: インターネットの普及とテクノロジーの進歩に伴い、ますます多くのレストランがオンライン注文サービスを提供し始めています。リアルタイムのオンライン注文システムを実装するには、JavaScript と WebSocket テクノロジを使用できます。 WebSocket は、TCP プロトコルをベースとした全二重通信プロトコルで、クライアントとサーバー間のリアルタイム双方向通信を実現します。リアルタイムオンラインオーダーシステムにおいて、ユーザーが料理を選択して注文するとき

WebSocketとJavaScriptを使ったオンライン予約システムの実装方法 WebSocketとJavaScriptを使ったオンライン予約システムの実装方法 Dec 17, 2023 am 09:39 AM

WebSocket と JavaScript を使用してオンライン予約システムを実装する方法 今日のデジタル時代では、ますます多くの企業やサービスがオンライン予約機能を提供する必要があります。効率的かつリアルタイムのオンライン予約システムを実装することが重要です。この記事では、WebSocket と JavaScript を使用してオンライン予約システムを実装する方法と、具体的なコード例を紹介します。 1. WebSocket とは何ですか? WebSocket は、単一の TCP 接続における全二重方式です。

JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築 JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築 Dec 17, 2023 pm 05:13 PM

JavaScript と WebSocket: 効率的なリアルタイム天気予報システムの構築 はじめに: 今日、天気予報の精度は日常生活と意思決定にとって非常に重要です。テクノロジーの発展に伴い、リアルタイムで気象データを取得することで、より正確で信頼性の高い天気予報を提供できるようになりました。この記事では、JavaScript と WebSocket テクノロジを使用して効率的なリアルタイム天気予報システムを構築する方法を学びます。この記事では、具体的なコード例を通じて実装プロセスを説明します。私たちは

JavaScriptでinsertBeforeを使用する方法 JavaScriptでinsertBeforeを使用する方法 Nov 24, 2023 am 11:56 AM

使用法: JavaScript では、insertBefore() メソッドを使用して、DOM ツリーに新しいノードを挿入します。このメソッドには、挿入される新しいノードと参照ノード (つまり、新しいノードが挿入されるノード) の 2 つのパラメータが必要です。

簡単な JavaScript チュートリアル: HTTP ステータス コードを取得する方法 簡単な JavaScript チュートリアル: HTTP ステータス コードを取得する方法 Jan 05, 2024 pm 06:08 PM

JavaScript チュートリアル: HTTP ステータス コードを取得する方法、特定のコード例が必要です 序文: Web 開発では、サーバーとのデータ対話が頻繁に発生します。サーバーと通信するとき、多くの場合、返された HTTP ステータス コードを取得して操作が成功したかどうかを判断し、さまざまなステータス コードに基づいて対応する処理を実行する必要があります。この記事では、JavaScript を使用して HTTP ステータス コードを取得する方法を説明し、いくつかの実用的なコード例を示します。 XMLHttpRequestの使用

JavaScript と WebSocket: 効率的なリアルタイム画像処理システムの構築 JavaScript と WebSocket: 効率的なリアルタイム画像処理システムの構築 Dec 17, 2023 am 08:41 AM

JavaScript は Web 開発で広く使用されているプログラミング言語であり、WebSocket はリアルタイム通信に使用されるネットワーク プロトコルです。 2 つの強力な機能を組み合わせることで、効率的なリアルタイム画像処理システムを構築できます。この記事では、JavaScript と WebSocket を使用してこのシステムを実装する方法と、具体的なコード例を紹介します。まず、リアルタイム画像処理システムの要件と目標を明確にする必要があります。リアルタイムの画像データを収集できるカメラ デバイスがあるとします。

See all articles