《JavaScript高級程序設計》(第3版)讀書筆記 第5章 引用類型

  • 引用類型的值(對象)是引用類型的一個實例
  • 引用類型是一種數據結構,用於將數據和功能組織在一塊兒。它同行被稱爲,但這種稱呼並不穩當,儘管ECMAScript從技術上講是一門面向對象的語言,但他不具有傳統的面嚮對象語言所支持的接口等基本結構。
  • 引用類型有時候也被稱爲對象定義
  • 關於typeof中的"object"和Object()構造函數的我的理解:javascript

    • typeof操做符返回的"object"值指的是數據類型
    • 在new Object()中"Object"表示的是數據結構(引用類型),因此new Object()返回的是基於Object引用類型的一個實例
    • typeof返回的"function" 和 Function()構造函數 同理

Object類型

  • 建立對象的方法一個new Object(),另外一個是對象字面量表示法
  • 字面量表示法的最後一個屬性不能添加逗號,這樣會在IE7之前和Opera中致使錯誤
  • 屬性名會自動轉換爲字符串
  • 屬性名中包含關鍵字、保留字會報錯
  • 一般,除非必須使用變量來訪問屬性,不然咱們建議使用點表示法
// 這裏全部的屬性名都會自動轉爲字符串
var person = {
    "name": "Nicholas",
    age: 29,
    5: true
}

// 不會報錯,但這個屬性不能使用person.name的方式
person["first name"]

Array類型

  • 建立數組的基本方式有兩種。使用Array構造函數,字面量表示法
var colors = new Array();
var colors = new Array(20);                        // 傳入一個數值 建立一個length爲20的空數組
var colors = new Array("red");                     // 傳入非數值 所以爲元素的數組
var colors = new Array("red", "blue", "green");
var colors = ["red", "blue", "green"];
colors.length = 2;
alert(colors[2]);        // undefined
var colors = ["red", "blue", "green"];
colors[colors.length] = "black";
colors[colors.length] = "brown";            // 添加新項
var colors = ["red", "blue", "green"];
colors[99] = "black";
alert(colors.length);            // 100 位置3到98的值都不存在,都將返回undefined

檢測數組

  • 對於一個網頁或者一個全局做用域而言,使用instanceof操做符就能獲得結果
if (value instanceof Array) {
    ...
}
  • 若是網頁中包含多個 框架,實際上就存在兩個以上的不一樣全局執行環境,從而存在兩個以上不一樣版本的Array構造函數,爲此ECMAScript5新增了Array.isArray()方法.IE9+,Firefox4+,safari5+,Opera10.5+ Chrome
if (Array.isArray(value)) {
    ...
}

轉換方法

  • 全部對象都據歐toLocaleString(),toString(),valueOf()方法。toString()返回由逗號拼接的字符串,valueOf()返回的仍是數組
  • join() 若是傳入undefined,默認逗號分隔,IE7之前的版本會錯誤的以undefined分隔
  • 若是數組中某一項是null或者undefined,那麼該值在join(),toLocaleString(),toString(),valueOf()方法返回的結果以空字符串表示

棧方法

  • 棧是一種LIFO(Last-In-First-Out 後進先出)的數據結構。而棧中的插入(推入)和移除(彈出),只發生在一個位置——棧的頂部。ECMAScript爲數組專門提供了push()和pop()方法
var colors = ["red", "blue", "green"];
var item = colors.pop();
alert(colors.length);        //    2
alert(item)                  //    「black」取得最後一項

隊列方法

  • 隊列數據結構的訪問規則是FIFO(First-In-First-Out 先進先出)
  • shift()方法能移出數組的第一項並返回該項,結合使用shift()和push()方法能夠實現
  • unshift()方法能在數組前端添加任意個項並返回新數組的長度, IE7如下的版本老是返回undefined,IE8在非兼容模式下會返回正確的長度值
var colors = ["red", "blue", "green"];
colors.push("black");
var item = colors.shift();
console.log(colors);        //  ["blue", "green", "black"]
console.log(item)                  //    「red」取得最後一項
var colors = new Array();
colors.unshift("red", "green");        // 推入兩項
console.log(colors.length);            // 2

重排序方法

  • 數組存在兩個直接重排序的方法 reverse() sort()
  • reverse()直接返回將原數組倒序排列
  • sort() 調用每項的toString()轉型方法,按照升序排列,即便數組中的每一項都是數值,sort()方法比較的也是字符串
  • sort()可傳入一個比較函數,比較函數接受兩個參數,若是第一個參數應該位於第二個以前
var values = [0, 1, 5, 10, 15];
values.sort();
console.log(values);         // 0,1,10,15,5

// 使用比較函數是sort的最佳使用方式
function compare(value1, value2) {
    if (value1 < value2) {
        return -1;
    } else if (value1 > value2) {
        return 1;
    } else {
        return 0;
    }
}
var values = [0, 1, 10, 15,  5];
values.sort(compare);
console.log(values);         // 0,1,5,10,15

// 對於數值類型或者其valueOf()方法會返回數值類型的對象類型
// 可使用一個更簡單的比較函數
function compare(value1, value2) {
    return value2 - value1
}

操做方法

  • concat() 先建立一個數組副本,再將傳入的元素添加到新數組的末尾
var colors = ["red", "green", "blue"];
var colors2 = colors.concat("yellow", ["black", "brown"]);

alert(colors); // red,green,blue
alert(colors2);    // red,green,blue,yellow,black,brown
  • slice()能夠接收一個或兩個參數,基於當前數組建立新數組,返回指定位置之間的全部項,slice()方法不會影響原數組
  • 若是slice參數有一個負數,則用數組長度加上該數來肯定相應的位置
var colors = ["red", "green", "blue", "yellow", "purple"];
var colors2 = colors.slice(1);            //    green,blue,yellow,purple
var colors3 = colors.slice(1,4);          //    green,blue,yellow
  • splice() 最強大的數組方法,始終返回一個數組,該數組中包含從原始數組中刪除的項(沒有就返回空數組)html

    • 刪除:能夠刪除任意數量的項,只需指定2個參數:要刪除的第一項的位置和要刪除的項數
    • 插入:能夠向指定位置插入任意數量的項,只需提供3個參數:起始位置、0(插入操做沒有要刪除的項因此是0)和要插入的項,多個能夠傳任意個數的參數
    • 替換:能夠向指定位置插入任意數量的項,且同時刪除任意數量的項,刪除的項數沒必要與插入的項數相等
var colors = ["red", "green", "blue"];
var removed = colors.splice(0, 1);                    // 刪除第一項 removed 爲 ["red"]
alert(colors);                                        // ["green", "blue"]

removed = colors.splice(1, 0, "yellow", "orange");    // 從位置1開始插入兩項
console.log(colors);                                  // green,yellow,orange,blue
console.log(removed);                                 // 返回空數組

removed = colors.splice(1, 1, "red", "purple");       // 插入兩項,刪除一項
console.log(colors);                                  // green,red,purple,orange,blue
console.log(removed);                                 // ["yellow"]

位置方法

  • 數組有兩個位置方法,都接收兩個參數:要查找的項和(可選)表示查找氣墊位置的索引,返回查找對應項的位置,沒有找到返回-1。在比較第一個參數與數組中的每一項時,會使用全等操做符;
  • indexOf() 從開頭(位置0)查找
  • lastIndexOf() 從末尾開始向前查找
  • 支持的瀏覽器 IE9+, Firefox2+, safari3+, Opera9.5+ Chrome
var numbers = [1,2,3,4,5,4,3,2,1];
alert(numbers.indexOf(4));            //    3
alert(numbers.lastIndexOf(4));        //    5

alert(numbers.indexOf(4, 4));            //    5
alert(numbers.lastIndexOf(4, 4));        //    3

var person = { name: "Nicholas" };
var people = [{ name: "Nicholas" }];

var morePeople = [people];

alert(people.indexOf(person));            // -1
alert(morePeople.indexOf(person));        // 0
// 兩個引用類型對象值徹底相同,但引用的內存地址不一樣
var a = { name: "obj" }
var b = { name: "obj" }
a == b                    //   false
a === b                    //   false

迭代方法

  • ECMAScript5位數組定義了5個迭代方法,每一個方法都接收兩個參數:要在每一項上運行的函數和(可選的)運行該函數的做用域對象——影響this的值。傳入這些方法中的函數會接收三個參數:數組項的值,該項在數組中的位置和數組對象自己。
  • every():對數組中的每一項運行給定函數,若是該函數對每一項都返回true,則返回true
  • filter():對數組中的每一項運行給定函數,返回該函數會返回true的項組成的數組
  • forEach():對數組中的每一項運行給定函數。這個方法沒有返回值
  • map():對數組中的每一項運行給定函數,返回每次函數調用的結果組成的數組。
  • some():對數組中的每一項運行給定函數,若是該函數對任一項返回true,則返回true。
  • 以上方法都不會修改數組中的包含的值
  • 支持的瀏覽器 IE9+, Firefox2+, safari3+, Opera9.5+ Chrome

歸併方法

  • ECMAScript5新增了兩個歸併數組的方法 reduce()和reduceRight()。迭代數組的全部項,而後構建一個最終返回的值
  • reduce() 從數組的第一項開始,逐個遍歷到最後
  • reduceRight() 則從最後一項開始
  • 支持的瀏覽器 IE9+, Firefox3+, safari4+, Opera10.5+ Chrome
var values = [1,2,3,4,5];
// prev 前一項, cur 迭代的當前項
// 第一次執行回調函數,prev是1,cur是2
var sum = values.reduce(function(prev, cur, index, array) {
    return prev + cur;
});
alert(sum);         // 15

Date類型

  • 下面兩行代碼是等價的,Date構造函數會在後臺調用Date.parse()
  • 不用Date.parse()或Date.UTC() 都是基於系統設置本地時區建立的
  • Date.now() 返回調用時日期和時間的毫秒數,支持的瀏覽器IE9+, Firefox3+, safari3+, Opera10.5+ Chrome
var someDate = new Date(Date.parse("May 25, 2004"));
var someDate = new Date("May 25, 2004");
// GMT時間200年1月1日午夜零時
var y2k = new Date(Date.UTC(2000, 0));
var y2k = new Date(2000, 0);

// GMT時間2005年5月5日下午5:55:55
var allFives = new Date(Date.UTC(2005, 4, 5, 17, 55, 55));
var allFives = new Date(005, 4, 5, 17, 55, 55);
// Date.now()在不支持的瀏覽器中以下寫法
var start = +new Date();
start           // 返回毫秒數
typeof start     // "number"

繼承方法

  • toLocaleString()和toSring()的這一差異僅在調試代碼時比較有用
  • valueOf()方法,不返回字符串,返回日期的毫秒錶示
var date1 = new Date(2007, 0, 1);        // "January 1 , 2007"
var date2 = new Date(2007, 1, 1);        // "February 1, 2007"

console.log(date1 < date2);             // true
console.log(date1 > date2);             // false

日期格式化方法

  • toDateString() 特定格式顯示星期幾、月、日和年
  • toTimeString() 特定格式顯示 時、分、秒和時區
  • toLocaleDateString() 特定於地區格式顯示星期幾、月、日和年
  • toLocaleTimeString() 特定於地區實現的格式顯示時、分、秒
  • toUTCString() 特定於實現的格式UTC日期

日期/時間組件方法

  • 圖表略...

RegExp類型

  • ECMAScript經過regExp類型來支持正則表達式
  • 每一個正則表達式均可帶有一或多個標誌(flags)
  • g:表示全局模式(global),即模式將被應用於全部字符串,而非在發現第一個匹配項時當即中止
  • i:表示不區分大小寫(case-insensitive)模式,即在肯定匹配項時忽略模式與字符串的大小寫
  • m:表示多行模式(multiline),即在到達一行文本末尾時還會繼續查找下一行中是否存在於模式匹配的項
// 匹配字符串中全部「at」的實例
var pattern1 = /at/g;

// 匹配第一個"bat"或"cat",不區分大小寫
var pattern2 = /[bc]at/i;

// 匹配全部以"at"結尾的3個字符的組合,不區分大小寫
var pattern3 = /.at/gi;
  • 模式中使用的全部元字符都必須轉義:( [ { ^ $ | ) ? * + . ] }
  • 使用RegExp構造函數,兩個參數都必須是字符串,全部元字符都要雙重轉義
// 匹配第一個"bat"或"cat", 不區分大小寫
var patter1 = /[bc]at/i;

// 匹配第一個"[bc]at", 不區分大小寫
var pattern2 = /\[bc\]at/i;

// 匹配全部以"at"結尾的3個字符的組合,不區分大小寫
var pattern3 = /.at/gi

// 匹配全部".at",不區分大小寫
var pattern4 = /\.at/gi;
// 使用RegExp構造函數,全部元字符都要雙重轉義
// 兩個參數都必須是字符串
var pattern4 = new RegExp("\\.at", "i");
  • 咱們可使用小括號"()"來指定要重複的子表達式,而後對這個子表達式進行重複,例如:(abc)? 表示0個或1個abc 這裏一 個括號的表達式就表示一個分組 。分組能夠分爲兩種形式,捕獲組非捕獲組
  • 捕獲組能夠經過從左到右計算其開括號來編號 。例如,在表達式 (A)(B(C)) 中,存在四個這樣的組。組零始終表明整個表達式。之因此這樣命名捕獲組是由於在匹配中,保存了與這些組匹配的輸入序列的每一個子序列。在表達式中使用,也能夠在匹配操做完成後從匹配器檢索。前端

    編號 項目
    0 (A)(B(C))
    1 (A)
    2 (B(C))
    3 (C)
  • 以 (?) 開頭的組是純的非捕獲組(?:Pattern),它不捕獲文本 ,也不針對組合計進行計數。就是說,若是小括號中以?號開頭,那麼這個分組就不會捕獲文本,固然也不會有組的編號。非捕獲組則不會捕獲文本,也不會將它匹配到的內容單獨分組來放到內存中。因此,使用非捕獲組較使用捕獲組更節省內存。

RegExp實例屬性

  • RegExp的每一個實例都具備下列屬性,經過這些屬性能夠取得有關模式的各類信息java

    • global 布爾值 表示是否設置了g標誌
    • ignoreCase 布爾值 表示是否設置了i標誌
    • lastIndex 整數 表示開始搜索下一個匹配項字符位置,從0算起
    • multiline 布爾值 表示是否設置了m標誌
    • source 正則表達式的字符串表示,按照字面量形式而非傳入構造函數中的字符串模式返回
var pattern1 = /\[bc\]at/i;
console.log(pattern1.global);            // false
console.log(pattern1.ignoreCase);        // true
console.log(pattern1.multiline);         // false
console.log(pattern1.lastIndex);         // 0
console.log(pattern1.source);            // "\[bc\]at"

RegExp實例方法

  • exec() 專門爲捕獲組而設計的,接收一個參數,即要應用模式的字符串,而後返回包含第一個匹配項信息的數組;或者在沒有匹配項的狀況下返回null
  • 返回的數組雖然是Array的實例,但包含兩個額外的屬性:index和input
  • index表示匹配項在字符串中的位置
  • input表示表達式的字符串
  • 即便在模式中設置了全局標誌(g),exec()每次也只會返回一個匹配項,不設置g的時候,每次都返回第一個匹配項,設置了g的狀況下,每次調用exec()則都會在字符串中繼續查找新匹配項
var txt = "mom and dad and baby";
var pattern = /mom( and dad( and baby)?)?/gi;

var matches = pattern.exec(txt);
console.log(matches);            
//    ["mom and dad and baby", " and dad and baby", " and baby", index: 0, input: "mom and dad and baby", groups: undefined]
  • test() 接收字符串參數,匹配返回true不匹配返回false
var txt = "000-00-0000";
var pattern = /\d{3}-\d{2}-\d{4}/;
if (pattern.test(txt)) {
    alert("The pattern was matched.");
}
  • toString() toLocaleString() 都會返回正則表達式的字面量,與建立表達式的方式無關
  • valueOf() 返回正則表達式自己

RegExp構造函數屬性

  • RegExp構造函數包含一些屬性,適用於做用域中的全部表達式,而且基於所執行的最近一次正則表達式操做而變化
  • 這些屬性分別有一個長屬性名和一個短屬性名(Opera例外,不支持短屬性)
長屬性名 短屬性名 說明
input $_ 最近一次要匹配的字符串。Opera不支持
lastMatch $& 最近一次的匹配項目。Opera不支持
lastParen $+ 最近一次匹配的捕獲組。Opera不支持
leftContext $` input字符串中lastMatch以前的文本。
multiline $* 布爾值 表示是否全部表達式都是用多行模式。IE和Opera未實現此屬性
rightContext $' input字符串中lastMatch以後的文本。
  • 使用這些屬性能夠從exec() test()執行的操做中提取更具體的信息
var txt = "this has been a short summer";
var pattern = /(.)hort/g;

// Oper不支持input,lastMatch,lastParen,multiline
// IE不支持multiline
if (pattern.test(txt)) {
    console.log(RegExp.input);                            // this has been a short summer
    console.log(RegExp.leftContext);                      // this has been a
    console.log(RegExp.rightContext);                     // summer
    console.log(RegExp.lastMatch);                        // short
    console.log(RegExp.lastParen);                        // s
    console.log(RegExp.multiline);                        // false
}
  • 短屬性名打鬥不是有效的ECMAScript標識符,所以必須經過方括號語法來訪問
var txt = "this has been a short summer";
var pattern = /(.)hort/g;


// Oper不支持input,lastMatch,lastParen,multiline
// IE不支持multiline
if (pattern.test(txt)) {
    console.log(RegExp.$_);                            // this has been a short summer
    console.log(RegExp.["$`"]);                      // this has been a
    console.log(RegExp.["$'"]);                     // summer
    console.log(RegExp.["$&"]);                        // short
    console.log(RegExp.["$+"]);                        // s
    console.log(RegExp.["$*"]);                        // false
}
  • 除了上面介紹的幾個屬性以外,還有多達9個用於存儲捕獲組的構造函數屬性:RegExp.$1,RegExp.$2......RegExp.$9
var txt = "this has been a short summer";
var pattern = /(..)or(.)/g;

// 這裏建立了一個包含兩個捕獲組的模式,並用該模式測試了一個字符串。
// 即便test()方法只返回一個布爾值,但RegExp構造函數的屬性$1和$2也會被匹配相應捕獲組的字符串自動填充
if (pattern.test(txt)) {
    console.log(RegExp.$1);        // sh
    console.log(RegExp.$2);        // t
}

模式的侷限性

  • 儘管ECMACScript中的正則表達式功能仍是比較完備的,但仍然缺乏某些語言所支持的高級正則表達式特性
  • 下面列出了不支持的特性web

    • 匹配字符串開始和結尾A 和 Z 錨 (但支持以插入符號 ^ 和美圓符號 $ 來匹配字符串的開始和結尾)
    • 向後查找(lookbehind) (但徹底支持向前查找lookahead)
    • 並集和交集
    • 原子組(atomic grouping)
    • Unicode支持(耽擱字符串除外, 如 uFFFF)
    • 命名的捕獲組(但支持編號的捕獲組)
    • s(single,單行)和 x (free-spacing, 無間隔)匹配模式
    • 條件匹配
    • 正則表達式註釋

Function類型

  • 每一個函數都是Function類型的實例,並且都與其餘引用類型同樣具備屬性和方法
  • 因爲函數是對象,所以函數名實際上也是隻想函數對象的指針,不會與某個函數綁定
function sum (num1, num2) {
    return num1 + num2;
}

// 下面使用函數表達式定義函數的方式幾乎相差無幾
// function後面不必使用函數名,經過變量sum便可飲用函數
// 函數末尾有一個分號,就像聲明其餘變量同樣
var sum = function(num1, num2) {
    return num1 + num2;
};
  • 不推薦 最後一種固定翼函數的方式是使用Function構造函數,能夠接收任意數量的參數,但最後一個參數始終但被當作是函數體,而前面的參數則枚舉出了新函數的參數。這樣會致使解析兩次代碼,第一次是解析常規ECMAScript代碼,第二次是解析傳入構造函數中的字符串,從而影響性能。
// 不推薦
var sum = new Function("num1", "num2", "return num1 + num2");
  • 函數名是指向函數的指針,所以函數名與包含對象指針的其餘變量沒有區別。一個函數可能會有多個名字
function sum (num1, num2) {
    return num1 + num2;
}

var anotherSum = sum;                    // 函數指針的副本賦給了anotherSum

sum = null;                              // 清除了sum變量 anotherSum依然有效
console.log(anotherSum(10, 10));         // 20

沒有重載(深刻理解)

function addSomeNumber(num) {
    return num + 100;
}
function addSomeNumber(num) {
    return numm + 200;
}
var result = addSomeNumber(100);    // 300

// 這個例子中聲明瞭兩個同名函數,而結果是後面的函數覆蓋了前面的函數
// 如下代碼等同於上面的代碼

var addSomeNumber = function (num ) {
    return num + 100;
};
addSomeNumber = function (num ) {
    return num + 200;
};
var result = addSomeNumber(100);    // 300
  • 在建立第二個函數時,實際上覆蓋了引用第一個函數的變量addSomeNumber

函數聲明與函數表達式

  • 解析器會先解讀函數聲明,並使其在執行任何代碼以前可用
  • 函數表達式,則必須等到解析器執行到它所在的代碼行,纔會真正被解釋執行
  • 也能夠同時使用函數聲明和函數表達式,(var sum = function sum () {};)不過在Safari中會致使錯誤
// 不會報錯
alert(sum(10, 10));
function sum(num1, mun2) {
    return num1 + num2;
}
// 報錯
alert(sum(10, 10));
var sum = function (num1, mun2) {
    return num1 + num2;
};

做爲值的函數

  • 函數名自己就是變量,因此函數也能夠做爲值來使用。也就是說,不只能夠像傳遞參數同樣把一個函數傳遞給另外一個函數,並且能夠將一個函數做爲另外一個函數的結果返回
function callSomeFunction(someFunction, someArgument) {
    return someFunction(someArgument);
}

function add10(num) {
    return num + 10;
}

// 傳入函數指針,就不能加(),因此這裏是add10
var result1 = callSomeFunction(add10, 10);
  • 能夠從一個函數中返回另外一個函數
function createComparisonFunction(propertyName) {
    return function(object1, object2) {
        var value1 = object1[propertyName];
        var value2 = object2[propertyName];
        
        if (value1 < value2) {
            return -1;
        } else if (value1 > value2) {
            return 1;
        } else {
            return 0;
        }
    }
}

函數內部屬性

  • 在函數內部,有兩個特殊的對象:arguments this
  • arguments的主要用途保存函數參數,這個對象還有一個屬性callee,該屬性是一個指針,指向擁有這個arguments對象的函數
// 經典的階乘函數
function factorial(num) {
    if (num <= 1) {
        return 1;
    } else {
        return num * factorial(num-1);
    }
}

// 如上面代碼,在函數有名字,並且名字之後也不會變的狀況下,這樣定義沒有問題
// 但這個函數的執行與函數名factorial牢牢耦合在了一塊兒
// 下面的寫法能夠避免這種問題
function factorial(num) {
    if (num <= 1) {
        return 1;
    } else {
        return num * arguments.callee(num-1);
    }
}

var trueFactorial = factorial;

fatorial = function () {
    return 0;
};

console.log(trueFactorial(5));        // 120
console.log(fatorial(5));             // 0
  • this 引用的是函數執行的環境對象——或者說是this 值(當在網頁全局做用域中調用函數時,this對象引用的是window)
window.color = "red"
var o = { color: "blue" };

function sayColor() {
    console.log(this.color);
}

sayColor();        // "red"

o.sayColor = sayColor;
o.sayColor();        // "blue"
  • ECMAScript 5 規範化了另外一個函數對象的屬性:caller 。Opera早起版本不支持,其餘瀏覽器都支持這個ECMAScript 3並無定義的屬性。caller保存着調用當前函數的函數引用,在全局做用用戶中調用當前函數,它的值爲null
function outer() {
    inner();
}

function inner() {
    console.log(inner.caller);
}

// 打印出outer()函數的源碼
// 由於outer調用了inner,因此inner.caller就指向outer()。
outer();
// 爲了實現更鬆散的耦合,也能夠經過arguments.callee.caller來訪問
function outer() {
    inner();
}
function inner() {
    console.log(arguments.callee.caller);
}
outer();
  • 當函數再嚴格模式下運行時,訪問arguments.callee會致使錯誤。ECMAScript 5 還定義了arguments.caller屬性,嚴格模式下也會致使錯誤,而在非嚴格模式下這個屬性始終是undefined。定義這個屬性是爲了分清arguments.caller和函數的caller屬性。以上變化都是爲了增強這門語言的安全性,這樣第三方代碼就不能再相同的環境裏窺視其餘代碼了。
  • 嚴格模式還有一個限制:不能爲函數caller屬性賦值,不然會致使錯誤。

函數屬性和方法

  • 每一個函數都包含兩個屬性:length 和 prototype正則表達式

    • length表示函數但願接收的命名參數的個數
    • prototype 對於引用各種型而言,prototype是保存它們全部實例方法的真正所在。換言之,注入toString() valueOf()等方法實際上都保存在prototype名下,只不過是經過各自對象的實例訪問罷了。在建立自定義引用類型以及實現繼承時,prototype屬性的做用是極爲重要的。
    • 在ECMAScript 5 中,prototype屬性是不可枚舉的,所以使用for-in沒法發現。
  • 每一個函數都包含兩個非繼承而來的方法:apply() call()。這兩個方法的用途都是在特定的做用域中調用函數,實際上等於設置函數體內this對象的值。數組

    • apply()方法接收兩個參數:一個是在其中運行函數的做用域,另外一個是參數數組。其中,第二個參數能夠是Array的實例,也能夠是arguments對象
    • 在嚴格模式下,未指定對象而調用函數,則this值不會轉型爲window。除非明確把函數添加到某個對象或者調用apply() 或 call(),不然this值將是undefined。
    • call()方法與apply()的做用相同,它們的區別僅在於接收參數的方式不一樣。對於call()而言,第一個參數是this值沒有變化,不一樣的是其他參數都直接傳遞給函數。換言之,在使用call()方法時,傳遞給函數的參數必須逐個列舉出來
// callSum1()在執行sum()函數時傳入了this做爲this值,因此傳入的就是window對象
function sum(num1, num2) {
    return num1 + num2;
}
function callSum1(num1, num2) {
    return sum.apply(this, arguments);                //    傳入arguments對象
}

function callSum2(num1, num2) {
    return sum.apply(this, [num1, num2]);            //     傳入數組
}

function callSum3(num1, num2) {
    return sum.call(this, num1, num2);            //     傳入數組
}

// 在全局環境下調用函數,此時this就是window
callSum1(10, 10));                                    // 20
callSum2(10, 10));                                    // 20
callSum3(10, 10));                                    // 20
  • apply() call() 真正強大的地方是可以擴充函數賴以運行的做用域
window.color = "red";
var o = { color: "blue" };

function sayColor() {
    console.log(this.color);
}

sayColor();        // red
sayColor.call(this);        // red
sayColor.call(window);      // red
sayColor.call(o);           // blue
  • 使用call() apply() 來擴充做用域的最大好處,就是對象不須要與方法有任何耦合關係
  • ECMAScript 5 還定義了一個方法: bind() 這個方法會建立一個函數的實例,其this值會被綁定到傳給bind()函數的值.支持bind()方法的瀏覽器IE9+, Firefox 4+,Safari 5.1+, Opera 12+ Chrome
window.color = "red";
var o = { color: "blue" };
function sayColor() {
    console.log(this.color);
}

var objectSayColor = sayColor.bind(o);
objectSayColor();        // blue
  • 每一個函數繼承的toLocaleString() 和 toString() valueOf() 方法都之中返回函數的代碼。

基本包裝類型

  • 爲了便於操做基本類型值,ECMAScript還提供了3個特殊的引用類型: Boolean, Number, String
  • 每當讀取一個基本類型值得時候,後臺就會建立一個對應的基本包裝類型的對象,從而讓咱們可以調用一些方法來操做這些數據。
// 後臺自動完成下列處理
// 建立String類型的一個實例
// 在實例上調用指定的方法
// 銷燬這個實例
var s1 = "some text";
var s2 = s1.substring(2);

// 能夠想象執行了如下代碼
var s1 = new String("some text");
var s2 = s1.substring(2);
s1 = null;
// 通過此番處理,基本的字符串值就變得跟對象同樣了。
  • 以上步驟也分別適用於Boolean Number類型對應的布爾值和數字值
  • 引用類型與基本包裝類型的主要區別就是對象的生存期。使用new操做符建立的引用類型的實例,在執行流離開當前做用域以前都一直保存在內存中。而自動建立的基本包裝類型的對象,則只存在於一行代碼的執行瞬間,而後當即銷燬。這意味着咱們不能再運行時爲基本類型值添加屬性和方法
var s1 = "some text";
// 這裏建立的String對象在執行第三行代碼時就已經被銷燬了
s1.color = "red";
// 這裏又建立了本身的String對象,而該對象沒有color屬性
console.log(s1.color);          // undefined
  • 能夠顯式的調用Boolean,Number,String來建立基本包裝類型的對象。但應該在必要的時候這樣作,由於很容易分不清實在處理基本類型仍是引用類型的值。
  • 對基本包裝類型的實例調用typeof會返回"object",並且全部基本包裝類型的對象都會被轉爲布爾值true
  • Object構造函數也會像工廠方法同樣,根據傳入值的類型返回相應基本包裝類型的實例。
var obj = new Object("some text");
console.log(obj instanceof String);         // true
  • 使用new調用基本包裝類型的構造函數,與直接調用同名的轉型函數是不同的
// number中保存的是基本類型的值25
// obj中保存的是Number的實例(對象)
var value = "25";
var number = Number(value);     // 轉型函數
console.log(typeof number);     // "number"

var obj = new Number(value);    // 構造函數
console.log(typeof obj);        // "object"

Boolean類型

  • Boolean類型的實例重寫了valueOf()方法,返回基本類型值true或false
  • 重寫了toString()方法,返回字符串"true" "false"
  • 但是Boolean對象在ECMAScript中的用處不大,由於常常形成誤解。其中最多見的問題就是在布爾表達式中使用Boolean對象
  • 基本類型與引用類型的布爾值還有兩個區別。瀏覽器

    • typeof操做符對基本類型返回"boolean", 引用類型返回"object"
    • 因爲Boolean對象是Boolean類型的實例,因此使用instanceof操做符測試Boolean對象會返回true,而測試基本類型的布爾值則返回false
// 使用Boolean對象生成的實例,在布爾表達式中,等同於一個普通對象
// 因此result1 返回true
var falseObject = new Boolean(false);
var result1 = falseObject && true;                   // true

var falseValue = false;
var result2 = falseValue && true;                   // false

console.log(typeof falseOjbect);                    // object
console.log(typeof falseValue);                     // boolean
console.log(falseObject instanceof Boolean);        // true
console.log(falseValue instanceof Boolean);         // false
  • 理解基本類型的布爾值與Boolean對象之間的區別很是重要——固然,咱們建議是永遠不要使用Boolean對象

Number類型

  • toLocaleString() toString() 返回字符串形式的數值
  • valueOf() 返回基本類型的數值
  • toString() 傳遞一個表示基數的參數,告訴它返回幾進制的字符串形式
var num = 10;
console.log(num.toString());                      // "10"
console.log(num.toString(2));                     // "1010"
console.log(num.toString(8));                     // "12"
console.log(num.toString(10));                    // "10"
console.log(num.toString(16));                    // "a"
  • 除了繼承的方法,NUmber類型還提供了一些用於將數值格式化爲字符串的方法。安全

    • toFixed() 按照指定的小數位返回數值的字符串表示。數據結構

      • 超出位數的會進行攝入,舍入規則因瀏覽器而異,IE8及以前不能正確舍入的範圍在{(-0.94,-0.5],[0.5,0.94)])},在這個範圍內,IE會返回0,而不是-1或1,IE9修復了這個問題。
      • 標準實現的規範,toFixed() 尅表示帶有0到20個小數位的數值,有些瀏覽器能夠實現更多
    • toExponential() 返回以指數表示法(也稱e表示法)表示的數值的字符串形式。一樣接受一個參數,制定輸出結果的小數位
    var num = 10;
    console.log(num.toExponentail(1));                // "1.0e+1"
    • toPrecision() 這個方法會返回一個合適的表達方式 返回固定大小(fixed)格式,也可能返回指數(exponential)格式
    var num = 99;
    console.log(num.toPrecision(1));                 // "1e+2"
    console.log(num.toPrecision(2));                 // "99"
    console.log(num.toPrecision(3));                 // "99.0"
  • 一樣,咱們不建議直接實例化Number類型,緣由與建立Boolean對象同樣
var numberObject = new Number(10);
var numberValue = 10;
console.log(typeof numberObject);        // "object"
console.log(typeof numberValue);         // "number"
console.log(numberObject instanceof Number);         // true
console.log(numberValue instanceof Number);          // false

String類型

  • 繼承的方法 valueOf() toLocaleString() toString() 都返回字符串所表示你的基本字符串值
  • String類型每一個實例都有一個length屬性,表示字符串中包含多少個字符。即便字符串中包含雙字節字符串(不是佔一個字節的ASCII字符),每一個字符也仍然算一個字符。
var stringValue = "hello world";
console.log(stringValue.length);         // "11"

字符方法

  • 兩個用於訪問字符串中特定字符的方法是 charAt() charCodeAt() 都接受一個參數,基於0的字符位置。
  • charAt() 方法以單字符字符串的形式返回給定位置的那個字符(ECMAScript中沒有字符類型)
var stringValue = "hello world";
console.log(stringValue.charAt(1));     // "e"
  • charCodeAt() 返回字符編碼
var stringValue = "hello world";
console.log(stringValue.charCodeAt(1));     // "101" 小寫e的字符編碼
  • ECMAscript還定義了方括號訪問字符的方法 IE7及之前的版本會返回undefined值
var stringValue = "hello world";
console.log(stringValue[1]);     // "e"

字符串的操做方法

  • concat() 用於將一個或多個字符串拼接起來,返回拼接獲得的新字符串,能夠接受任意多個參數。雖然concat()實現了拼接方法,但實踐中更多仍是使用加號操做符(+),簡單易行。
var stringValue = "hello ";
var result1 = stringValue.concat("world");     // "hello world"
var result2 = stringValue.concat("world", "!");     // "hello world!"
console.log(stringValue);                     // "hello
  • ECMAscript還提供了三個基於子字符串建立新字符串的方法 slice() substr() substring()

    • 這個三個方法都會返回被操做符字符串的一個子字符串,並且也都接收一個或兩個參數。第一個參數制定字符串的開始位置,第二個(可選)表示子字符串到哪裏結束
    • 三個方法都不會修改字符串自己的值——它們只是返回一個基本類型的字符串值,對於原始字符串沒有任何影響
    • slice() substring() 的第二個參數制定的是字符串最後一個字符後的位置
    • substr() 的第二個參數制定的則是返回的字符個數
    var stringValue = "hello world";
    console.log(stringValue.slice(3));       // "lo world"
    console.log(stringValue.substring(3));   // "lo world"
    console.log(stringValue.substr(3));      // "lo world"
    
    // substr() 方法第二個參數制定是要返回的字符個數
    // 而slice()  substring() 指定的是結束位置 
    // "world"中的o處於位置7,所以結果中不包含o
    console.log(stringValue.slice(3, 7));       // "lo w"
    console.log(stringValue.substring(3, 7));   // "lo w"
    console.log(stringValue.substr(3, 7));      // "lo worl"
    • 在參數是負值的狀況下,它們的行爲就不盡相同了
    var stringValue = "hello world";
    
    // slice() 會將傳入的負值與字符串的長度相加
    // substring() 會將傳入的負值轉換爲0
    // substr() 第一個參數若是是負值會加上字符串長度,第二個參數若是是負值,就會轉換爲0
    console.log(stringValue.slice(-3));       // "rld"
    console.log(stringValue.substring(-3));   // "hello world"
    console.log(stringValue.substr(-3));      // "rld" 
    
    console.log(stringValue.slice(3, -4));       // "lo w"
    // 這裏實際上至關於substring(3, 0),而這個方法會將較小的參數做爲開始位置
    console.log(stringValue.substring(3, -4));   // "hel"
    console.log(stringValue.substr(3, -4));      // ""

字符串的位置方法

  • indexOf() lastIndexOf() 從一個字符串搜索給定的字符串,而後返回字符串的位置(沒有找到就返回-1)。lastIndexOf() 從末尾向前搜索
  • 兩個方法均可以接受第二個參數,表示從字符串中的哪一個位置開始搜索。indexOf() 會忽略置頂位置以前的向後搜索,而lastIndexOf() 則相反
var stringValue = "hello world";
console.log(stringValue.indexOf("o"));       // 4
console.log(stringValue.lastIndexOf("o"));   // 7

console.log(stringValue.indexOf("o", 6));       // 7
console.log(stringValue.lastIndexOf("o", 6));   // 4
  • 在使用第二個參數的狀況下,能夠經過循環調用indexOf()或lastIndexOf()來找到全部匹配的子字符串
var stringValue = "Lorem ipsum dolor sit amet, consectetur adipisicing elit";
var positions = new Array();
var pos = stringValue.indexOf("e");

while(pos > -1) {
  positions.push(pos);
  pos = stringValue.indexOf("e", pos + 1);
}

console.log(posisionts);                 // [3, 24, 32, 35, 52]

trim() 方法

  • ECMAScript爲全部字符串定義了trim()方法。建立一個字符串的副本,刪除前置及後綴的全部空格,而後返回結果
  • IE9+, Firefox3.5+, Safari5+, Opera10.5+, Chrome 8+ 還支持trimLeft() trimRight()
var str = "    hello world     "     
str.trim();                           // "hello world"
console.log(str);                     // "    hello world     "

字符串大小寫轉換方法

  • toLowerCase(), toUpperCase() 是兩個經典方法,借鑑自java.lang.String的同名方法
  • toLocaleLowerCase(), toLocaleUpperCase() 方法則是針對特定地區的實現。部分地區(包括簡體中文),和上面兩個方法獲得的值相同,但少數語言(如土耳其語)會爲Unicode大小寫轉換應用特殊的規則,這時就必須使用針對地區的方法來保證明現的正確的轉換
var stringValue = "hello world";
console.log(stringValue.toLocaleUpperCase());                 // "HELLO WORLD"
console.log(stringValue.toUpperCase());                       // "HELLO WORLD"
console.log(stringValue.toLocaleLowerCase());                 // "hello world"
console.log(stringValue.toLowerCase());                       // "hello world"

字符串的模式匹配方法

  • match() 在字符串上調用這個方法,本質上與調用RegExp的exec()方法相同。只接收一個參數,要麼是一個正則表達式,要麼是一個RegExp對象
var txt = "cat, bat, sat, fat";
var pattern = /.at/;

// 與pattern.exec()相同
var matches = txt.match(pattern);
console.log(matches.index);                  // 0
console.log(matches[0]);                     // "cat"
console.log(matches.lastIndex);              // 0
  • 另外一個用於查找模式的方法是search() 惟一的參數與match()相同,返回字符串中第一個匹配項的索引;若是沒有返回-1
var txt = "cat, bat, sat, fat";
var pos = txt.search(/at/);
console.log(pos);                  // 1
  • 爲了簡化替換子字符串的操做,ECMAscript提供了replace()方法,兩個參數,一個是RegExp對象或者一個字符串(這個字符串不會被轉成正則表達式),第二個參數能夠是一個字符串或者一個函數。若是第一個參數是字符串,那麼只會替換掉第一個子字符串。要想替換全部子字符串,惟一的辦法就是提供一個正則表達式,而起要制定全局標識(g)

    var txt = "cat, bat, sat,  fat";
    var result = txt.replace("at", "ond");             // "cound, bat, sat, fat"
    result = txt.replace(/at/g, "ond");                // "cond, bond, sond, fond"
    • 第二個參數是字符串,還可使用一些特殊子反覆序列,將正則表達式操做獲得的值插入到結果字符串中。

| 字符序列 | 替換文本 |
| -------- | ----------------------------------------------------------------------------------------------------------- |
| $$ | $ |
| $& | 匹配整個模式的子字符串。與RegExp.lastMatch的值相同 |
| $' | 匹配子字符串以前的字符串。與RegExp.leftContext的值相同 |
| $` | 匹配子字符串以後的字符串。與RegExp.rightContext的值相同 |
| $n | 匹配第n個捕獲組的子字符串,其中n等於0~9。$0,$1...$9 。若是正則表達式中沒有定義捕獲組,則使用空字符串 |
| $nn | 匹配第nn個捕獲組的子字符串,其中n等於01~99。$01,$02...$99 。若是正則表達式中沒有定義捕獲組,則使用空字符串 |

var txt = "cat, bat, sat, fat";
result = txt.replace(/(.at)/g, "word ($1)");         
// word (cat), word (bat), word (sat), word (fat)
    • 第二個參數是函數。在只有一個匹配項(即與模式匹配的字符串)的狀況下,會向這個函數傳遞三個參數:模式的匹配項(定義了多個捕獲組,這裏就會有多個)、模式匹配項在字符串中的位置和原始字符串。
    function htmlEscape(text) {
      return text.replace(/[<>"&]/g, function(match, pos, orginalText) {
        switch (match) {
          case "<":
            return "&lt;";
          case ">":
            return "&gt;";
          case "&":
            return "&amp;";
          case "\"":
            return "&quot;";
        }
      });
    }
    console.log(htmlEscape("<p class=\"greeting\">Hello world!</p>"))
    //  &lt;p class=&quot;greeting&quot;&gt;Hello world!&lt;/p&gt;
    • split() 方法能夠基於指定的分隔符將一個字符串分割成多個子字符串,並將結果放在一個數組中。分隔符能夠是字符串,也能夠是一個RegExp對象(這個方法不會將字符串當作正則表達式)。split() 方法能夠接受可選的第二個參數,用於指定數組的大小,以便確保返回的數組不會超過既定大小。
    var colorText = "red,blue,green,yellow";
    var colors1 = colorText.split(",");                  // ["red", "blue", "green", "yellow"]
    var colors2 = colorText.split(",", 2);               // ["red", "blue"]
    
    // 須要注意的是,返回結果第一項和最後一項是空字符串
    // /[^\,]+/ 表示匹配逗號以前的單詞 不包括逗號 匹配項就是
    // "red" "blue" 「green" "yellow"
    // "red"以前和「yellow"以後沒有字符,因此第一項和最後一項是空字符串
    var colors3 = colorText.split(/[^\,]+/);             // ["", ",", ",", ",", ""]

    localeCompare() 方法

    • 這個方法比較兩個字符串,並返回下列值中的一個:

      • 若是字符串在字母表中應該排在字符串參數以前,則返回一個負數,(大多數狀況下是-1,具體的值要視實現而定)
      • 若是字符串等於字符串參數,則返回0
      • 若是字符串在字母表中應該排在字符串參數以後,則返回一個正數(大多數狀況下是1, 具體的值一樣要視實現而定)。
    var stringValue = "yellow";
    console.log(stringValue.localeCompare("brick"));                        // 1
    console.log(stringValue.localeCompare("yellow"));                       // 0
    console.log(stringValue.localeCompare("zoo"));                          // -1
    • 再次強調,由於localeCompared() 返回的數值取決於實現,因此最好是像下面所示
    function determineOrder(value) {
      var result = stringValue.localeCompare(value);
      if (result < 0) {
        console.log("The string 'yellow' comes before the string '" + value + "'.");
      } else if (result > 0) {
        console.log("The string 'yellow' comes after the string '" + value + "'.");
      } else {
        console.log("The string 'yellow' is equal to the string '" + value + "'.");
      }
    }
    
    determineOrder("brick");
    determineOrder("yellow");
    determineOrder("zoo");

    fromCharCode() 方法

    • 這個方法的任務是接收一或多個字符編碼,而後將它們轉換成一個字符串
    console.log(String.fromCharCode(104, 101, 108, 108, 111));    // "hello"

    HTML 方法

    • 早期的web瀏覽器實現了一些專門用於簡化HTML格式化任務的方法,不建議使用

    單體內置對象

    • ECMA-262對內置對象的定義:「由ECMAScript實現提供的、不依賴於宿主環境的對象,這些對象在ECMAScript程序執行以前就已經存在了。」意思是開發者沒必要顯式的實例化內置對象,由於它們已經實例化了。

    Global 對象

    • ECMAScript中的Global對象在某種意義上是做爲一個終極的「兜底兒對象」。不屬於任何其餘對象的屬性和方法,最終都是它的屬性和方法。
    • 全部在全局做用域中定義的屬性和函數都是Global對象的屬性。
    • 諸如 isNaN(), isFinite(), parseInt(), parseFloat() 實際上全都是Global對象的方法。除此以外,Global還包含其餘一些方法。

    URI編碼方法

    • Gloabal對象的encodeURI() 和 encodeURIComponent() 方法能夠對URI(Uniform Resource Identifiers, 通用資源標識符)進行編碼,以便發送給瀏覽器。有效的URI中不能包含某些字符,例如空格。而這兩個URI編碼方法就能夠對URI進行編碼,它們特殊的UTF-8編碼替換全部無效的字符,從而讓瀏覽器可以接受和理解。
    • encodeURI() 主要用於整個URI(例如 http://www.wrox.com/illegal value.htm) 不會對自己屬性URI的特殊字符進行編碼,例如冒號、正斜槓、問好和井字號
    • encodeURIComponent() 主要用於對URI中的某一段(例如前面URI中的illegal value.htm)進行編碼。會對發現的任何非標準字符進行編碼。
    var uri = "http://www.wrox.com/illegal value.htm#start";
    encodeURI(rui);                  // "http://www.wrox.com/illegal%20value.htm#start"
    encodeURIComponent(rui);        // "http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start"
    
    // encodeURI 只對空格編碼
    // encodeURIComponents 全部非字母數字字符
    • 與encodeURI() 和 encodeURIComponent() 方法對應的是 decodeURI() decodeURIComponent()
    • dencodeURI() 只能對encodeURI()替換的字符進行編碼。%20替換成一個空格,但不會對%23(#)做處理
    • decodeURIComponent() 能解碼全部字符

    eval() 方法

    • 最後一個,大概也是ECMAScript中最強大的方法。它只接受一個參數,即,要執行的的ECMAScript(或 JavaScript)字符串
    • eval() 中建立的任何變量或函數都不會被提高,由於在解析代碼的時候,它們被包含在一個字符串中,只在eval() 執行的時候建立
    eval("var msg = 'hello world';");
    console.log(msg);                       // hello world
    
    eval("function sayHi() { alert('hi'); }");
    sayHi();
    • 嚴格模式下,在外部訪問不到eval()中建立的任何變量或函數,所以前面兩個例子都會致使錯誤。
    • 在嚴格模式下,爲eval賦值也會致使錯誤
    "use strict"
    eval = "hi";           // causes error
    • 使用eval()時必須極爲謹慎,特別實在用它執行用戶輸入數據的狀況下。不然可能會有惡意用戶輸入威脅你的站點或應用程序安全的代碼(即所謂的代碼注入

    Global對象的屬性

    • 有些屬性以前介紹過,諸如 undefined, NaN, Infinity 都是Global對象的屬性。此外全部原生引用類型的構造函數,像Object Function也都是Global對象的屬性
    屬性 說明
    undefined 特殊值undefined
    NaN 特殊值NaN
    Infinity 特殊值Infinity
    object 構造函數object
    Array 構造函數Array
    Function 構造函數Function
    Boolean 構造函數Boolean
    String 構造函數String
    Number 構造函數Number
    Date 構造函數Date
    RegExp 構造函數RegExp
    Error 構造函數Error
    EvalError 構造函數RegExp
    RangeError 構造函數RangeError
    ReferenceError 構造函數ReferenceError
    SyntaxError 構造函數SyntaxError
    TypeError 構造函數TypeError
    URIError 構造函數URIError
    • ECMAScript 5 明確進制給undefined, NaN 和 Infinity 賦值, 這樣作即便在非嚴格模式下也會致使錯誤。

    window對象

    • ECMAScript 雖然沒有指出如何直接訪問global對象,但Web瀏覽器都是將這個全局對象做爲window對象的一部分加以實現。所以全局做用域中聲明的全部變量和函數,就都成爲了window對象的屬性
    • 另外一種取得Global對象的方法是使用this
    var global = function() {
      return this;
    }();

    Math 對象

    • 與JavaScript直接編寫的計算功能相比,Math對象提供的計算功能執行起來要快的多。
    • Math對象的屬性
    屬性 說明
    Math.E 天然對數的底數,即常量e的值
    Math.LN10 10的天然對數
    Math.LN2 2的天然對數
    Math.LOG2E 以2爲底e的對數
    Math.LOG10E 以10爲底e的對數
    Math.PI π的值
    Math.SQRT1_2 1/2的平方根
    Math.SQRT2 2的平方根
    • min() max() 方法用於肯定一組數值中的最小值和最大值。能夠接收任意個數值參數。

      var max = Math.max(3, 54, 32, 16);  // 54
      var min = Math.min(3, 54, 32, 16);  // 3
      • 找到數組中的最大或最小值,能夠像下面這樣使用
      • 這個技巧的關鍵是把Math做爲apply()的第一個參數,從而正確的設置this值,而後能夠將任何數組做爲第二個參數(做爲arguments對象)
      var values = [1, 2, 3, 5, 6, 7, 8];
      // 這個寫法至關於 把數組的項做爲一個個數值參數傳給函數
      // Math.max(1, 2, 3, 5, 6, 7, 8)
      var max = Math.max.apply(Math, values);
      var min = Math.min.apply(Math, values);
    • 舍入方法 將小數值舍入爲整數的幾個方法:Math.ceil(), Math.floor(), Math.round()

      • Math.ceil() 執行向上舍入,即它老是將數值向上舍入爲最接近的整數
      • Math.floor() 執行向下舍入,即它老是將數值向下舍入爲最接近的整數
      • Math.round() 執行標準舍入,即它老是將數值四捨五入爲最接近的整數
    • random() 返回大於等於0小於1的一個隨機數
    // 隨機生成一個1到10之間的數值
    var num = Math.floor(Math.random() * 10 + 1);
    
    function selectFrom(lowerValue, upperValue) {
      var choices = upperValue - lowerValue + 1;
      return Math.floor(Math.random() * choices + lowerValue);
    }
    var num = selectFrom(2, 10);                   // 介於2和10之間(包括2和10)的一個數值
    
    // 利用這個函數能夠方便的從數組中隨機取出一項
    var colors = ["red", "green", "blue", "yellow", "black", "purple", "brown"]
    var color = colors[selectFrom(0, colors.length - 1)];

    其餘方法

    方法 說明
    Math.abs(num) 返回num的絕對值
    Math.exp(num) 返回Math.E的num次冪
    Math.log(num) 返回num的天然對數
    Math.pow(num, power) 返回num的power次冪
    Math.sqrt(num) 返回num的平方根
    Math.acos(x) 返回x的反餘弦值
    Math.asin(x) 返回x的反正弦值
    Math.atan(x) 返回x的反正切值
    Math.atan2(y,x) 返回y/x的反正切值
    Math.cos(x) 返回x的餘弦值
    Math.sin(x) 返回x的正弦值
    Math.tan(x) 返回x的正切值
    相關文章
    相關標籤/搜索