09 | 2017/10 |  11

  1. 無料サーバー

User forum-FC2BLOG-Info-Edit Template-Post-Edit-Upload-LogOut

CSSやJavascript自習の苦闘史を綴っていきたい。恐縮ですがJavascriptを有効にしてご覧ください。
2005年12月から社会問題も掲載!

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

 

jQueryに学ぶJavascriptの基礎(5) 論理演算子の使い方──jQuery解読(23)

別に難しいことではない・・・と最初は思いこむ

論理演算子( && 、 || 、! )は Javascript 初心者でも特に理解に苦しむ演算子ではありません。その機能は「 及び、又は、そして否定 」と直ぐに理解できてしまいます。

さて、入門書 や著名な Web Site には例えば次のように書いてあります。

「 論理演算子は右側と左側の条件式を評価して、・・・。複数の条件式を評価するために良く用いられます。」( 出典:『JAVASCRIPT HANDBOOK 4th EDITION』p.32 )

「exp1 が真、かつ、exp2 が真であれば真を、さもなければ偽を返します。」

「 exp1 が真、または、exp2 が真であれば真を返します。」( 出典:とほほのJavascript入門・・・演算子

※ ここに exp とは expression の略であり、expression が「数式」を意味することは、改めて説明するまでもないでしょう。

初心者は、このような文章を読んで学習する訳ですが、誰しも「 条件式や数式 」から、= や != が含まれる式を左右のオペランドにするのだ、と理解します。そして以下のような「 数式 」が例示されるのを見て、論理積演算子と論理和演算子を理解し、十分に納得したと錯覚してしまうのです。

  • (a > b) || (c != d) 、 (a = 3) && (b => 3)
  • (xx == "ABC") || (xx == "abc")

そもそも「式とは何か?」──このことをきちんと説明してから「条件式」なり exp なりの単語を使ってくれていれば、以下に述べるように「 四則演算のような算術式だけが論理演算子の対象となるのではない 」ということを、誤解なく理解するのです。

しかし Javascript でいう「式」とは何か、これについて上述の2つの文章では触れていません。このことが初心者に謝った認識を与えてしまうのだと思います。

特に「 条件式 」という表現は全く戴けません。この言葉では「 オペランドは条件を定めた式である 」と完璧に誤解されます。比較式や等式が左右に来るのだと錯覚してしまいます。

▲ToTop

見たこともない論理演算子の使い方の出現

さて、jQuery.js の各行に目を凝らすと、これまで見たこともない論理演算子の使い方に遭遇し、俄に戸惑います。── && が「及び」であり、|| が「又は」である、あるいはオペランドは条件式──、というそれまでの認識だけでは、全く理解できない論理演算子の使い方が多数あるからです。

その例を jQuery.1.2.1.js からいくつか抽出してみます。行頭の数字はjsファイルにおける行数です。

  1. 36 selector = selector || document;
  2. 72 return this.setArray(
    74   selector.constructor == Array && selector ||
    78   (selector.jquery || selector.length && selector != window &&
           !selector.nodeType && selector[0] != undefined && selector[0].nodeType) &&
            jQuery.makeArray( selector ) ||
    81   [ selector ] )
  3. 132 return this.length && jQuery[ type || "attr" ]( this[0], key ) || undefined;
  4. 284 t.constructor == String ?
    285  jQuery(t).get() :
    286  t.length != undefined && (!t.nodeName || jQuery.nodeName(t, "form")) ?
    287  t : [t] )

以上のそれぞれについて説明するのは長大な文章が必要となるのでやめます。

大切なことは、「式」の意味と 上の例のような論理演算子の使い方の基礎となる 論理演算子の定義づけです。

なお、以降に記すことは全て David Flanagan著、村上列訳の『Javascript 第5版』を読んで学んだことです。

▲ToTop

式 とは何か?

それは「Javascriptインタプリタが評価して値を生成できるもの」──『Javascript第5版』にはそう書いてあります。そして極めて簡潔・明瞭・網羅的に例示があります。それを見て初めて、式とは何かが理解できました。

その結果、論理演算子の左右のオペランドに置くことの出来る式とは、四則演算的な算術式だけではなく、数値、文字列、論理値、オブジェクトリテラル、配列リテラル、変数、関数リテラルなど、まさに値を生成できるオブジュクトならば何でもござれ、であることが十分かつ確実に理解できました。

以上の理解を経て、jQuery.js で多用されている 「 オブジェクトを左右のオペランドとする 」 論理演算子の使い方と意味が、やっと判読できるようになったのです。

演算子の優先順位(抜粋)

論理演算子を利用する上で、演算子の優先順位をきちんと理解しておかないと、意図と異なる結果となってしまいます。自戒を込めて強調しなければならない、と思います。

そこで、優先順位を間違いやすい演算子の正しい優先順位を、今後のためにも記しておきます。

左側ほど優先順位が高い演算子となります。つまりより左側の演算子が先にインタプリタに処理されることになります。

++ -- 算術演算子 == != === !== && ||  ?: = ,

論理演算子の使い方をオーソドックスなコードに置き換えて理解する

そうすることで理解を確実なものに出来ると思います。

以下において obj はオブジェクトの、v は変数の意です。

  1. v = obj1 && obj2; ─→ if (obj1) v = obj2; else v = undefined;
  2. v = obj1 == obj2 && obj3 || obj4;
    ─→ if (obj1 == obj2) { if (obj3) v = obj3; else v = obj4; }
       else v = false;
  3. v = obj1 || obj2 || obj3; 
    ─→ if (obj1) v = obj1;
       else if (obj2) v = obj2;
       else if (obj3) v = obj3;
       else v = undefined;

 

■ コメントの投稿 ■

管理者にだけ表示を許可する

●トラックバック●

■トラックバックURLはこちら■
http://hkom.blog1.fc2.com/tb.php/601-09cb2546

●参照元一覧●

<provided Fc2>
<provided i2i>

▲ToTop

 90%近いシェアを握っているインターネットエクスプローラの描画エンジンを利用したタブbrowser。沢山のタブbrowserがあるが、多機能、カスタマイズフリー、スクリプト利用等で一日の長がある。Gekkoエンジンへの対応も行われ、IEからの自立独立の方向に向かっている。2005年7月にはIE7が登場する見通しの中で、今後の発展が望まれる。

 多様なCSS作成支援機能を備えた、タグ入力式 HTML&CSS作成支援エディタ。スキンデザインもすっきりしている。テキストエディター上で作成するよりも確実で安全にタグ打ちが出来る。
文字コードを選べないのが欠点。

 StyleNote同様のタグ入力式 HTML&CSS 作成支援エディタ。長年使用してきたが現在StyleNoteに乗り換えつつある。

 クリップボード履歴情報を活用する為のソフト。画像まで履歴を取ってくれるのが嬉しい。このソフトを使わない日は絶対ない程に重宝し、愛用している。

 起動中のウィンドウの「コピーできない」説明文などの文字列を取得し、コピー可能な文字データにするツール。何かと便利。

 ストリーミングデータを保存することが出来るソフト。動画利用には不可欠なソフトだ。

 無料ながらレイヤー機能を有し、スクリプトによる拡張も可能な、sleipnir作者が提供している優れもの画像編集ソフト。

 画面キャプチャソフトと言えばこれに勝るものなし、ではないだろうか? 様々な取得方法を有しており、ブログ作成にもHomepage作成に不可欠だ。Jtrimと並んでWoodyBellsの作品。

 複数ファイルの同時編集は出来ないが、透過pngも作れる画像編集ソフト。
(以下当該サイトから抜粋)初心者にも簡単に操作が出来るフォトレタッチソフトです。多くの加工機能で画像に様々な効果を与えることができます。非常に軽快に動作するため、ストレスなく操作できます。

 Animation Gifファイルを作れる無料ソフト。

 キャプチャソフト。画面内にサイト全体が表示しきれない場合でも、これを使えば全体をキャプチャすることが出来る。

 画像処理。画像のフォーマット変換のみならず、色数やサイズ、圧縮率の変更まで一括処理できてしまう『BatchGOO!』は、大量の画像をまとめて処理したいときに大変便利なソフト。BMP, TIFF, JPEG, PCX, PNG の相互変換をはじめ、色数・サイズ・解像度の統一、JPEG圧縮率の調節など、ホームページ用の画像や携帯電話用の壁紙を揃えるのに抜群の相性を見せる。(Vectorの当該ソフト紹介頁より抜粋引用)

 名前から直ぐに想像が付くように画像のサイズを測るためのソフトだ。Homepage作成には欠かせない。2カラム、3カラムのレイアウトを行う場合に大変重宝する。

 ランチャーソフトは沢山あるが、中でもこれが一押しだ。2年以上使ってきたがその操作性には毎日満足している。これを使い始めてからデスクトップには一切のアイコンを表示することをやめてしまった。

 AdobeReader7によって、起動時間が長すぎるという長年のユーザーの不満はある程度解消した。そのためこの高速化ソフトは存在価値が低下してしまったかもしれない。AdobeReader6迄はこのソフトによる起動高速化で恩恵を受けてきた。

 IE専用が難点だが、様々なサイト内でIDやパスワードを入力するのに重宝するソフト。コンテキストメニューから簡単に起動できるのがGood! sleipnir等のIEの描画エンジンを利用しているブラウザでも使える。

 利用しているパソコンの諸元値を取得するには、このソフトがベストだ。インストール済みソフトの一覧が取得できるのも嬉しい。

 WMPは機能が豊富なだけ重い。RealPlayerも同様だ。そこでMedia Player Classicを使いたい。動作が軽快なだけではなく、対応しているファイル形式もすこぶる多く、これひとつで、wmvもrmも表示できてしまうのだから凄い! 数多あるMedia Playerの王様と言えるだろう。

 自宅でPCを起動しているときには必ず起動しているメディアプレーヤー。何かと過剰なWinampよりも、起動も速くスキンはシンプルだ。

 DivX, Xvid, Mov, Vob, Mpeg, Mpeg4, avi, wmv, dv, などの動画をDVD-Video形式に変換できるフリーソフト。クリックするとDVD関連ソフト紹介サイト=「DVDなToolたち」なるHomepageが開きます。

----------
200712161534
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。