JavaScriptはその誕生以来物議を醸していますが、それは今日のWEBプログラミングの主流言語になることに影響を与えていません。元の JavaScript は、ブラウザー側でデータ対話、画面レンダリング、セッション認証などの動的な機能を提供するように設計されていましたが、現在では、node.js の人気により、JavaScript がサーバー側にも拡張されています。
弱い型指定のスクリプト言語であるため、JavaScript の構文は複雑ではありません。Web 開発を行うかどうかにかかわらず、この時代のプログラマーとして JavaScript に精通していることは有益です。ということで、今日はJavaScriptについてしっかりと理解していきましょう！
JavaScript は動的スクリプト言語であり、特に Web アプリケーション開発に使用されます。その主な機能は、ページに動的な動作効果を追加することです。具体的には、次のとおりです。
JavaScript スクリプトの実行は、主に主要なブラウザ メーカーが独自に開発した解析エンジンを通じて実装されます。既存の主流の JavaScript 解析エンジンには主に、Chrome の V8 エンジン、IE9 の JS エンジン、Firefox の TraceMonkey があります。
JavaScript 開発では、直接使用できる VS に似た IDE を使用することに慣れていますが、JavaScript 自体は " 軽量」言語なので、開発とデバッグには簡単なテキストエディターとJavaScript解析エンジンだけが必要です。
もちろん、Windows のメモ帳や Linux の Vim エディターを使用することもできますが、構文の強調表示や自動補完などの便利な機能がたくさんある専用のコード エディターを使用することをお勧めします。ここで使用するテキスト エディターは nodepad++ で、付属のデバッガーは単純な Firefox です。もちろん、nodepad++ は複数のブラウザーのデバッグをサポートしているため、IE、Chrome、さらには Safri も使用できます。
Notepad++ の [実行] メニューで、デバッグ JavaScript スクリプトを実行するブラウザを選択するか、上記のショートカット キーを使用できます。
次に、非常に簡単な JavaScript スクリプトを提供し、それに関連する知識ポイントを 1 つずつ説明します。
最初は JavaScript スクリプトです: program.js、最初にコードの一部を見てみましょう:
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>document.writeln('');<br /> </li><li>document.writeln("Hello, world!");<br /></li><li>var a = 100000000000000000000e400;<br /></li><li>if (a < Infinity)<br /></li><li>{<br /></li><li>document.writeln(a);<br /></li><li>document.writeln('a less than Infinity, 3Q~~');<br /></li><li>}<br /></li><li>else<br /></li><li>{<br /></li><li>document.writeln(a);<br /></li><li>document.write('Sorry, a more than Infinity!\n');<br /></li><li>} </li></ol><ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>var a = 10, b = 9;<br /> </li><li><br /></li><li>document.writeln(a);<br /></li><li><br /></li><li>function add(x,y)<br /></li><li>{<br /></li><li>return x + y;<br /></li><li>}<br /></li><li><br /></li><li>function subtract(x,y)<br /></li><li>{<br /></li><li>return x - y;<br /></li><li>}<br /></li><li><br /></li><li>document.writeln(add(a,b)); </li></ol><ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>document.writeln("Global Object...");<br /> </li><li>var MyObj = {};<br /></li><li><br /></li><li>MyObj.member = {'first-name': "Alice", last_name : "Winston"};<br /></li><li><br /></li><li>MyObj.record = {<br /></li><li>airline: 'T2B',<br /></li><li>number: 777,<br /></li><li>departure: {<br /></li><li>Date:"Sunday",<br /></li><li>Time:"2015-11-01",<br /></li><li>City:"Taiwan"<br /></li><li>},<br /></li><li>arrival: {<br /></li><li>Date:'Monday',<br /></li><li>Time:"2015-11-02",<br /></li><li>City:"Beijing"<br /></li><li>}<br /></li><li><br /></li><li>};<br /></li><li><br /></li><li>document.writeln("Retrive a non-exit attribute value ..exa..MyObj.people..");<br /></li><li>document.writeln(MyObj.people);<br /></li><li><br /></li><li>document.writeln("typeof MyObj.member is ...");<br /></li><li>document.writeln(typeof MyObj.member);<br /></li><li><br /></li><li>document.writeln("MyObj.record.number is ...");<br /></li><li>document.writeln(typeof MyObj.record.number);<br /></li><li><br /></li><li>document.writeln('MyObj.record.airline is ...');<br /></li><li>document.writeln(typeof MyObj.record.airline); </li></ol>JavaScript の単純なデータ型には、数値、文字列、ブール値、null 値、および未定義の値が含まれます。その他の値は、配列、関数、正規表現などのオブジェクトです。簡単に言えば、JavaScript のオブジェクトは変更可能なキー付きコレクションです。オブジェクトはさまざまな属性で構成されます。属性の名前には空の文字列を含む任意の文字列を指定でき、属性値には未定義を除く任意の値を指定できます。
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li>//对象属性值的更新<br /> </li><li>document.writeln('Attribute value update...');<br /></li><li>document.writeln(' Once Date is ' + typeof MyObj.record.departure.date);<br /></li><li><br /></li><li>MyObj.record.departure.Date = 'Saturday';<br /></li><li><br /></li><li>document.writeln(MyObj.record.departure.Date);<br /></li><li><br /></li><li>//对象枚举<br /></li><li>document.writeln('Object enume...')<br /></li><li>var name;<br /></li><li>for (name in MyObj.record)<br /></li><li>{<br /></li><li>document.writeln(name + ':' + MyObj.record[name]); </li></ol>5 行目は、既存の属性を直接更新します。属性のキーと値のペアを作成します。
行 9 は、オブジェクトのすべてのプロパティの列挙を示しています。for-in 構造を使用して、すべてのプロパティ (関数およびプロトタイプのプロパティを含む) を列挙できます。必ずしも順番通りではないので、一般的には for() の形式でトラバーサル メソッドを指定しますです。
<ol style="margin:0 1px 0 0px;padding-left:40px;" start="1" class="dp-css"><li><strong style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-style:initial;border-color:initial;"><html><br /> </li><li><strong style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-style:initial;border-color:initial;"><body><br /> </li><li><strong style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-style:initial;border-color:initial;"><pre class="brush:php;toolbar:false"><br /> </li><li><strong style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-style:initial;border-color:initial;"> <br /> </li><li><strong style="margin-top:0px;margin-right:0px;margin-bottom:0px;margin-left:0px;padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;border-top-width:0px;border-right-width:0px;border-bottom-width:0px;border-left-width:0px;border-style:initial;border-color:initial;">