和JavaScript的“愛情”這不就來了嗎？

初識：第一次遇見JavaScript

?

概念

JavaScript一種直譯式腳本語言，是一種動態型別、弱型別、基于原型的語言，內置支持型別，它的解釋器被稱為JavaScript引擎，為瀏覽器的一部分，廣泛用于客戶端的腳本語言，最早是在HTML（標準通用標記語言下的一個應用）網頁上使用，用來給HTML網頁增加動態功能，
通俗來講，就是一種在客戶端運行的腳本語言，什么是腳本語言呢？腳本語言又被稱為擴建的語言，或者動態語言，是一種編程語言，用來控制軟體應用程式，腳本通常以文本（如ASCII）保存，只在被呼叫時進行解釋或編譯，腳本語言是不需要編譯的，由JavaScript逐行解釋并執行，

作用

• 嵌入動態文本于HTML頁面
• 對瀏覽器事件做出回應
• 讀寫HTML元素
• 在資料被提交到服務器之前驗證資料
• 檢測訪客的瀏覽器資訊
• 控制cookies，包括創建和修改等
• 基于Node.js技術進行服務器端編程

特點

(1)腳本語言，JavaScript是一種解釋型的腳本語言,C、C++等語言先編譯后執行,而JavaScript是在程式的運行程序中逐行進行解釋，

(2)基于物件，JavaScript是一種基于物件的腳本語言,它不僅可以創建物件,也能使用現有的物件，

(3)簡單，JavaScript語言中采用的是弱型別的變數型別,對使用的資料型別未做出嚴格的要求,是基于Java基本陳述句和控制的腳本語言,其設計簡單緊湊，

(4)動態性，JavaScript是一種采用事件驅動的腳本語言,它不需要經過Web服務器就可以對用戶的輸入做出回應，在訪問一個網頁時,滑鼠在網頁中進行滑鼠點擊或上下移、視窗移動等操作JavaScript都可直接對這些事件給出相應的回應，

(5)跨平臺性，JavaScript腳本語言不依賴于作業系統,僅需要瀏覽器的支持，因此一個JavaScript腳本在撰寫后可以帶到任意機器上使用,前提上機器上的瀏覽器支 持JavaScript腳本語言,目前JavaScript已被大多數的瀏覽器所支持，

相知：主動去了解JavaScript與她的相關的一切

?

變數

我們可以通俗的將這個理解為：存放資料的容器，通過變數名獲取資料；

組成

     var 變數名 = 變數值 ；    （變數初始化）

變數名命名規范

• 由字母(A-Za-z).數字(0-9)、 下劃線( ).美元符號($ )組成,如: usrAge, num01,_name
• 嚴格區分大小寫. var app;和var App;是兩個變數
• 不能以數字開頭，18age 是錯誤的
• 不能是關鍵字、保留字，例如: var. for. while
• 變數名必須有意義
• 遵守駝峰命名法，首字母小寫,后面單詞的首字母需要大寫，myFistName
• 推薦翻譯網站:有道愛詞霸

資料型別

簡單資料型別

• 數字型別number
  注意：
  1.八進制前面加0 012；
  2.十六進制加0x 0xa=10；
  3.數字型的最大值 console . log(Number .MAX_ VALUE);
  4.數字型的最小值 console . log(Number .MIN VALUE);
  5.alert (Infinity)，代表無窮大,大于任何數值；
  6.alert(-Infinity)，代表無窮小,小于任何數值；
  7.alert (NaN) ，Not a number,代表一個非數值；

• 字串 string
  注意：
  1.字串必須帶引號；
  2.雙引號和單引號區分使用，推薦使用單引號；

• 空值 null
  注意：
  1.與字串相加 結果為 null字串；
  2.與數值相加 結果為 數值；

• 布爾型 Boolean
  注意：
  1.FALSE 假 ，參與加法運算 當做0來看；
  2.TRUE 真 ， 參與加法運算 當做1來看；

• 宣告變數未給值 undefined
  注意：
  1.與數值相加 結果為 NaN；
  2.與字串相加 結果為 undefined字串；

字符型別轉換

• 轉換為字符型

1.變數.toString( )
var num = 10;
var str =num.toString( ) ；  

2.String（變數）
var num = 10;
console.log( num )；

3.拼接字串（隱式轉換）
var num = 10;
console.log( num +’‘)；

• 轉換為數字型

1.parseInt 轉換為整型
var str='3.1415';
console.log（parseInt(str));  //輸出為3 （只取整數部分，不會四舍五入）

2.parseFloat 轉換為浮點型
var str='3.1415';
console.log（parseFloat(str)); //輸出結果為3.1415 （此時為數字） 

3.Number(變數)
var str='3.1415';
console.log（Number(str)); 

4.算數運算 （隱式轉換 - * / 均可，加法運算是不可以的）  
var str='3.1415';
console.log（str - '0'）;

運算子

運算子分類

• 算數運算子
  算數運算子就是我們平時說的加減乘除、取余等，但需要注意的是：
  1.計算機需要轉換成二進制執行程式，所以會有浮點精度問題；
  2.兩個浮點數是不能判斷相等的；

• 關系運算子（比較運算子）
  

• 邏輯運算子
  

• 賦值運算子
  

• 遞增運算遞減運算子
  遞增：++ 遞減：- -

前置：++ 變數      先進行自加，再進行運算  
后置：變數 ++      先進行運算，再進行自加  

單獨使用時，前置遞增和后置遞增效果是一樣的

var num =  1 ；
var num1 = 1 + num++; //此時num1的值為2，num先運算給num1再自加；
var num2 = 1 + ++num; //此時num1的值為3，num先自加給num2再運算 ；

相愛:與JavaScript一起在代碼的世界里遨游

?

流程控制

就是形容在程式執行的時候，程式按照什么順序執行；

結構

• 順序結構：從上往下的順序執行；
• 分支機構：不同的條件執行不同的代碼得到不同的結果；

1. if 陳述句:只有滿足條件運算式的時候才執行，否則就跳過不執行；

if (條件運算式) { 需要執行的陳述句 }

var a = 5;
var b = 6;
if (a > b){ console.log('此時條件運算式為成立，列印這個陳述句');  }

2. if else 陳述句 ：判斷 if 的條件運算式，如果滿足條件執行 if 里陳述句，否則執行else里的陳述句；（if 和 else 一定會執行其中一個）

if (條件運算式) {3
      執行陳述句1
} else{
      執行陳述句2
}

var a = 5;
var b = 6;
if (a > b){ 
     console.log('此時條件運算式成立，列印這個陳述句');  
}else {
     console.log('此時條件運算式不成立，列印這個陳述句');  
}

4. if else if 陳述句：但 if 里面的條件運算式不滿足就會一直往下判斷，全部都不滿足的時候就會執行最后一個陳述句；

if(條件運算式1){
      執行陳述句1
}else if(條件運算式2){
      執行陳述句2
}else if(條件運算式3){
      執行陳述句3
}else {
      執行陳述句4
}  // if else 陳述句的數量是不限的

6. switch 陳述句：與case的value值進行匹配，符合則執行該陳述句（必須是全等：數字、資料型別都必須相等） ， 全部都不匹配時執行最后陳述句；

switch(運算式){
case value1：
      執行陳述句1;
      break;
case value2：
      執行陳述句2;
      break;
case value2：
      執行陳述句2;
      break;
      ...
default:
      最后的執行陳述句；
 }

8. 三元運算式

條件運算式  ？ 運算式1  ：運算式 2
條件運算式結果真：回傳運算式1的值
條件運算式結果假：回傳運算式2的值

回圈

目的

使用回圈能夠重復執行代碼，提高代碼的執行的效率，

回圈分類

• for 回圈

for(初始變數 ; 條件運算式 ; 操作運算式){ 回圈體 }

初始化變數： 普通變數 作為計數器使用（只執行一次）
條件運算式：用于決定一個回圈是否繼續執行，滿足條件執行 不滿足終止；
操作運算式：每次回圈最后執行的代碼，常用于計數器變數進行更新（遞增或者遞減）

for(var i = 1; i <= 100 ; i++){
     console.log('列印100句：你好！')
 }// for回圈里面可以鑲套多重for回圈：外部回圈執行一次，內部回圈執行全部；

• while回圈：當條件運算式的結果成立的時候，進入回圈；直到不成立時退出回圈；

while(條件運算式){  回圈體  }

var num = 1;
while(num <= 100){
    console.log('我在回圈！');
    num++; // 不自加就會進入死回圈
}

• do … while 回圈：先執行一次，再判斷條件運算式；成立則繼續執行，不成立則不執行；

do{ 
    回圈體
    }while(條件運算式)
    
var num = 1;

do{ 
     console.log('我在回圈！');
      num++; // 不自加就會進入死回圈
    }while(num <= 100)

陣列

陣列是一個資料集合，每個資料型別都可以存盤在里面；

創建方式

• 利用new創建新代碼

var 陣列名 = new Array();
var arr = new Array();

• 利用陣列字面量創建陣列

var 陣列名 = [ 陣列內容 ];

var arr = [1,12,54,68,658,8454,99];

關于陣列元素

• 索引( 下標）：用來訪問陣列有元素的序號（ 從0開始）
• 語法格式：陣列名[ 索引號 ]
• 遍歷陣列：把陣列元素從頭到尾取一遍；
• 陣列長度： 陣列名.length

小結

在與JavaScript相愛這條路上，一定會越走越遠哦！“愛情”的磨煉是最令人成長的呢，也許這一路上我們會經歷特別多的坎坷，伴隨著掉不完的頭發，寫不完的代碼，但我愛他！