ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript学習ノート 旅の記録_基礎知識

JavaScript学習ノート 旅の記録_基礎知識

WBOY
リリース: 2016-05-16 17:53:29
オリジナル
1012 人が閲覧しました

1. JavaScript とは何ですか?
(1) HTML は Web ページの外観を記述する単なるマークアップ言語です。テキスト ボックスが空かどうかの判断、2 つのパスワードが入力されているかどうかの判断など)一貫性)ストアがサーバー側で実行すると、Web ページは非常に遅くなり、使いにくくなり、サーバーに多大な負荷がかかります。そのため、判断するにはブラウザ上でいくつかの簡単な操作を行う必要がありますが、JavaScriptはブラウザ側で実行される言語です。
(2) JavaScript と Java には直接的な関係はありません。唯一の関係は、JavaScript が元々 LiveScript と呼ばれ、後に JavaScript が JS と呼ばれることがあるということです。
(3) JavaScript はインタプリタ言語なので、コンパイルしなくてもいつでも実行できます。このように、文法エラーがあっても、文法エラーのない部分は正しく実行されます。
JS開発環境
(1) VSにおけるJavaScriptとJqeryのオートコンプリート機能。
(2) JS は非常に柔軟な動的言語であり、C# などの静的言語ほど厳密ではありません。
JS 入門
(1)

コードをコピー コードは次のとおりです:

< ;script type="text/javascript">
alert(new Date().toLocaleDateString());

(2) JavaScript コードは、<script> タグ内に配置されます。<script> は、<head>、<body> などの任意の位置に配置でき、複数の <script> タグを配置できます。アラート関数はポップアップメッセージウィンドウで、new Date()はDateクラスのオブジェクトを作成するもので、デフォルト値は現在時刻です。 <BR>(3) <head> に配置された <script> はボディがロードされる前に実行されており、ボディに記述された <script> はページのロード時に 1 つずつ実行されます。 <BR>(4) ページ内で JavaScript を宣言するだけでなく、JavaScript を別の JS ファイルに記述してページに導入することもできます: <script src=”common.js” type=”text/javascript ” ></スクリプト>。別の JS ファイルに宣言する利点は、複数のページを共有できるため、ネットワーク トラフィックが軽減されることです。 <BR>イベント<BR>(1) <a href="javascript:alert('Hello')">クリックしてください</a> <BR><a href="javascript:void(0)" &gt ;何もポップアップしません</a><br /> <BR><a href="JSoop.htm" onclick="alert('本当にジャンプしますか?')"> Click me</a>(2) JavaScript には、ボタンがクリックされたときのイベントの概念もあります<BR>1) <input type="button" value="Click me" onclick=" アラート('最後にクリックしました')" /> <BR>2) ハイパーリンクの href 内の JavaScript のみが "JavaScript:" を必要とします。これはイベントではなく、"JavaScript:" を "http:" のように扱うためです。 「ftp:」、「thunder://」、ed2k://、mailto:// は同じネットワーク プロトコルであり、JS 解析エンジンによって処理されます。href <BR>JS 変数 < にはこの特別な列のみがあります。 🎜>(1) JavaScript では二重引用符または一重引用符を使用して文字列を宣言できます。これは、主に HTML との統合を容易にし、エスケープ文字の問題を回避するためです。名前 i は整数 10 を指します。10 を指すと、i は int 型になります。alert(i)(3) JavaScript には null と underfined の 2 つの型があり、null は値を表します。変数が空の場合、定義されていないことは、変数がどのオブジェクトも指しておらず、初期化されていないことを意味します。変数は int i=10 のみを表すことができます。 var i=10 を通じて宣言される; C# の var とは異なり、C# のような型推論ではありません <BR>(5) JavaScript では、変数を宣言する代わりに var を直接使用することもできます。本当にグローバルに使用したい場合を除き、変数を使用します。そうでない場合は、使用するときに var を追加するのが最善です。<BR>(6) JS は動的に型指定されるため、var i=10;i="abc" は有効です。 JavaScript <BR>(1) <BR><BR><BR><BR><BR>コードをコピー<BR><BR><BR> コードは次のとおりです:<div class="codetitle"><span> <a style="CURSOR: pointer" data="52104" class="copybut" id="copybut52104" onclick="doCopy('code52104')">var sum = 0; <U>for (var i = 0; i <= 100; i ) { sum = sum i; alert(sum); >(2) JavaScript のコードに構文がある場合 エラーが発生した場合、ブラウザにエラー メッセージが表示されます。エラー メッセージを確認すると、エラーのトラブルシューティングに役立ちます。 (3) JavaScript のデバッグ。VS を使用すると、JavaScript を簡単にデバッグできます。デバッグするときは、いくつかの点に注意する必要があります。1) IE のデバッグ オプションをオンにし、インターネット オプション - 詳細設定を削除し、「スクリプトを無効にする」を削除します。デバッグ」の前のボックスにチェックを入れます。 <div class="codebody" id="code52104">2) インターフェースをデバッグモードで実行します。 <BR>3) ブレークポイントの設定、変数の監視、その他の操作は C# と同じです。 <BR>変数の初期化の判定<BR>(1) JavaScriptで変数やパラメータが初期化されているかどうかを判定する3つの方法。 <BR><BR><BR><BR>コードをコピー<BR><BR><BR> コードは次のとおりです:<BR><div class="codebody" id="code30078"> <BR>var r; <BR>if (r == null) { if (typeof (r) == "未定義") { if (!x) { <BR>alert("null"); ("未定義");alert("Not 🎜>(1) JavaScript での関数の宣言方法: <BR><BR><BR><BR> コードをコピー <BR><BR><BR> <BR><div class="codetitle"> <span> function Add(i1, i2) { <a style="CURSOR: pointer" data="69599" class="copybut" id="copybut69599" onclick="doCopy('code69599')">return i1 i2>} <U> (2) 宣言する必要はありません。戻り値の型、パラメータの型、および関数定義は関数 <div class="codebody" id="code69599"><BR><BR>で始まります。コードをコピーします<BR><BR> コードは次のとおりです:<BR> <BR> <div class="codetitle">var r = Add(10, 20); <span>alert(r ); <a style="CURSOR: pointer" data="51036" class="copybut" id="copybut51036" onclick="doCopy('code51036')">var r = Add("tom,", "Hello"); <U> (3) JavaScript はすべてを必要としません。すべてのパスが戻り値を持ちます。 匿名関数(1) <div class="codebody" id="code51036"><BR><BR><BR><BR>コードをコピー<BR><BR> コードは次のとおりです:<BR><BR> <BR>var f1 = function sum(i1, i2) { <div class="codetitle">return i1 i2; <span>} <a style="CURSOR: pointer" data="33283" class="copybut" id="copybut33283" onclick="doCopy('code33283')">alert(f1(10, 20)); <U> (2) 同様C# の匿名関数に。 (3) この種の匿名の使用法は、Jquery で特に一般的です。 (4) <div class="codebody" id="code33283"><BR><BR><BR><BR>コードをコピー<BR><BR> コードは次のとおりです。<BR><BR> <BR>alert(function sum(i1 , i2) { <div class="codetitle">return i1 i2; <span>} (100, 10)); <a style="CURSOR: pointer" data="59986" class="copybut" id="copybut59986" onclick="doCopy('code59986')"><U> 注: C# の匿名関数はデリゲートを使用して呼び出されます。 JS オブジェクト指向の基礎(1) JavaScript にはクラス構文はありません。これは関数クロージャーによってシミュレートされます。以下の説明では、JavaScript の「クラス」ではクラスやコンストラクターなどの概念が使用されます。文字列や日付などを「オブジェクト」と呼び、JavaScriptではクラスを宣言します(クラスはクラスではなくオブジェクトです)。 (2) <div class="codebody" id="code59986"><BR><BR><BR><BR>コードをコピー<BR><BR> コードは次のとおりです。<BR><BR> <BR>function Person( name, age ) { //<div class="codetitle">this.Name = name; <span>this.SayHello = function () { <a style="CURSOR: pointer" data="79876" class="copybut" id="copybut79876" onclick="doCopy('code79876')">alert("Hello") を使用して関数をクラスとして宣言します、私は " this.Name "、私の年は: " this.Age "year old"); <U>} } var p1 = new Person("Han Yinglong", "23") ; p1 .SayHello(); <div class="codebody" id="code79876"> <BR>(3) 関数 person(name,age) は、コンストラクターの宣言と見なすこともできます。ユーザーによって動的に追加されます。 <BR>Array() オブジェクト <BR>(1) JavaScript の Array オブジェクトは配列です。まず動的配列であり、C# の配列 ArrayList や Hashtable などと同じように非常に複雑です。 <BR>(2) <BR><BR><BR><BR><BR>コードをコピーします<BR><BR> コードは次のとおりです。<BR><BR> <BR>var names = new Array( ); <BR>names[0] = "ハン・インロン"; <div class="codetitle">names[2] = "言った"; 0; i < names.length; i ) { <span>alert(names[i]); <a style="CURSOR: pointer" data="46764" class="copybut" id="copybut46764" onclick="doCopy('code46764')"><U> </U>(3) サイズを事前に設定する必要はありません。 </a>Array() 演習 1 </span>(1) 配列の演習、配列内の最大値を見つけます。 </div><div class="codebody" id="code46764"><BR><BR><BR>コードをコピー<BR><BR><BR> コードは次のとおりです:<BR><BR> </div><script type="text/javascript "> <BR>function MyMax(arr) { <BR>var max = arr[0]; <BR>for (var i = 0; i <arr.length; i ) { <BR>if (arr[ i] &gt ; max) { <div class="codetitle">max = <span>} } <a style="CURSOR: pointer" data="46100" class="copybut" id="copybut46100" onclick="doCopy('code46100')">return max; <U>var arr = new Array(); = 20; arr[2] = 34; Array( ) 演習 2 <div class="codebody" id="code46100">(1) 文字列配列 {3,9,5,34,54}{54,34.5.9.3} の要素の順序を逆にします。 JavaScript では reverse 関数を使用しないでください。 ヒント: i-th と length-i-1 を入れ替えて関数を定義します。 <BR><BR><BR><BR><BR>コードをコピー<BR><BR><BR> コードは次のとおりです:<BR><div class="codebody" id="code21533"> <BR><script type="text/javascript"> <BR>function MyReverse(arr) { <BR>for (var i = 0; i <arr.length / 2; i ) { <BR>var temp = arr[i]; <BR>arr[i] = arr[arr.length - i - 1]; <BR>arr[arr.length - i - 1] = temp; 🎜>} <BR>arr = new Array(); <BR>arr[0] = "3"; <BR>arr[1] = "9"; <BR>arr[3] = "34"; <BR>arr(arr); <BR>alert(arr); ><BR> <BR>Array() 演習 3 <BR>(1) Han Yinglong|Try|Order などの | 分割形式で文字列配列を出力します。 JavaScript では Join 関数を使用しないでください。arr.join(1) は区切り文字を使用して配列を文字列に結合します。 <BR><BR><BR><BR>コードをコピー<BR><BR><div class="codetitle"> コードは次のとおりです:<span><a style="CURSOR: pointer" data="95234" class="copybut" id="copybut95234" onclick="doCopy('code95234')"> <U><script type="text/javascript "> function MyJoin(arr) { if (arr.length <= 0) { return; } <div class="codebody" id="code95234">var s = arr[0]; <BR>for (var i = 1; i < arr.length; i ) { <BR>s = s "|" arr[i]>} <BR>return s; <BR>var arr = new Array( ); <BR>arr[0] = "ハン・インロン"; <BR>arr[2] = "注文"; )); <BR>//2 番目のメソッド<BR>alert(arr.join("|")); <BR><BR> <BR>配列の辞書の使用法(1 ) JS の配列は、配列だけでなく、ディクショナリやスタックも含めた宝物です。 <BR>(2) <BR><BR><BR><BR><BR>コードをコピーします<BR><BR><BR> コードは次のとおりです。<BR> <BR>var names = new Array( ); <BR>names["人"] = "ren"; <BR>names["hand"] = "翔"; alert(names ["人"]); <div class="codetitle">alert(names.人); <span>for (names の k) { <a style="CURSOR: pointer" data="47573" class="copybut" id="copybut47573" onclick="doCopy('code47573')">alert(k); 🎜>( 3) Hashtable や Dictionary と同じように使用すると、それらと同じくらい効率的です。 <U>Array() の簡略化された宣言(1) 配列には簡略化された方法もありますvar arr=[3,4,5,6,7] //通常の配列の初期化This Arrays names["人"]="ren"; の特殊なケース、つまりキーは 0,1,2,3,4,5 とみなすことができます (2) 辞書形式での簡易作成方法 <div class="codebody" id="code47573">var arr={”tom”=30,”jim=”30}; <BR>配列、for など<BR>(1) 配列スタイルの配列の場合、join メソッドを使用して配列を連結できます。弦。 <BR><BR><BR><BR><BR>コードをコピー<BR><BR><BR> コードは次のとおりです。<BR> <BR>var arr = ["tom", " jim", "kencery"]; <BR>alert(arr.join(",")); //JS の join は、文字列メソッドである .net とは異なり、配列メソッドです <BR><BR> <BR> (2 ) for ループは C# の foreach のように使用できます。 <BR><BR><BR><BR><div class="codetitle">コードをコピー<span><a style="CURSOR: pointer" data="90557" class="copybut" id="copybut90557" onclick="doCopy('code90557')"><U> コードは次のとおりです。 for (var e in document) { アラート (e); <div class="codebody" id="code90557">} <BR><BR><BR></script>
関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート