JavaScript DOMプログラミングアート学習ノート(一)

3714 ワード

ええ、一週間の時間を経て、今日はついに『JavaScript DOMプログラミングアート(第2版)』を読み終わりました.とても勉強になりました.作者や出版社などは知らないので、広告をするつもりはありません.でも、この本は確かに見る価値があります.まず、このような良い本を書いてくれたことに感謝します.ありがとうございます.本の中の内容は比較的に多くて、私は自分と他人に役立つと思う内容だけをメモしておきます.
まずコードで話しましょう.
下記は二段のこの本の中で繰り返し強調して通用する経典コードの段です.
1:相当な経典と実用性、特にページローディング関数のために複数の関数をバインドする必要がある場合
/**
 * [addLoadEvent                ]
 * @param {[function]} func [               ]
 */
function addLoadEvent(func)
{
    var oldonload=window.onload;
    if(typeof window.onload != 'function'){
        window.onload=func;
    }else{
        window.onload=function(){
            oldonload();
            func();
        }
    }
}
 
2:相当な経典と実用もあります.特に新しいラベル要素を挿入する時には
/**
 * [insertAfter                    ]
 * @param  {[DOMElement]} newElement    [         ]
 * @param  {[DOMElement]} targetElement [        ]
 */
function insertAfter(newElement,targetElement)
{
    var parent = targetElement.parentNode;
    if(parent.lastChild == targetElement){
        parent.appendChild(newElement);
    }else{
        parent.insertBefore(newElement,targetElement.nextSibling);
    }
}
 
第二の本の作者の絶えない強調の事
1)ブラウザ内のウェブページにとって本質的には三位一体の共同体であり、構造層、表示層、行動層はハイパーテキストマーク言語によって責任を負います.例えば、HTML;表現層はCSSが担当する.行動層はJavaScriptとDOMが担当しています.コードを書くには、できるだけ三層分離してそれぞれの責任を負わなければなりません.
 
2)コードを書いて、注意するところはたくさんあります.ウェブページのコードにとって、本書の作者は漸進的な強化、安定的な退化、三層の分離、簡明で読みやすく、抽象的に通用することを強調しています.三層に分かれていて、分かりやすくて、説明しなくてもいいです.分かりやすいです.抽象的な目的は汎用再使用のために、通常は不変の因子を可変の因子で代替することである.例えば、方法によって伝達されるパラメータは、ハードコードで方法体に書かれている可能性があるが、関数のパラメータになったら、この関数はより柔軟になる.
プログレッシブ:非常に重要なコードの原則ですが、このような意味です.ウェブページに対して、コードを書く時はいつも一番核心的な部分から、つまり内容から始めます.つまり、ウェブページの三層構造の中で、構造層は一番重要な層です.CSSは主にウェブページの表示様式を強化するために用いられます.JavaScriptとDOMは主にユーザーとウェブページの相互作用を実現するために用いられます.もちろん、何をするにもこのようなことがあると思います.主次をはっきりさせ、全体を把握し、重要なポイントをつかむことは何に対しても重要です.
安定退化:非常に重要なコードの書き方の原則でもあります.安定退化の重点は、漸進的に強化された原則でコードを書くことを堅持した上で、私達のプログラムがより丈夫で、より良い互換性を保証できます.ウェブページが完全に価値を失うとは限りません.コードに反映されるのは、まずブラウザが何らかの方法、属性などに対するサポート能力を判断し、次のステップに進むためです.
 
3)ウェブページに対してグラフィカルな評価が必要で、私達の目にはDOMは一本の木であり、一本の木であり、ドキュメントの各要素は木の中の各ノードに対応しています.このような観点からコードを書くと多くのものが容易になります.ドキュメントの中の元素の検索、修正、削除、置換、追加などの操作は非常にイメージ化されます.私たちは面白いおもちゃを遊ぶように、すべてがはっきりしています.目の前に置いて、CSSはカラーペンをプログラミングしました.JavaScriptはセンサーになりました.DOMは原料加工場です.
 
4)問題の分析と問題解決の鍵は、複雑化を簡略化し、分断し、段階的に一歩ずつ進んでいくことであり、まず問題解決の考えを一歩一歩ずつ整理し、少なくとも最も主要なのは非常に明確にし、その後簡単な核心機能を実現し、その後徐々にその能力を拡張して、安定的に退化させることである.そして抽象化して通用を再利用できるようにします.
 
5)問題を考えることは、それができるかどうかを考える以外に、それがすべき問題を考えるべきです.例えば、現在のCSSにもいくつかの事件を処理する機能があります.でも、このようなことはやはりJavaScript DOMに任せたほうがいいです.