1. 程式人生 > >《JavaScript高級教程》學習筆記一、變量和數據類型

《JavaScript高級教程》學習筆記一、變量和數據類型

body 統一 () 邏輯 obj mas 沒有初始化 關系 可變

JavaScript的核心語言特性在ECMA-262中是以名為ECMAScript的偽語言的形式來定義的。

一、變量和數據類型

1. 變量

JavaSript是弱類型語言,可以通過var定義任何類型變量,同時同一變量可以被賦值成不同類型。

JavaScript可以在語句結尾省略分號,JS會自動添加分號,但是最好加分號:1.減少錯誤 2.方便壓縮 3.提高性能

var msg = ‘mdzz‘;   // String
msg = 1024;         // Number

var 聲明變量,函數作用域

2. 數據類型

JavaScript一共有5中基本數據類型,通過typeof

可以查看變量的數據類型。 typeof(變量/數值字面量) 返回對應數據類型字符串

1. Undefined

只有一個值,undefined,聲明又沒有初始化的變量,默認值為undefined。也可以顯示給變量賦值undefined

var msg; // x相當於 var msg = undefined
typeof(msg)
>> "undefined"

typeof(未聲明變量) 也會返回"undefined"

2. Null

同樣只有一個值,為nulltypeof(null)返回‘object‘

3. Boolean

兩個值,truefalse

。所有其他類型的值,都可以通過 Boolean(variable) 轉換成true或者false。 轉換規則:

數據類型truefalse
String 非空字符串 空字符串(‘‘
Number 非零數值 0NaN
Object 任何對象 null
Undefined undefined

某些時候變量會自動轉換成Boolean,如 if(variable) 相當於 if( Boolean(variable) )

4. Number

可以表示整數或浮點數。0開頭表示八進制,0x開頭表示十六進制。

特殊值:

  • Number.MIN_VALUE(最小值
  • Number.MAX_VALUE(最大值
  • Infinity(無窮大,超過JS數據範圍,可以通過Number.POSITIVE_INFINITY得到
  • -Infinity (負無窮,Number.NEGATIVE_INFINITY
  • Number.MAX_SAFE_INTEGER(最大整數
  • Number.MIN_SAFE_INTEGER(最小整數
  • NaN

任何涉及NaN的操作都返回NaN,如Nan / 10

NaN不等於任何值,包括它本身,NaN == NaN // false

isNaN()用來判斷一個變量是否是數值

isNaN(NaN)      // true
isNaN(‘10‘)     // false 可以轉化為數數值
isNaN(true)     // false
isNaN(‘true‘)   // true

數值轉換:

Number()parseInt()parseFloat()

Number() 轉換規則:

  • truefalse會轉換為10
  • null返回0
  • undefined返回NaN
  • 字符串忽略前導0,十六進制可以轉換,空字符串為0,其他的不合法字符串轉換為NaN
  • 對象,調用valueOf()方法,為undefined則調用toString()再轉換字符串。

parseInt()轉換規則:

  • 忽略前面的空白 碰到不合法字符轉換結束
    parseInt(‘123blue‘);    // 123
    parseInt(‘‘);           // NaN
    parseInt(‘0xA‘);        // 10(十六進制)
    parseInt(‘   22.5‘);    // 22
    parseInt(22.5);         // 22
    parseInt(‘zzz‘);        // NaN
  • 八進制(0開頭數字)有的時候轉換規則不統一。
  • parseInt(number, radix)轉換為指定進制。

parseFloat()只轉換十進制。

5. String

單引號()或雙引號(")包裹。兩種方式沒有區別。

轉義字符:

  • \n 換行
  • \t 制表
  • \b 空格
  • \r 回車
  • \\ 斜杠
  • \‘ 單引號
  • \" 雙引號

str.length 獲取字符串長度

ECMAScript中字符串是不可變的。字符串拼接將產生新的字符串。

toString()方法: 除了nullundefined值,其他數據都有toString()方法。字符串會返回一個副本。

> 0x23.toString()
< "35"
> ‘0x23‘.toString()
< "0x23"

6. Object

JS可以通過var o = new Object()來創建對象。

Object的每個實例都具有以下屬性和方法:

  • constructor():構造函數
  • hasOwnProperty(propertyName):用於檢查當前對象是否存在某個屬性。其中propertyName為字符串。
  • isPrototypeOf(Object):用於檢查傳入的對象是否是另一個對象的原型。
  • propertyIsEnumerable(propertyName):用於檢查給定屬性是否可以用for-in來枚舉。其中propertyName為字符串。
  • toString():返回對象的字符串。
  • valueOf():返回對象的字符串,數值或布爾值表示。

二、操作符

1. 一元運算符

  • 遞增遞減操作符 ++--,對於整數,使用方法和C語言,Java等相同。但是JS中不僅可以對整數使用,對浮點數也同樣適用。同時對於其他類型的變量,會轉變成Number然後進行運算,不合法將返回NaN
    var o = {
        valueOf: function() {
            return -1;
        }
    }
    var i = o--;    // i is equal to -1, o change to -2
  • 一元加和減操作符 對於數字,+-和普通的運算符號一樣,同時,對於其他類型,可以快速轉換成Number類型。
    var o = {
        valueOf: function() {
             return -1;
        }
    }
    var i = -o;    // i is equal to 1, o don‘t change

2. 位操作符

  • 按位非(~):操作數的負值減一。
  • 按位與(&
  • 按位或(|
  • 按位異或(^
  • 左移(<<
  • 算術右移(>>): 最左端補符號位
  • 邏輯右移(>>>):最左端補0。

3. 布爾操作符

  • 邏輯非(!):返回布爾值取反。通過兩個取反(!!)可以達到Boolean()的效果。
  • 邏輯與(&&):短路操作。如果第一個操作數的布爾值為false,則返回第一個操作數,註意:是返回操作數本身,而不是對應的布爾值! 如果第一個操作數對應的布爾值為true,則返回第二個操作數。
    if (obj != null) {
        obj.doSomething();
    }
    // 上面的代碼可以簡化成下面的代碼
    obj && obj.doSomething();
  • 邏輯或(||):和邏輯與一樣,短路操作。
    var obj;
    if (oldObj != null) {
        obj = oldObj;
    } else {
        obj = new Object();
    }
    // 上面的代碼可以簡化成下面的代碼
    obj = oldObj || new Object(); 

4. 乘性操作符

如果對非數值操作數進行乘性運算,將會自動轉換成數值。

  • 乘法(*

超過數據範圍返回Infinity-Infinity

有一個操作數是NaN返回NaN

Infinity0相乘,返回NaN;

Infinity和非零數值,Infinity相乘,返回Infinity;

  • 除法(/

  x/NaNNaN/xInfinity/Infinityx/0返回NaN

  • 求模(%

x/Infinityx/0 => NaN

x(有限數值)/Infinity => x

5. 加性操作符

  • 加法

可以進行數值運算或者字符串運算。

如果有一個操作數是字符串,另外一個操作數將轉換成字符串然後連接。

  • 減法

非數值性操作數將轉換成對應數值。

6. 關系操作符

  • 小於(<),大於(>),小於等於(<=),大於等於(>=
  • 和數值的比較,非數值操作數將轉換為數值。
  • 字符串之間按字典序比較。

7. 相等操作符

  • 相等(==)和不相等(!=
  • 兩個操作數會先做強制類型轉換,然後再比較他們的相等性。 不同數據類型轉換規則:
    1. Boolean -> 0 or 1
    2. String 比較 NumberString -> Number
    3. Object 比較 其他類型,對象會取valueOf()方法返回的值
    4. null == undefined // true
    5. null == anything // false
    6. null != anything // true
    7. 如果兩個操作數都是對象,則當他們指向同一個對象時相等。
  • 全等(===)和不全等(!==
    1. 如果兩個操作數數據類型不相等返回false而不會進行類型轉換。

8. 條件操作符(? :

9. 賦值操作符(=

10. 逗號操作符(,):返回最後一項

三、語句

就算只有一行代碼,最好也用{ }括起來。

  1. if語句

  2. do-while()語句

  3. while語句

  4. for語句

    在for語句中定義的變量,就算在語句結束後也仍然生效,因為var定義變量是函數作用域。

    var count = 10;
    for (var i = 0; i < count; i++) {
        // do something...
    }
    alert(i);   // 10
  5. for-in語句

    輸出順序不定。循環之前應該先確認對象的值是不是nullundefined

    for (property in expression) {
        statement
    }
  6. label語句

    label: statement

    指定breakcontinue的位置。(和Java中相同。

  7. breakcontinue語句

  8. with語句

    with語句的作用是將代碼的作用域設置到一個特定的對象中。嚴格模式下不允許使用。

    語法:with(expression) statement;

    var qs = location.search.substring(1);
    var hostName = location.hostName;
    var url = location.href;
    // 簡化成以下代碼
    with(location) {
        var qs = search.substring(1);
        var hostName = hostName;
        var url = href;
    }
  9. switch語句

    switch(expression) {
        case value1: statement
            break;
        case value2: statement
            break;
        case value3: statement
            break;
        ... // other case
        default: statement
    }

    其中expression可以為任何數據類型。這裏需要判斷expression === value。

四、函數

函數的基本語法:

function functionName(arg0, arg1, ..., argN) { 
    // 函數聲明
    statements
}
functionName(); // 函數調用

ECMAScript中調用函數時的參數可以和函數聲明時參數個數不同。ECMAScript中的參數在內部使用一個數組來表示的,在函數體內可以通過arguments對象來訪問這個參數數組。

arguments並不是Array的實例,但是可以通過arguments[index]獲取任意一個元素。通過arguments.length可以獲得參數個數。

我們可以通過參數個數的判斷實現重載。但是JavaScript中本身是沒有函數重載的,如果定義了名字相同的多個函數,那麽將只有最後的函數生效。

function doAdd(num1, num2) {
    if (arguments.length == 1) {
        alert(num1 + 10);
    } else if (arguments.length == 2) {
        alert(arguments[0] + num2); // arguments[0] is equals to num1
    }
}

arguments和命名參數是同步的,但是未傳遞的參數不可以通過改變arguments改變。謹記arguments不是數組。

function doAdd(num1, num2, num3) {
    console.log(arguments.length); // 2
    console.log(num1, num2, num3, arguments[0], arguments[1], arguments[2]); // 1 2 undefined 1 2 undefined
    num1 = 3; arguments[1] = 4; arguments[2] = 5;
    console.log(arguments.length); // 2
    console.log(num1, num2, num3, arguments[0], arguments[1], arguments[2]); // 3 4 undefined 3 4 5
}
doAdd(1, 2);


《JavaScript高級教程》學習筆記一、變量和數據類型