Javascript学習本おすすめ_JavaScriptスキル

アーロン・グスタフソン著、李松峰、李亜文ほか訳。間違いなく読む価値のある本だと思います。興味のあるお友達は覗いてみてはいかがでしょうか。以下は、JavaScript の一般的な落とし穴と、そこから抽出したオブジェクトの概念をまとめたものです。皆様にとって少しでもお役に立てれば幸いです。

Ø Javascript 構文のよくある罠

² 大文字と小文字の区別

² 実際には、一重引用符と二重引用符の間に特別な違いはありません。この本を読んで知りましたが、プログラムを書くときに '' という文字列形式を書いたことはありましたが、「ああ、こんなこともできるんだな」とは初めて知りました。ほとんどの場合、文字列を表すために '' が使用されます。これは、XHTML 仕様では、すべての XHTML 属性値を "" で囲む必要があるためです。これにより、コードを混合するときに明確になります。

² 改行。これを無視しないでください。なぜなら、キャリッジ リターンを使用して文字列内で改行を行うと、ブラウザは、申し訳ありませんが、その文字列を認識できないと通知するでしょう。キャリッジリターンを自動的に「;」に変換するためですが、幸いなことに、この問題を解決するために、エスケープ文字が代わりに提供されます。以下に示すように:

var='
リスト

1. 
   '
   

プラス記号を使用できると言う人もいますが、私はそれを知っています。文字列演算子としてプラス記号を使用します。最下層が番号をリロードしたと推定されます (?!)。

² セミコロンと中括弧は省略可能

信じられない場合は、大丈夫と言わせてください。このJavaScriptはかなり賢いと言えるでしょう。しかし、前述の本の著者と同じように、私たちプログラマーはもっと規律を持ったほうが良いと思います。

² オーバーロード

時々、思いつきで JavaScript のオーバーロード関数を作成すると、現時点では最後の関数のみが実行可能で、前の関数は受け入れられないことがわかります。 。 チャンス。その理由は何でしょうか?

前のなんとかが後のものに置き換えられていることがわかりました。これは一般にカバレッジと呼ばれます。さらに、プログラムはスコープ チェーン内の同じ名前を持つ最後の関数のみを参照します。

² 匿名関数

この人は非常に便利だと言わざるを得ません。

² スコープの解決と終了

どのプログラミング言語にもそのような概念があるため、このスコープについては誰もがよく知っていると思います。

スコープ チェーンは、変数の値 (または関数の呼び出し時に使用されるメソッド) を決定できるパスを記述するために使用されます。

クロージャーは概念です。スコープに関連しており、外部関数が実行を完了して終了した後でも、内部関数がその外部関数のプロパティにアクセスできるという事実を指します。変数またはメソッドが参照されると、JavaScript はオブジェクトの実行パスによって形成されるスコープ チェーンに沿って解析し、最後に定義された変数の値を探します。見つかると、その値が使用されます。

² Iterable オブジェクト

これをうまく使用しないとエラーが発生する可能性があることを疑ってはいけません。信じられない場合は、次の例を見てください:

var all=document.getElementsByTagName('*');

for(i in all){

//すべての[i]要素が動作します。

}

返される値はそれぞれ length、item、namedItem と等しいため、コード内で予期しないエラーが発生する可能性があります。

現時点では何かを行う必要があります。プロパティのフィルタリングには hasOwnProperty を使用します。この関数は、オブジェクトのプロパティまたはメソッドが継承されていない場合に true を返します。メソッドは次のとおりです。

var all=document.getElementsByTagName('*');

for(i in all){

if(!all.hasOwnProperty( i)) {Continue;}

//すべての [i] 要素に対する操作。

}


² 関数の呼び出しと参照。
注意してください、これは異なります。呼び出しは実行され、参照は変数へのコピーを与えるだけです (これは理解できるようですね?)

これを見てください:

var foo=exampleFunction();

var foo=exampleFunction;

この 2 つの文パターンは異なります。前者は関数 exampleFunction を実行して戻り値を変数 foo に代入し、後者は関数 exampleFunction の参照を foo に代入します。


Ø Javascript オブジェクト
プロパティとメソッドの概念は誰もが知っていると思います。 JavaScript のオブジェクトとその不思議な意味について話しましょう (格闘技のようなものです)。

1. 継承

JavaScript の継承というと不思議な気がしますが、よく考えてみると当然のことです。そしてそれは他の人たちと同じ考えです。実際、JavaScript はコピー操作を実行するだけです。早速、例を見てみましょう。誰もが理解できると思います。

//人物オブジェクトのインスタンスを作成します

var person={};

person.getName=function(){……}; person.getAge=function(){……};

//従業員オブジェクトのインスタンスを作成します

varemployee={};

employee.getTitle=function( ){……};

enployee.getSalary=function(){……};
//person オブジェクトからメソッドを継承します

employee.getName=person.getName;

employ.getAge=person.getAge;

2. 独自のオブジェクトを作成する

独自のオブジェクトを作成するには 2 つの方法があります。

way :var myObject =new Object();

2 番目のタイプ: var myObject={};//は、1 番目のタイプの省略形です。実際、上記でも使われていました。

3. コンストラクターを作成します

最初のタイプ: function myConstructor(a){

//コード

}

, 少し大げさですが、上記の JavaScript のいたるところにオブジェクトがあると想像してください。この関数は一度に 1 つのオブジェクトです。

2 番目のタイプ:

おそらく賢明な読者は、これらが他の 2 つのタイプの関数定義であることをすでに推測しているでしょう:

var myConstructor=function(a){}; 🎜>
3 番目のメソッドも一緒に書きましょう: var myConstructor=new Function('a',/*some code*/);

ただし、このメソッドではパフォーマンスの問題が発生するため、関数を使用する方が適切です。

最後に、本の例を示します。

function myConstructor(message){

alert(message);

this.myMessage=message ;

}

var myObject =new myConstructor('Instantiating myObject!');

4. 静的メソッド

var myObject={} を追加します。

//属性を追加

myObject.name=”Jeff”;

//メソッドを追加

myObject.alertName=function(){

alert(this.name);

}

//実行メソッド

myObject.alertName(); 誰でもできると思いますそれを理解してください、それ以上はありません。

5. プロトタイプにパブリックメソッドを追加したい

パブリックメソッドを追加する方法は、プロトタイプを使用することです。ここでのプロトタイプは js ライブラリではないことに注意してください。

// コンストラクターを作成します

function myConstructor(message){

this.myMessage=message; >}

//パブリック メソッドを追加します

myConstructor.prototype.clearMessage=function(string){

this.myMessage ='' string; >}

ここで注意すべき点は、コンストラクター内の var で始まる変数はすべてプライベート変数であるということです。 . やプロトタイプで追加されず、コンストラクターに直接書き込まれる変数はプライベート関数です。

6. 最後に、オブジェクト リテラルについて触れておきます。

オブジェクト リテラルは、コードの再構築と冗長性の削減に非常に役立ちます。したがって、可能であれば、この

を使用するのが最善です。次の例を見てください:

var myObject={

propertyA:'value',

propertyB :'value',

methodA:function(){}

}

著者の意見に同意せざるを得ません。このメソッドは非常にエレガントです。

どうですか？ Javascript のオブジェクトとトラップについての基本的な理解はありますか?この記事がお役に立てば幸いです。