web前端入門到實戰：JS的組成、變量、數據類型

Js做客戶端語言

按照相關的Js語法，去操作頁面中的元素，有時還要操作瀏覽器里面的一些功能

Js由三部分組成：

• ECMAScript（ES）：描述了該語言的語法和基本對象
• DOM（Document Object Model）：文檔對象模型，描述處理網頁內容的方法和接口，通過一些Js的屬性和方法，用來操作頁面中的DOM元素
• BOM（Browser Object Model）：瀏覽器對象模型，描述與瀏覽器進行交互的方法和接口，用來操作瀏覽器的。

Js中的變量 Variable

JS中數據分為兩大類：一是基本數據類型:Undefined、Null、Boolean、Number、String、Symbol，二是復雜數據類型：Object,Object本質上是由一組無序的名子對組成的。

變量：可變的量，在編程語言中，變量其實就是一個名字，用來存儲和代表不同值的東西。

// ES3
var a = 123;
// ES6
let b = 100;
b = 200 //報錯
const c = 1000;

// 創建函數也相當于在創建變量
function fn() {}

// 創建類也相當于創建變量
class A{}

// ES6的模塊島嶼也可以創建變量
import a from './a.js'

// Symbol創建唯一值
let n = Symbol(100)
let m = Symbol(100)

總結：

用var聲明的變量，可以重復聲明，后聲明的會覆蓋前面的

用let聲明的變量具有作用域，在同一作用域下不可重復聲明變量，但是可以修改變量的值，例如let a = 1;，不能再次聲明a，let a = 2;會報錯，提示：Uncaught SyntaxError: Identifier ‘a‘ has already been declared

用const聲明的變量為常量，不能修改該變量的值，但是像Object這樣的復雜數據類型，在內存中存放的是一個指向該對象的指針，也就是說，用const聲明的對象仍然可以修改該對象的值，但不可再次聲明該對象

JS中的數據類型

基本數據類型

• 數字Number (常規數字和 NaN)
• 字符串 String
• 布爾值 Boolean
• 空指針 Null
• 未定義 Undefined
• 唯一值（獨一無二的值）Symbol

引用數據類型 Object對象類型

• {} 普通對象
• [] 數組對象
• RegExp 正則對象
• Function 函數數據類型
• Math 數學函數對象
• Date 日期對象

數據類型應用場景：

當我們通過Ajax請求拿到數據之前，先在本地初始化數據，一般都會先給一個默認的數據，請求數據后再把數據放入到我們定義好的數據結構里面，比如:

var data = {
    count: 0,
    isActive: true,
    goods: [],
    model: null,
    message: ''
}
web前端開發學習Q-q-u-n： 784783012 ，分享學習的方法和需要注意的小細節，不停更新最新的教程和學習方法
（從零基礎開始到前端項目實戰教程，學習工具，職業規劃）

驗證數據類型 typeof操作符

typeof操作符用于檢測給定變量的數據類型。typeof操作符可以檢測的數據類型有：

• undefined
• boolean
• string
• number
• object
• function

var message = 'some string'
console.log(typeof(message) // "string"

var arr = [1,2,3,4]
console.log(typeof(arr) // "object"
console.log(typeof(null) // "object"

在上面的例子中調用 typeof null會返回"object",因為特殊值null被認為是一個空的對象引用。用typeof檢測一個變量是否是數組并不準確，會返回"object"