目次[隠す][見せる]
- 1. 基礎知識の向上
- 2. オブジェクト指向戦略を活用する
- 3. 小さくても機能を活かす
- 4. == の代わりに === を使用
- 5. JSLint を使用する
- 6. スクリプトはページの下部に配置する必要があります
- 7. 文字列を作成する最も簡単な方法
- 8. コードにコメントを追加する
- 9. テンプレート リテラルを利用する
- 10. ループのイテレータと for …
- 11. new Object() の代わりに {} を使用する
- 12. コードに let と const を入れることを検討する
- 13. eval() は良い考えではない
- 14. Spread Operator が便利
- 15. await と async
- 16. Javascript で includes() メソッドを使用する
- 17. Splice を使用して配列からアイテムを削除する
- 18. アロー機能を活用する
- 19. Destructuring を使用すると、変数値をすばやく割り当てることができます
- 20. いくつかのプロジェクトを作る
- まとめ
Web 開発に興味を持ったことがある人なら、おそらく JavaScript に出くわしたことがあるでしょう。 オブジェクト指向プログラミング言語は JavaScript です。 開発者はこれを使用して、Web ページのクライアント側 (フロント エンド) を動的かつインタラクティブにすることができます。
また、HTML と CSS を使用して Web ページと Web アプリを作成するためにも使用されます。 現在、JavaScript コードのない Web ページはインターネット上にありません。 これは、開発者の仕事と切り離すことのできない側面になっています。
着実に増えているのも事実です。 JavaScript は Web ページに機能を提供することで最もよく知られていますが、JavaScript 以外の環境でも使用されています。 Node.js、Apache Couch-DB、および Adobe Acrobat は、これらのテクノロジの例です。 JavaScript を実行するために、ほとんどの最新の Web ブラウザーには組み込みの JavaScript 実行エンジンが含まれています。 Web 開発者として成功したい場合は、JavaScript に対処する必要があります。
今日か明日、それに取り組まなければなりません。 いざという時に備えて、事前に JavaScript を学んでおきましょう。
これが、このセッションで学べることです。 JavaScript を磨いて、仲間の Web 開発者の一歩先を行く方法を説明しています。
さぁ、始めよう!
1. 基礎知識の向上
あなたが子供の頃から聞いてきた、本当に基本的な考えと声明から始めましょう。 基礎を学び、実践してください。 多くの場合、コーディングでロジックを適用しますが、配列のスライスなどの組み込み関数が既にあることを忘れてしまいます。 JavaScript コードを実行すると、エラーが発生する可能性があり、その結果、多くの追加機能が動作しなくなります。
これは、単一のコロンまたは逆コンマが原因である可能性があります。 こうしたことは、基本的なことを理解していないために起こります。 XNUMX つのプログラムの中で、for、which、do while などの基本的なループが何度も使用されます。 ループは、最も基本的なプログラミング構造の XNUMX つです。
コーディングは非常に難しく、ループやその他の基礎に慣れていない場合は、企業で働くチャンスさえあります。 基本をブラッシュアップすることは非常に重要です。基本は、ソリューションの複雑なロジックと評判を発展させるための強固な基盤を提供するからです。
2. オブジェクト指向戦略を活用する
オブジェクト指向手法は、今日最もよく知られているプログラミング手法です。 C++ で始まったオブジェクト指向アプローチは、それ以来、非常に人気が高まっています。 現在、すべての主要言語を作成するためにオブジェクト指向プログラミングのみが使用されています。 オブジェクト指向戦略は、特定のオブジェクトに焦点を当てた戦略です。
その後、アイテムは基本的なエンティティになります。 次に、このオブジェクトを使用して、基本としてページに属性と機能を追加します。 関数やオブジェクトを使用せずに、コードを上から下に作成する従来の方法を使用することもできます。 これは広すぎるため、決して試みるべきではありません。 コードを開発するときは関数型アプローチを使用する必要があり、関数を利用する場合はオブジェクトを使用する必要があります。
したがって、最初は膨大なコードをオブジェクト指向のコードに変換するように努め、常にオブジェクト指向のスタイルでコードを記述してください。 他の人のコードを研究していると、常にオブジェクト指向の手法に目を向けることになります。 JavaScript をマスターしたいなら、それを手に入れるのが一番です。
3. 小さくても機能を活かす
関数型アプローチによるプログラミングは素晴らしい方法です。 なんで? ソフトウェアを、一緒に機能するが互いに異なるモジュールに分割します。 理解を助けるために例を挙げましょう。
整数の二乗平均平方根は、関数を使用して計算できます。 これを行うには、整数を XNUMX 乗し、それらの平均を計算してから、平均の平方根を計算する必要があります。 プロセスには XNUMX つのフェーズがあります。 その結果、XNUMX つの関数を使用できます。 しかし、ご覧のとおり、これらの機能はすべて相互に関連しています。 ある出力が別の出力に送られ、最終的な結果が得られます。
複数の要因に基づいて RMS を計算するには、XNUMX つの関数ではなく XNUMX つの関数が必要であると仮定しましょう。 ご覧のとおり、最終的な解決策は正しくありません。 この時点で、このような大規模なイベントで何が問題だったのかを判断するのは非常に困難です。
一方、XNUMX つの小さな関数を使用すると、分析を迅速に行うことができます。 その結果、関数がささやかなものであっても、それらを利用して個別のコード モジュールを定義します。 このテクニックは、魔法のような JavaScript エキスパートになるのに役立ちます。
それでは、JavaScript コーディングのヒントを見てみましょう。
4. == の代わりに === を使用
JavaScript には、厳密な等値演算子 === と !== と非厳密な等値演算子 == と != の XNUMX 種類の等値演算子があります。 比較するときは、常に正確な等価性を採用することがベスト プラクティスと見なされます。 ただし、== と != を使用する場合、異なる種類を扱うときに問題が発生します。
比較している値の型が異なる場合、厳密ではない演算子はそれらの値を強制しようとし、予期しない結果につながる可能性があります。
5. JSLint を使用する
Douglas Crockford は、デバッガーである JSLint を作成しました。 スクリプトをボックスに入れるだけで、バグや欠陥がないかすばやくスキャンされます。
JSLint は JavaScript ソース ファイルを調べます。 問題が発見されると、問題の説明とソース内のおおよその位置を含むメッセージが送信されます。 この問題は常に構文エラーとは限りませんが、頻繁に発生します。
JSLint は、文体の規範と構造上の問題の両方を調べます。 ソフトウェアが正確であることを意味するものではありません。 問題の検出を支援するために、別の目を追加するだけです。 スクリプトをサインオフする前に、JSLint を介してスクリプトを実行し、間違いがないことを確認してください。
6. スクリプトはページの下部に配置する必要があります
ユーザーの主な目的は、ページをできるだけ速くロードすることです。 完全なファイルがロードされるまで、ブラウザーはスクリプトのロードを続行できません。 その結果、ユーザーは進行状況を確認するために、より長く待つ必要があります。
機能を提供するためだけに使用される JS ファイルがある場合 (たとえば、ボタンが押されたとき)、ページの下部、終了 body タグの直前に配置します。 これは間違いなく最高の練習です。
7. 文字列を作成する最も簡単な方法
配列またはオブジェクトをループする必要がある場合は、信頼できる for ループ ステートメントを常に使用しないでください。 想像力を働かせて、目の前のタスクに対する最速の解決策を考え出してください。 数字を紹介するつもりはありません。 あなたは単に私を信頼する必要があります(または自分でテストしてください)。
これは、これまでで最も速いテクニックです。
8. コードにコメントを追加する
最初は無意味に思えるかもしれませんが、できるだけ頻繁にコードにコメントする必要があると私が言ったとき、私を信じてください. 数か月後にプロジェクトに戻ってきて、元の思考プロセスを思い出せない場合はどうしますか?
同僚の XNUMX 人がコードを更新する必要がある場合はどうすればよいでしょうか? コードの重要な領域は常にコメントする必要があります。
9. テンプレート リテラルを利用する
二重引用符または単一引用符で作成された文字列の制約は数多くあります。 作業をより簡単にするために、文字列の一部をテンプレート リテラルに置き換えることを選択できます。
バッククォート文字 (') は、テンプレート リテラルを作成するために使用されます。これには多くの利点があります。 それらを使用して、式を保存したり、複数行の文字列を作成したりできます。
ご覧のとおり、一重引用符または二重引用符で構築された従来の文字列リテラルとは異なり、テンプレート リテラルに繰り返し出入りする必要はありませんでした。 これにより、入力ミスの可能性が最小限に抑えられ、よりクリーンなコードを記述できるようになります。
10. ループのイテレータと for …
イテレータは JavaScript のオブジェクトで、next() メソッドを実装して、シーケンス内の次の値を格納するオブジェクトと、さらに値が残っているかどうかに応じて true または false を返します。 これは、反復子プロトコルを実装すると、独自の反復子オブジェクトを構築できることを意味します。
JavaScript には、String、Array、Map などの組み込みイテレータがいくつかあります。 for … of ループを使用して、それらを反復処理できます。 通常の for ループと比較すると、これはより簡潔で、エラーが発生しにくくなっています。 for…of ループを使用して、配列の完全な長さや現在のインデックスを追跡する必要はありません。 ネストされたループを設計する場合、これはコードを簡素化するのに役立つ場合があります。
11. new Object() の代わりに {} を使用する
JavaScript では、さまざまな方法でオブジェクトを作成できます。 示されているように、新しいコンストラクターを使用することは、より従来の方法です。 一方、この戦略は「貧弱な実践」としてマークされています。
破壊的ではありませんが、少し冗長でユニークです。 代わりに、オブジェクト リテラル手法を使用することを提案します。
12. コードに let と const を入れることを検討する
let キーワードを使用して、独自のブロックをスコープとするローカル変数を作成できます。 const キーワードを使用して、変更できないローカル ブロック スコープ変数を作成できます。
変数を宣言するときは、該当する場合は let および const キーワードを使用することを検討する必要があります。 const キーワードは再割り当てのみを無効にすることに注意してください。 変数を変更不可にすることもありません。
13. eval() は良い考えではない
eval() メソッドを使用すると、JavaScript のコンパイラにアクセスできます。 基本的に、 eval を使用して文字列の結果を入力 () として提供することで実行できます。
これにより、スクリプトの速度が大幅に低下するだけでなく、渡されたテキストに過度の権限が与えられるため、重大なセキュリティ上の懸念が生じます。 絶対に避けてください!
14. Spread Operator が便利
配列内のすべての項目を個々の要素として別の関数に送信する必要があったことはありますか? または、ある配列のすべての値を別の配列に入れる必要がありますか? これはまさにスプレッド演算子 (…) によって達成できることです。 これがイラストです。
15. await と async
明示的または暗黙的に常に promise を返す async キーワードを使用して、非同期関数を作成します。
await キーワードを非同期関数で使用して、返す promise の解決が完了するまで実行を停止できます。 非同期関数の外では、コードは引き続き正常に実行されます。
16. Javascript で includes() メソッドを使用する
JavaScript では、 includes() 関数は、指定された文字が文字列に含まれているかどうか、または指定された要素が配列に含まれているかどうかを判断します。
文字列または要素が検出された場合、このメソッドは true を返します。 それ以外の場合は false を返します。 Strings の contains() 関数では大文字と小文字が区別されることに注意してください。 大文字と小文字に関係なく文字列を一致させたい場合は、最初にターゲット テキストを小文字にします。
17. Splice を使用して配列からアイテムを削除する
配列から項目を削除するために、開発者が削除機能を利用するのを見てきました。 これは、オブジェクトを削除するのではなく、delete メソッドがオブジェクトを undefined に置き換えるため、誤りです。
JavaScript で値に応じて配列から要素を削除する最も簡単な方法は、indexOf() 関数を使用して配列内のその値のインデックス番号を取得し、splice() メソッドでそのインデックス値を削除することです。
18. アロー機能を活用する
アロー関数は、JavaScript に追加されたばかりのもう XNUMX つの重要な機能です。
彼らにはたくさんの利点があります。 まず第一に、これらは JavaScript の機能部分を視覚的に魅力的にし、書きやすくします。 ただし、アロー関数を使用すると、これがはるかに読みやすく簡潔になります。
19. Destructuring を使用すると、変数値をすばやく割り当てることができます
この投稿の前半で、JavaScript のスプレッド演算子について学びました。 構造化解除は、配列内に含まれるデータもアンパックするという点で、構造化解除に似ています。
違いは、これらのアンパックされた値を個別の変数に割り当てることができることです。 構文は、配列を形成するときの [] ショートカットの構文と同じです。 ただし、今回は代入演算子の左側に括弧が配置されています。 これがイラストです。
20. いくつかのプロジェクトを作る
どんな才能でも一貫した練習が必要なので、さまざまなプロジェクトを構築して能力を磨き、さまざまなプログラミング シナリオで専門知識を得るようにしてください。
プロジェクトに取り組んでいる間、いくつかの課題や失敗を経験し、必要な専門知識を得ることができます。 ですから、プロジェクトを思いつくようにしてください。インターネット上には、役立つアイデアや例がたくさんあります。 コードの開発を続けると、能力が向上します。
まとめ
JavaScript のようなコンピューター言語を学ぶのは難しいかもしれません。 優れたプログラマーになり、最初の仕事を確保することを真剣に考えている場合、これらの JavaScript 学習戦略は学習プロセスをスピードアップするのに役立ちます。
定期的にコーディングを練習し、新しいアイデアを学びながら徹底的にメモを取り、アクセス可能なすべてのツールを活用してください。 何よりも、楽しみながらコーディングを始めてください。
コメントを残す