フロントエンドJavaScript-day 01

7239 ワード

JavaScript歴史の回顧
1990年、ヨーロッパのボナス?李さんはブラウザを発明しました.写真を見てはいけません.1992年、NCSAは独立したブラウザを開発しました.Mosaicといいます.写真を見ることができます.
1994年12月、navigatorが1.0版をリリースしました.
1995年5月、Brendan Eichは10日間しか使わず、この言語の第一版をデザインしました.最初の名前はMochaで、1995年9月にLiveScriptに変更されました.12月にJavaScriptと改名した当時の意図はJava ScriptをJavaの補足としてホームページを操作することです.
  • 1996年3月、Navigator 2.0ブラウザは正式にJavaScriptスクリプト言語を内蔵しています.

  • 1996年8月、マイクロソフトはJavaScriptをまねて似たような言語を開発しました.JScriptと名づけました.まず3.0 IEに内蔵します.Netscapeはブラウザのスクリプト言語の主導権を失う局面に直面しています.

  • 1996年11月、NetscapeはJavaScriptを国際標準化機構ECMAに提出することを決定しました.今は全部で25人です.この委員会は定期的に会議をしています.すべてのメール討論と議事録は公開されています.
  • JavaScriptバージョン
  • 1997年7月、ECMAはECMAScript 1.0版を発表しました.ECMAScriptはJavaScriptという言語を標準化するための基本文法構成
  • にしか使われません.

  • 1998年6月、ECMAScript 2.0版がリリースされました.

  • 1999年12月、ECMAScript 3.0版が発表され、JavaScriptの通行基準となり、広く支持されています.

  • 2008年7月、ECMAScript 3.1として発表されました.その後まもなく、ECMAScript 3.1はECMAScript 5と改名されました.

  • 2009年12月、ECMAScript 5.0版が正式に発表されました.
  • 2015年6月、ECMAScript 6が正式に発表され、「ECMAScript 2015」と改名されました.
  • JavaScriptの特徴
  • JavaScript:略称:JS
  • はプログラミング言語です.
  • はクライアントスクリプト言語で、弱いタイプの言語です.すべてvar
  • を使用しています.
  • は説明的な言語で、動的なタイプの言語です.ブラウザがこの行のコードを解析すると、この変数は具体的にどのタイプかが分かります.
  • はオブジェクトベースの言語であり、直接システム内のオブジェクトを使用する
  • です.
  • js最初の目的:ユーザーとブラウザの相互作用問題を解決する
  • .
  • 現在の目的:特効、ゲーム、アプリケーション、サーバ端末のプログラム
  • JavaScriptの構成
    ECMAScript DOM BOM
    ECMAScript-JavaScriptの核心
    ECMAヨーロッパコンピュータ製造連合会ネットスケープ:JavaScriptマイクロソフト:JScriptはJavaScriptの文法規範JavaScriptの核心を定義しています.言語の基本的な文法とデータの種類を説明しました.ECMAScriptは標準です.言語の標準は具体的な実現と関係がないと定義しました.
    BOM-ブラウザオブジェクトモデル
    ブラウザを操作する機能セットのAPIは、BOMを通じてブラウザウィンドウを操作できます.例えば、ポップアップボックス、ブラウザのジャンプを制御し、解像度を取得するなどです.
    DOM-ドキュメントオブジェクトモデル
    一連の操作ページ要素のAPI DOMは、例えば、ショッピングカートの添削を調べるために、DOMから提供されたAPIを通じて、ツリー上のノードを操作することができます.
    JavaScriptの初体験
    CSS:行内スタイルです.埋め込みスタイル、外部スタイル
    JavaScriptの表記位置
    -行内に書く
    
    
  • scriptタグに書いてある
  • <head>
      <script>
        alert('Hello World!');
      </script>
    </head>
    
  • 外部のjsファイルに書いて、ページに
  • を導入します.
    <script src="main.js"></script>
    
    気をつけて
    外部のjsファイルを引用するscriptタグにJavaScriptコードを書いてはいけません.
    ECMAScript標準-JavaScriptの核心
    ECMAヨーロッパコンピュータ製造連合会は、JavaScriptの文法規範を定義しています.
    JavaScriptの核心は、言語の基本的な文法とデータのタイプを述べています.ECMAScriptは標準です.言語の標準は具体的な実現と関係がないと定義されています.
    BOM-ブラウザオブジェクトモデル
    Browser Object Modelは、ブラウザウィンドウをBOMで操作することができます.例えば、ポップアップボックス、ブラウザのジャンプを制御し、解像度を取得するなどです.
    DOM-ドキュメントオブジェクトモデル
    Dcument Object Model DOMは、HTMLをドキュメントツリーと見なし、DOMから提供されるAPIを介してツリー上のノードを操作することができる.
    四つの出力方式
    a)  alert()           
    b)  console.log()            
    c)  document.write()         
    d)  prompt(“           :”)          
    
    識別子
    概念:変数、関数などに名前をつける文字列の命名規則:1は数字、字母、下線_、ドル記号$組成2は、数字で始まることができません.キーワードはjs言語で特定の意味を与える単語です.例えば、var)4は、大文字小文字変数と変数宣言を区別します.
    何が変数ですか?プログラムの実行中に値が変わる量です.
    どのように声明しますか?varで宣言します.
      var a;  //      a
          a = 10; // 10   a
             :
          var a = 10; //          a, 10   a
                
          var a = 10;//       a   
          var b = 20;//       b   
          var c = 30; //       c   
          var a,b,c; //      a b c   
          a = 10;
          b = 20;
          c = 30;
          var a = 10,b=20,c=30; //   
    
    名前のルール:
    1は数字、文字、下線_、ドル記号$2は数字で始まることができません.3はキーワードではありません.
    命名仕様:
    名前を見て意味が分かります.apple Price name heightカラーラクダの命名法:apple Price bigApplePriceビッグアップル価格background Color背景色background Image背景画像border Colorフレーム色border Widthフレーム幅
    通常の名前:sum(と)max(最大値)min(最小)num(数字)str(文字列名)arr(配列名)コードコメント
    typeof操作符
    コードコメント
            //
            /*     */
    
    データの種類
    Numberの数値タイプの整数、浮動小数点、NaN(非数字の数値タイプ)10 10.1 NaN String文字列タイプ‘10’’は“ははは”“10.1”Booleanブールタイプtrue真false偽undefinedは定義されていないタイプのみ宣言して、未割り当てvar a;null空タイプは手動でvar a=nullを賦課します.オブジェクトタイプ
    オペレータ
    演算子operator 5+6の表式の構成操作数と演算子には、結果があります.
    算術演算子
    + - * / %  
    
    単項演算子
    一つの要素演算子:一つの操作数だけの演算子5+6二つの演算子の演算子2元演算子+自身に1を足す–自分は1をマイナスする前に+をプラスします.1を足すと、演算後の位置+が加算されます.まず1をプラスして、演算後の位置を調整します.
    論理演算子(論理演算子)
    &&           true,   true,    false
    ||            true,   true,   false
    !       
    
    関係演算子(比較演算子)
    <  >  >=  <= == != === !==
    
    == ===   :==       ,===        ,   
    var result = ('55' == 55);      // true
    var result = ('55' === 55);     // false    ,     
    var result = (55 === 55);   // true
    
    !非取逆
    割り当て演算子
    =========%
      :
    var num = 0;
    num += 5;	//     num = num + 5;
    
    関係式
    関係表現の役割:2つの値の関係をテストし、関係に応じてtrueまたはfalseを返します.
    関係表式は常にブール値を返します.通常はif、while、またはfor文で関係表現を使用して、プログラムの実行フローを制御します.
    3つの演算子
    JavaScriptはまた、ある条件に基づいて変数を賦課する条件演算子を含んでいます.
    書式:条件?語句1:語句2;
    実行プロセス:まず条件を判断し、条件がtrueであれば、結果は文1であり、条件がfalseであれば、結果はfalseである.
    変数ageの値が18未満の場合、変数voteableには「年齢が小さい」値が割り当てられます.そうでなければ、「年齢がすでに達しています.」
    voteable=(age<18)「年齢が若すぎる」:「年齢がすでに達している」.
    演算子の優先度
           
    	1. ()       
    	2.        ++   --   !
    	3.         *  /  %     +   -
    	4.        >   >=   <   <=
    	5.         ==   !=    ===    !==
    	6.        &&    ||
    	7.         =  +=  -=