Github: https://github.com/SHENLing0628/JavaScriptStudy
歡迎star脖阵，轉(zhuǎn)載請標(biāo)注來源

1. 語法

• 區(qū)分大小寫

• 標(biāo)識符：第一個(gè)字符必須是一個(gè)字母、下劃線或一個(gè)美元符號；其他字符可以使字母晚伙、下劃線蒋歌、美元符號或數(shù)字拿愧。（慣例：駝峰法）

• 注釋：

  // 單行注釋
  
  /*
   * 多行塊級注釋
   */
  

• 嚴(yán)格模式 strict mode

  // 啟用方法
  
  // 1. 全局使用：頂部添加
  "use strict"
  // 2. 局部使用：function內(nèi)添加
  function foo() {
    "use strict"
    // 函數(shù)體
  }
  

• 語句

  if (test) {
    test = false;
    alert(test);
  }
  

2. 變量

js中的變量為“松散類型”贼急，即為可用來保存任何類型數(shù)據(jù)

var message = 'hi'
var message2 = 123

3. 數(shù)據(jù)類型

Undefined蜗元、Null拾因、Boolead旺罢、Number、String绢记、Object

• typeof 操作符 - 檢測變量類型

  數(shù)據(jù)類型	typeOf 返回結(jié)果
  未定義	"undefined"
  布爾值	"boolean"
  字符串	"string"
  數(shù)值	"number"
  對象或null	"object"
  函數(shù)	"function"

• undefined 類型 - 聲明但未賦值的變量

  var message;
  alert(message); // 返回：undefined
  

• Null類型 - 空對象指針

  var message = null
  alert(typeof message) // 返回：object
  

• Boolean類型 - True / False

  // 強(qiáng)制轉(zhuǎn)換
  var message = 123
  var message2 = Boolead(message) // 返回： true
  
  // 自動轉(zhuǎn)換
  if (message) { // 在控制語句中扁达，自動駐安徽
    alert('value is true')
  }
  

  備注： true不一定等于1，false不一定等于0

• Number類型

  // 整數(shù)
  var intNum = 10 
  
  // 八進(jìn)制 - 以0開頭蠢熄，后面是八進(jìn)制序列0~7
  var octalNum = 077 
  
  // 十六進(jìn)制 - 以O(shè)x開頭跪解，后面是十六進(jìn)制數(shù)字0~9 A~F
  var hexNum = 0x1f
  
  // 浮點(diǎn)值
  var floatNum = 1.1
  var floatNum2 = 3.125e7
  
  // NaN - not a number 非數(shù)值 - 表示本應(yīng)返回?cái)?shù)值，但未能返回的情況签孔，以避免拋出錯(cuò)誤
  var nanNum = NaN / 10; // 返回：NaN
  var nanNum2 = (NaN == NaN) // 返回： false - NaN與任何數(shù)值都不相等叉讥，包括其本身
  var nanNum3 = isNaN(NaN) // 返回： true
  var nanNum4 = isNaN("blue") // 返回：true - blue不可能被轉(zhuǎn)換為數(shù)值
  var nanNum5 = isNaN(true) // 返回：false - true可以轉(zhuǎn)換為數(shù)值1砾跃， 故不是NaN
  
  // 數(shù)值轉(zhuǎn)換 - Number() - 復(fù)雜不合理
  Number(true) // 1
  Number(false) // 0
  Number(10) // 10
  Number(null) // 0
  Number(undefined) //NaN
  Number('blue') // NaN
  Number('123') // 123
  Number('1.1') // 1.1
  Number('0xf') // 15
  Number('') // 0
  
  //數(shù)值轉(zhuǎn)換 - parseInt() - 第一個(gè)參數(shù)為轉(zhuǎn)換數(shù)據(jù)，第二個(gè)參數(shù)為解析進(jìn)制基數(shù)
  parseInt('1234blue') // 1234
  parseInt('') // NaN
  parseInt('0xA') // 10 - 十六進(jìn)制：轉(zhuǎn)換為對應(yīng)的十進(jìn)制
  parseInt(22.5) // 22
  parseInt("070") // 56 - 八進(jìn)制：轉(zhuǎn)換為對應(yīng)的十進(jìn)制
  parseInt("70") // 70
  parseInt("AF", 16) // 175 - 按十六進(jìn)制解析节吮，此時(shí)前面無需添加0x
  
  

  補(bǔ)充：

  isNaN執(zhí)行流程：

  1. 先調(diào)用valueOf()抽高，確定其返回值是否可以轉(zhuǎn)換為數(shù)值
  2. 再調(diào)用toString()，測試其返回值

• String 類型

  var name = "cindy"
  
  // 轉(zhuǎn)換為字符串 - toString() - 可傳參數(shù)：進(jìn)制數(shù)
  var num = 10
  num.toString() // “10”
  num.toString(2) // “1010”
  

• Object類型

  var obj = new Object()
  

  屬性和方法	概念
  constructor	保存用于創(chuàng)建當(dāng)前對象的函數(shù)
  hasOwnProperty(propertyName)	檢查給定的屬性在當(dāng)前對象實(shí)例中是否存在 例如：obj.hasOwnProperty("name")
  isPrototypeof(object)	檢查傳入的對象是否是當(dāng)前對象的原型
  propertyIsEnumerable(propertyName)	檢查給定的屬性是否能夠使用for-in語句來進(jìn)行枚舉
  toLocaleString()	返回對象的字符串表示透绩，該字符串與執(zhí)行環(huán)境的地區(qū)對應(yīng)
  toString()	返回對象的字符串表示
  valueOf()	返回對象的字符串翘骂、數(shù)值、布爾值表示帚豪。通常與toString()返回值相同

4. 操作符

• 一元操作符 - 只操作一個(gè)值的操作符

  // 1. 遞增和遞減 - 類似C語言思想
  // 1.1 前置型操作
  var age = 29
  ++age // 和 age = age + 1 效果相同
  --age // 和 age = age - 1 效果相同
  
  var anotherAge = --age + 2
  alert(age) // 28
  alert(anotherAge) // 30
  
  // 1.2 后置型操作
  var num1 = 2
  var num2 = 20
  var num3 = num1-- + num2 // 22
  var num4 = num1 + num2 // 21
  alert(num1) // 1
  
  // 1.3 適用于其他數(shù)據(jù)類型
  // 包含有效數(shù)字的字符串   - 先轉(zhuǎn)換為數(shù)值變量碳竟，在執(zhí)行加減操作
  // 不包含有效數(shù)字的字符串 - 變量值設(shè)置為NaN
  // false -------------- 先轉(zhuǎn)為0，再執(zhí)行加減1
  // true  -------------- 先轉(zhuǎn)為1狸臣，再執(zhí)行加減1
  // 浮點(diǎn)數(shù) -------------- 直接執(zhí)行加減1
  // 對象 ---------------- 先調(diào)用valueOf()方法莹桅，獲得可供操作的值，再操作烛亦；若為NaN,則再調(diào)用toString()后再應(yīng)用前述規(guī)則
  var s1 = "2"
  var s2 = "z"
  var b = false
  var f = 1.1
  var obj = {
    valueOf: function() {
      return -1
    }
  }
  
  s1++   // 3
  s2++   // NaN
  s3++   // 1
  f--    // 0.1
  obj--  // -2
  
  
  // 2. 一元加和減操作符
  // 2.1 一元加操作符 - 不對數(shù)值本身產(chǎn)生影響诈泼，但會類似Number()一樣對數(shù)值執(zhí)行強(qiáng)制類型轉(zhuǎn)換
  var num = 25
  num = +num // 25
  
  // 2.2 一元減操作符 - 表示負(fù)數(shù)；對于非數(shù)值類型煤禽，先強(qiáng)制轉(zhuǎn)換類型铐达，再變?yōu)樨?fù)數(shù)
  num = -num // -25
  
  

• 位操作符 - 二進(jìn)制 位計(jì)算

  默認(rèn)情況下，ECMAScript所有整數(shù)都是有符號整數(shù)檬果。也存在無符號整數(shù)瓮孙；

  無符號整數(shù) - 第32為不再表示符號，故可表示數(shù)值更大

  // 1. NOT 按位非 ~
  var num1 = 25    // 二進(jìn)制 00000000000000000000000000011001
  var num2 = ~num1 // 二進(jìn)制 11111111111111111111111111100110
  
  // 2. AND 按位與 &
  var result = 25 & 3 // 1
  
  // 3. OR 按位或 |
  var result = 25 | 3 // 27
  
  // 4. XOR 按位異或 ^
  var result = 25 ^ 3 // 26
  
  // 5. 左移 << （將數(shù)值所有位向左移動位數(shù)选脊；且左移不影響符號位）
  var oldValue = 2              // 二進(jìn)制 0000010
  var newValue = oldValue << 5  // 二進(jìn)制 1000000  十進(jìn)制：64
  
  // 6. 右移 
  // 6.1 有符號右移 - 保留符號位 >>
  var oldValue = 64
  var newValue = oldValue >> 5 // 2
  // 6.2 無符號右移 - 正數(shù)無影響杭抠，負(fù)數(shù)有變化 >>>
  var oldValue = -64             // 二進(jìn)制 1111111111111111111111111111000000
  var newValue = oldValue >>> 5  // 二進(jìn)制 0000011111111111111111111111111110 十進(jìn)制 134217726
  
  

  • 布爾操作符

    // 1. 邏輯非 !
    !false     // true
    !"blue"    // false
    !0         // true
    !NaN       // true
    !""        // true
    !12345     // false
    
    // 2. 邏輯與 &&
    obj && true      // true - 第一個(gè)是對象，則返回第二個(gè)操作數(shù)
    true && obj      // obj  - 第二個(gè)是對象恳啥，則在第一個(gè)為true時(shí)偏灿，返回對象
    obj1 && obj2     // obj2 - 兩個(gè)都是對象，則返回第二個(gè)對象
    null && true     // null - 第一個(gè)是null角寸，則返回null
    NaN && true      // NaN  - 第一個(gè)是NaN菩混，則返回NaN
    udefined && true // undefined - 第一個(gè)是undefined忿墅，則返回undefined
    
    // 3. 邏輯或 ||
    obj || true          // obj - 第一個(gè)是對象扁藕，則返回第一個(gè)操作數(shù)；但第一個(gè)obj求職結(jié)果為false疚脐，則返回第二個(gè)
    obj1 || obj2         // obj1 - 兩個(gè)都是對象亿柑，則返回第一個(gè)對象
    null || null         // null - 兩個(gè)都是null，則返回null
    NaN || NaN           // NaN  - 兩個(gè)都是NaN棍弄，則返回NaN
    udefined || udefined // undefined - 兩個(gè)都是undefined望薄，則返回undefined
    

  • 乘性操作符 - 乘法疟游、除法和求模

    // 1. 乘法 - 乘積超過數(shù)值范圍，則返回Infinity或-Infinity
    var result = 34 * 56
    NaN * 10            // NaN
    Infinity * 0        // NaN
    Infinity * 12       // Infinity
    Infinity * -12      // -Infinity
    Infinity * Infinity // Infinity
    
    // 2. 除法 - 商超過數(shù)值范圍痕支，則返回Infinity或-Infinity颁虐；特殊情況類似上述乘法
    var result = 66 / 11
    
    // 3. 求模 - 求余數(shù)；特殊情況類似上述乘法
    var result = 26 % 5 // 1
    

  • 加性操作符

    // 1. 加法
    var result = 1 + 2
    NaN + 1                    // NaN
    Infinity + Infinity        // Infinity
    (-Infinity) + (-Infinity)  // -Infinity
    Infinity + (-Infinity)     //NaN
    (+0) + (+0)                // +0
    (-0) + (-0)                // -0
    (+0) + (-0)                // +0
    
    // 2. 減法
    var result = 2 - 1
    NaN - 1                    // NaN
    Infinity - Infinity        // NaN
    (-Infinity) - (-Infinity)  // NaN
    Infinity - (-Infinity)     // Infinity
    (-Infinity) - Infinity     // -Infinity
    (+0) - (+0)                // +0
    (-0) - (+0)                // -0
    (-0) - (-0)                // +0
    

  • 關(guān)系操作符 - 大于卧须、小于另绩、小于等于、大于等于

    5 > 4                  // true
    5 < 3                  // false
    "Brick" < "alphabet"   // true - 均為字符串花嘶，比較字符編碼值
    "23" < 3               // false - 一個(gè)為字符串笋籽，則將其轉(zhuǎn)為數(shù)值后比較
    NaN < 3                // false
    NaN >= 3               // false
    
    // 補(bǔ)充：如果一個(gè)操作數(shù)是對象，則調(diào)用其valueOf()方法椭员，如果沒有valueOf()方法车海，則通過toString()處理后比較
    

  • 相等操作符

    相等不相等 - 先轉(zhuǎn)換再比較

    全等不全等 - 僅比較而不轉(zhuǎn)換

    // 1. 相等不相等 - 會產(chǎn)生強(qiáng)制轉(zhuǎn)換類型
    null == undefined     // true - null和undefined相等
    "NaN" == NaN          // false - 只要一個(gè)為NaN，則返回false
    5 == NaN              // false
    NaN == NaN            // false
    NaN != NaN            // true
    false == 0            // true - 對false強(qiáng)制轉(zhuǎn)型為0
    true == 1             // true - 對true強(qiáng)制轉(zhuǎn)型為1
    true == 2             // false
    undefined == 0        // false
    null = 0              // false
    "5" == 5              // true - 對"5"強(qiáng)制轉(zhuǎn)型為數(shù)值5
    
    // 全等不全等 - 在兩個(gè)操作數(shù)未經(jīng)轉(zhuǎn)換就像等的情況下返回true
    null === undefined   // false
    "55" === 55          // false
    

  • 條件操作符

    variable = boolean_expression ? true_value : false_value
    

  • 賦值操作符

    var num = 25
    num += 10 // 等同于：num = num + 10
    num *= 10
    num /= 5
    num %= 3
    num += 1
    num -= 1
    num <<= 2
    num >>= 2
    nun >>>= 2
    

5. 語句

• if語句

  if (condition1) {
    // statement1
  }
  else if (condition2) {
    // statement2
  }
  else {
    // statement3
  }
  

• do-while

  // 先執(zhí)行隘击，再判斷
  do {
    // statement
  } while(condition)
  

• while

  // 先判斷侍芝，再執(zhí)行
  while(condition) {
    // statement
  }
  

• for

  var count = 10
  for (var i = 0; i < count; i++) {
    // statement
  }
  
  // 類似while
  for (; i < count; i++) {
    // statement
  }
  
  // 無限循環(huán)
  for (;;) { 
    // statement
  }
  

• for-in

  // 用于枚舉對象屬性
  for (property in expression) { 
    // statement
  }
  

• label

  // 用戶在代碼中添加標(biāo)簽
  label: statement
  
  // example - start標(biāo)簽可同break和continue配合使用
  start: for (var i = 0; i < count; i++) {
    alert(i)
  }
  

• break和continue

  break - 立即退出循環(huán)

  Continue - 立即退出當(dāng)前循環(huán)，但還會執(zhí)行下一次循環(huán)

• with

  // 將代碼的作用域設(shè)置到特定對象中
  with (expression) statement
  
  // example - 將包含location對象的變量聲明賦值放一起
  with(location) {
    var qs = search.substring(1)
    var hostname = hostname
    var url = href
  }
  // 常規(guī)寫法：
  var qs = location.search.substring(1)
  var hostname = location.hostname
  var url = location.href
  

• switch

  switch(expression) {
    case value1: statement1; break
    case value2: statement2; break
    case value3: statement3; break
    default: break
  }
  

6. 函數(shù) - function

• 基本語法

  // 聲明函數(shù)
  function funName (arg0, arg1, ... , argN) {
    //statements
  }
  
  // 調(diào)用函數(shù)
  funName('say hi')
  

  注意事項(xiàng)：

  1. 如果statements中埋同，使用return竭贩，則return之后的語句不會執(zhí)行

  2. 嚴(yán)格模式對function的限制：

     1. 函數(shù)名不能命名為eval或arguments

     2. 參數(shù)不能命名為eval或arguments

     3. 不能出現(xiàn)兩個(gè)命名參數(shù)同名的情況

• 理解參數(shù) - arguments

  1. function中傳入?yún)?shù)可不必非要聲明，可以使用arguments對象來獲取莺禁，不顯式地使用命名參數(shù)

     function sayHi() {
       alert("Hello " + arguments[0] + ',' + arguments[1])
     }
     

  2. arguments對象類似Array的調(diào)用方式留量，但并非Array的實(shí)例

  3. function中傳入的參數(shù)數(shù)量可不必與聲明的參數(shù)個(gè)數(shù)一致，因?yàn)樵趂unction內(nèi)部都是以數(shù)組形式獲取參數(shù)值的

     function sayHi (name1, name2) {
       alert("Hello " + name1 + ',' + name2)
     }
     
     sayHi('Alice')
     sayHi('Alice', 'Bob')
     sayHi('Alice', 'Bob', 'Clair')
     
     // 注意：arguments[0]和name1是對應(yīng)的哟冬，值是一樣的
     

  4. arguments也具有l(wèi)ength屬性楼熄，以獲得參數(shù)的個(gè)數(shù)

     function argLength() {
       alert(arguments.length)
     }
     
     argLength('arg1', 'arg2')
     

  5. ECMAScript中所有參數(shù)傳遞都是值，而不能通過引用傳遞參數(shù)

• 沒有重載

  后定義的函數(shù)會覆蓋之前名稱相同的函數(shù)浩峡。而并不能有java的重載的效果

  function foo(num) {
    return num + 100
  }
  
  function foo(num) {
    return num + 200
  }
  
  var result = foo(100) //300
  

Github: https://github.com/SHENLing0628/JavaScriptStudy
歡迎star可岂，轉(zhuǎn)載請標(biāo)注來源