初學JavaScript從入門到放棄（一）JavaScript介紹、變數、數據類型

一、JavaScript介紹

1、JavaScript：輕量級的客戶端腳本語音
2、目前js已經不僅僅是客戶語音，基於NODE可以做伺服器端程式，所以Javascript是全棧編程語音
3、js及部分組成

• ECMAScript （ES）：js的核心語法
• DOM：docment object model 文檔對象模型，提供各種api（屬性和方法）讓js可以獲取或操作頁面中的HTML元素（DOM和元素）
• BOM：browser object model 瀏覽器對象模型，提供各種api讓js可以操作瀏覽器
• ESMAScript
  • 他是js的語法規範，js中的變數，數據類型，語法規範

二、JavaScript變數（variable)

它不是指具體值，只是一個用來存儲具體容器或者代名詞，因為他存儲的值可以改變。

1.基於ES語法規範，在JS中創建變數有以下方式

• 嚴格區分大小寫
• var（ES3)
• function (ES3) 創建函數（函數名也是變數，只不過存儲的值是函數類型的而已）
• let （ES6)
• const （ES6) 創建的是常量
• class （ES6）基於ES6創建類
• import （ES6）基於ES6的模塊規範導出需要的信息

/*
*   語法： 
*   var [變數名] = 值;
*   let[變數名] = 值;
*   const[變數名] = 值;
*   function 函數名(){
*   }
*   ....
*/

2、創建變數，命名的時候要遵循一些規範

• 嚴格區分大小寫

var n = 12;
var N = 13; //=>兩個n不是同一個變數

• 遵循駝峰命名法：第一個小寫，後面的單詞大寫按照數字，字母，下劃線來命名（數字不能做為開頭）

var studentInfo; / student_info/ 
var _studentInfo;//(下劃線在前端的都是公共變數)
var $studentInfo;//(一般存儲都是JQ元素)
    function  ion toLowerPase(){
}

• 不能使用關鍵字

三、數據類型

1、基本數據類型

• 基本數據類型（值類型）
  • 數字 number

  [基本數據類型]
  有一個特殊的NaN（not a number代表不是一個有效的數字但是屬於number類型的）

  • 字元串 string
  • 布爾 boolean
  • null
  • undefined
• 引用數據類型
  • 對象object
    • 普通對象

    var o = {name:'xie',age:18}

    • 數組對象

    var ary = [1,2,34];

    • 正則對象

    var reg = /-?\d|([1-9]\d+))(\.\d+)?/g;
    由元字元組成一個完整的正則
    // 不是空正則是單行註釋

    • 日期對象
    • ·······
  • 函數function

  function fn()
  {
  }

• ES6中新增加的一個特殊的類型：Symbol，唯一的值

[Symbol]
創建出來的是唯一的值
var a = Symbol('謝');
var b = Symbol('謝');
a==b  =>false

2、瀏覽器

• Elements：在當前頁面的元素和樣式在這裡都可以看到，還可以調節樣式修改結構等
• Console：控制台，可以在JS代碼中通過.log輸出到這裡，也可以在這裡直接編寫JS代碼
• Sources：當前網站的源文件都在這裡

3、擴展：JS代碼如何被運行以及運行後如何輸出結果
[如何被運行]

• 把代碼運行在瀏覽器中（瀏覽器內核來渲染解析）
• 基於NODE來運行（NODE也是一個基於V8引擎渲染和解析JS的工具)
  [如何輸出結果]
• alert：在瀏覽器中通過彈框的方式輸出（瀏覽器提示框）
  ps：輸出的結果是toString後的結果

//基於alert輸出的結果都會轉換為字元串：（如果是表達式先計算出結果然後在用toString方法轉換為字元串
var num = 21;
alert(num); =>window.alert
alert({name:'xxx'});=>['object Object'] 
//為什麼toString後的結果是object??

• confirm：確認提示框

var num = 2;
var fiag = confirm(num);
alert(fiag);//如果點擊的是確定就是true點擊的是取消則是false

• prompt：在confirm的基礎上增加輸入框(不常用)
• console.log：原來的意思是在瀏覽器工作台輸出日誌
• console.dir：比log輸出的更加詳細一些（尤其是輸出對象的數據值的時候）
• console.table：把一個JSON數據按照表格的方式輸出