ホームページ ウェブフロントエンド jsチュートリアル ダークホース プログラマー JavaScript ビデオ リソースの共有

ダークホース プログラマー JavaScript ビデオ リソースの共有

Aug 24, 2017 pm 06:25 PM
javascript js プログラマー

Dark Horse Programmer JavaScript Video Tutorial」では、JavaScript について詳しく紹介します。JavaScript は文字通りのスクリプト言語であり、クライアントサイドの Web 開発で広く使用されているスクリプト言語です。現在、デザインの改善、フォームの検証、ブラウザの検出、Cookie の作成などを目的として、何百万もの Web ページで使用されています。

ダークホース プログラマー JavaScript ビデオ リソースの共有

動画再生アドレス:http://www.php.cn/course/500.html

この動画の難易度は論理能力を試す配列ループです。以下は、さまざまなループの例をまとめたものです:

配列内の要素をどのように走査するのでしょうか? 20 年前に JavaScript が初めて登場したとき、次のように配列トラバーサルを実装できました:

var arr=["one","two","three"];2 for(var i=0;i<arr.length;i++){3     document.write(arr[i]);4 }
ログイン後にコピー

ES5 の公式リリース以降、組み込みの forEach メソッドを使用して配列をトラバースできます:

myArray.forEach(function (value) {
     console.log(value);});实际上forEach有三个参数  分别为  值  下标  数组本身 于是我们有[].forEach(function(value, index, array) {    // ...});
对比jQuery中的$.each方法:
$.each([], function(index, value, array) {    // ...});
ログイン後にコピー

最初と2 番目のパラメータ これはまったく逆です。皆さんは注意して、間違って覚えないようにしてください。 $.map など、後の同様のメソッドにも同じことが当てはまります。

forEach は十分な柔軟性がありません。

arr.forEach は使用できません。 Break ステートメントを使用してループを中断することも、return ステートメントを使用して外部関数に戻ることもできません。

もちろん、for ループ構文を使用して配列要素を走査するだけでも素晴らしいでしょう。

次に、必ず for-in ループを試してください:

$.each(Array, function(i, value) {
     Array   //数组     this;      //this指向当前元素
    i;         //i表示Array当前下标
    value;     //value表示Array当前元素});
 
var arr = [ "one", "two", "three", "four"];    
$.each(arr, function(){    
   alert(this);    
});    
 
//上面这个each输出的结果分别为:one,two,three,four  
var obj = { one:1, two:2, three:3, four:4};    
$.each(obj, function(key, val) {    
   alert(obj[key]);          
});  
//这个each就有更厉害了,能循环每一个属性
//输出结果为:1   2  3  4
ログイン後にコピー

このコードでは、index に割り当てられる値は実際の数値ではなく、文字列「0」、「1」、「2」です。 "2" + 1 == "21" などの文字列算術計算が意図せず実行される可能性が非常に高く、エンコード プロセスに多大な不便をもたらします。

要するに、

for-inは通常のオブジェクト用に設計されており、文字列型のキーを取得するために走査できるため、配列の走査には適していません。

for...in は配列の走査には適していません

for...in はカスタム プロパティまたはプロトタイプ プロパティを走査します。インデックスは数値ではなく文字列であり、場合によっては走査さえできない場合があります。 in order

強力な for -of ループ

ES6 は、作成した JS コードを壊しません。何千もの Web サイトが for-in ループに依存しているようで、中には配列の走査に for-in ループを使用しているものもあります。 for-in ループを修正して配列トラバーサルのサポートを追加すると、さらに混乱が生じるため、標準化委員会は現在の問題を解決するために ES6 に新しいループ構文を追加しました。

for...in を使用してオブジェクトを走査するのと同じくらいシンプルで使いやすい、配列を走査するためのより便利な方法が必要です。つまり for...of

次のようにします:

arr.forEach(function(i,j,v){
    document.write("<br />数组的值"+i+
                     "<br />数组的下标"+j+","+
                     "<br />数组本身"+v+"---")
})
ログイン後にコピー

はい、これは実行しますループは以前の組み込みメソッドと比べて見慣れたものに見えますか?さて、for-of ループの外観の下にどのような強力な機能が隠されているかを調べていきます。ここでは、覚えておいてください:

これは、配列要素を反復処理するための最も簡潔で簡単な構文です

このメソッドは、for-in ループの落とし穴をすべて回避します

forEach() とは異なり、break、 continue、return ステートメントに正しく応答します

for-in ループは、オブジェクトのプロパティを走査するために使用されます。

for-of ループは、配列内の値などのデータを反復処理するために使用されます。

でも、それだけじゃないんです!

for-of ループは他のコレクションを走査することもできます

for-of ループは配列をサポートするだけでなく、DOM NodeList オブジェクトなどのほとんどの配列のようなオブジェクトもサポートします。

for-of ループは、文字列を走査する一連の Unicode 文字として扱う文字列トラバーサルもサポートしています。

for (var index in myArray) { // 千万别这样做  console.log(myArray[index]);
}
ログイン後にコピー

Map および Set オブジェクトのトラバーサルもサポートしています。

$.map(array,function)

構文分析: 配列内の各要素に対して、関数 function を呼び出して処理し、結果を返して新しい配列を取得します。

例による説明: 配列内の各要素を 2 で乗算し、新しい配列を返します。コードは次のとおりです

for (var value of myArray) {
  console.log(value);
}
ログイン後にコピー

追加説明: item は各要素を表しており、他の要素に置き換えることができます。

このビデオの教師は、明確な構成、層ごとの分析、連動するリンク、厳密な議論、厳密な構造を用いて、物事をシンプルでわかりやすい方法で説明し、引き寄せるために論理的な思考力を使用します。生徒の注意を引き付け、理性を使って教室での指導プロセスをコントロールします。指導スキルはウィットに富んでおり、さまざまな指導方法やテクニックが容易に利用でき、洗練された跡もなく自由かつ適切に使用できます。

以上がダークホース プログラマー 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 を使用してオンライン音声認識システムを実装する方法を紹介します。

株価分析に必須のツール: PHP と JS を使用してローソク足チャートを描画する手順を学びます 株価分析に必須のツール: PHP と JS を使用してローソク足チャートを描画する手順を学びます Dec 17, 2023 pm 06:55 PM

株式分析に必須のツール: PHP および JS でローソク足チャートを描画する手順を学びます。特定のコード例が必要です。インターネットとテクノロジーの急速な発展に伴い、株式取引は多くの投資家にとって重要な方法の 1 つになりました。株価分析は投資家の意思決定の重要な部分であり、ローソク足チャートはテクニカル分析で広く使用されています。 PHP と JS を使用してローソク足チャートを描画する方法を学ぶと、投資家がより適切な意思決定を行うのに役立つ、より直感的な情報が得られます。ローソク足チャートとは、株価をローソク足の形で表示するテクニカルチャートです。株価を示しています

推奨: 優れた JS オープンソースの顔検出および認識プロジェクト 推奨: 優れた JS オープンソースの顔検出および認識プロジェクト Apr 03, 2024 am 11:55 AM

顔の検出および認識テクノロジーは、すでに比較的成熟しており、広く使用されているテクノロジーです。現在、最も広く使用されているインターネット アプリケーション言語は JS ですが、Web フロントエンドでの顔検出と認識の実装には、バックエンドの顔認識と比較して利点と欠点があります。利点としては、ネットワーク インタラクションの削減とリアルタイム認識により、ユーザーの待ち時間が大幅に短縮され、ユーザー エクスペリエンスが向上することが挙げられます。欠点としては、モデル サイズによって制限されるため、精度も制限されることが挙げられます。 js を使用して Web 上に顔検出を実装するにはどうすればよいですか? Web 上で顔認識を実装するには、JavaScript、HTML、CSS、WebRTC など、関連するプログラミング言語とテクノロジに精通している必要があります。同時に、関連するコンピューター ビジョンと人工知能テクノロジーを習得する必要もあります。 Web 側の設計により、次の点に注意してください。

どのAIプログラマーが一番優れているでしょうか? Devin、Tongyi Lingma、SWE エージェントの可能性を探る どのAIプログラマーが一番優れているでしょうか? Devin、Tongyi Lingma、SWE エージェントの可能性を探る Apr 07, 2024 am 09:10 AM

世界初の AI プログラマー Devin の誕生から 1 か月も経たない 2022 年 3 月 3 日、プリンストン大学の NLP チームはオープンソース AI プログラマー SWE-agent を開発しました。 GPT-4 モデルを利用して、GitHub リポジトリの問題を自動的に解決します。 SWE ベンチ テスト セットにおける SWE エージェントのパフォーマンスは Devin と同様で、平均 93 秒かかり、問題の 12.29% を解決しました。専用端末と対話することで、SWE エージェントはファイルの内容を開いて検索したり、自動構文チェックを使用したり、特定の行を編集したり、テストを作成して実行したりできます。 (注: 上記の内容は元の内容を若干調整したものですが、原文の重要な情報は保持されており、指定された文字数制限を超えていません。) SWE-A

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

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

C言語の魅力に迫る ~プログラマーの可能性を引き出す~ C言語の魅力に迫る ~プログラマーの可能性を引き出す~ Feb 24, 2024 pm 11:21 PM

C言語学習の魅力:プログラマーの可能性を引き出す テクノロジーの発展に伴い、コンピュータプログラミングは大きな注目を集めている分野です。数あるプログラミング言語の中でもC言語は常にプログラマーに愛されています。そのシンプルさ、効率性、幅広い用途により、C 言語の学習は、多くの人にとってプログラミングの分野に入る最初のステップとなっています。この記事では、C言語を学ぶ魅力と、C言語を学ぶことでプログラマーの可能性を引き出す方法について解説します。 C言語学習の魅力は、まずその簡単さにあります。他のプログラミング言語と比較すると、C言語は

PHP および JS 開発のヒント: 株価ローソク足チャートの描画方法をマスターする PHP および JS 開発のヒント: 株価ローソク足チャートの描画方法をマスターする Dec 18, 2023 pm 03:39 PM

インターネット金融の急速な発展に伴い、株式投資を選択する人がますます増えています。株式取引では、ローソク足チャートは一般的に使用されるテクニカル分析手法であり、株価の変化傾向を示し、投資家がより正確な意思決定を行うのに役立ちます。この記事では、PHP と JS の開発スキルを紹介し、株価ローソク足チャートの描画方法を読者に理解してもらい、具体的なコード例を示します。 1. 株のローソク足チャートを理解する 株のローソク足チャートの描き方を紹介する前に、まずローソク足チャートとは何かを理解する必要があります。ローソク足チャートは日本人が開発した

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

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

See all articles