摘要:單體內置對象對內置對象的定義是由實現提供的不依賴于宿主環境的對象,這些對象在程序執行之前就已經存在了。還定義了兩個單體內置對象和。此外,所有原生引用類型的構造函數,像和,也都是對象的屬性。
單體內置對象
ECMA-262 對內置對象的定義是「由 JavaScript 實現提供的、不依賴于宿主環境的對象,這些對象在 JavaScript 程序執行之前就已經存在了」。意思就是說,開發人員不必顯式地實例化內置對象,因為它們已經實例化了。前面我們已經介紹了大多數內置對象,例如 Object、Array 和 String。ECMA-262 還定義了兩個單體內置對象:Global 和 Math。
Global 對象Global 對象可以說是 JavaScript 中最特別的一個對象了,因為不管你從什么角度上看,這個對象都是不存在的。Global 對象在某種意義上是作為一個終極的「兜底兒對象」來定義的。換句話說,不屬于任何其他對象的屬性和方法,最終都是它的屬性和方法。所有在全局作用域中定義的屬性和函數,都是 Global 對象的屬性。本書前面介紹過的那些函數,諸如 isNaN()、isFinite()、parseInt() 以及 parseFloat(),實際上全都是 Global 對象的方法。除此之外,Global 對象還包含其他一些方法。
URI 編碼方法Global 對象的 encodeURI() 和 encodeURIComponent() 方法可以對 URI(Uniform Resource Identifiers,通用資源標識符)進行編碼,以便發送給瀏覽器。有效的 URI 中不能包含某些字符,例如空格。而這兩個 URI 編碼方法就可以對 URI 進行編碼,它們用特殊的 UTF-8 編碼替換所有無效的字符,從而讓瀏覽器能夠接受和理解。
其中,encodeURI() 主要用于整個 URI,而 encodeURIComponent() 主要用于對 URI 中的某一段進行編碼。它們的主要區別在于,encodeURI() 不會對本身屬于 URI 的特殊字符進行編碼,例如冒號、正斜杠、問號和井字號;而 encodeURIComponent() 則會對它發現的任何非標準字符進行編碼。來看下面的例子。
var uri = "http://shijiajie.com/illegal value.htm#start"; console.log(encodeURI(uri)); // "http://shijiajie.com/illegal%20value.htm#start" console.log(encodeURIComponent(uri)); // "http%3A%2F%2Fshijiajie.com%2Fillegal%20value.htm%23start"
使用 encodeURI() 編碼后的結果是除了空格之外的其他字符都原封不動,只有空格被替換成了 %20。而 encodeURIComponent() 方法則會使用對應的編碼替換所有非字母數字字符。這也正是可以對整個 URI 使用 encodeURI(),而只能對附加在現有 URI 后面的字符串使用 encodeURIComponent() 的原因所在。
一般來說,我們使用 encodeURIComponent() 方法的時候要比使用 encodeURI() 更多,因為在實踐中更常見的是對查詢字符串參數而不是對基礎 URI 進行編碼。
與 encodeURI() 和 encodeURIComponent() 方法對應的兩個方法分別是 decodeURI() 和 decodeURIComponent()。其中,decodeURI() 只能對使用 encodeURI() 替換的字符進行解碼。例如,它可將 %20 替換成一個空格,但不會對 %23 作任何處理,因為 %23 表示井字號 #,而井字號不是使用 encodeURI() 替換的。同樣地,decodeURIComponent() 能夠解碼使用 encodeURIComponent() 編碼的所有字符,即它可以解碼任何特殊字符的編碼。來看下面的例子:
var uri = "http%3A%2F%2Fshijiajie.com%2Fillegal%20value.htm%23start"; console.log(decodeURI(uri)); // http%3A%2F%2Fshijiajie.com%2Fillegal value.htm%23start console.log(decodeURIComponent(uri)); // http://shijiajie.com/illegal value.htm#start
這里,變量 uri 包含著一個由 encodeURIComponent() 編碼的字符串。在第一次調用 decodeURI() 輸出的結果中,只有 %20 被替換成了空格。而在第二次調用 decodeURIComponent() 輸出的結果中,所有特殊字符的編碼都被替換成了原來的字符,得到了一個未經轉義的字符串(但這個字符串并不是一個有效的 URI)。
eval() 方法eval() 方法就像是一個完整的 JavaScript 解析器,它只接受一個參數,即要執行的 JavaScript 字符串。看下面的例子:
eval("console.log("hi")");
這行代碼的作用等價于下面這行代碼:
console.log("hi");
當解析器發現代碼中調用 eval() 方法時,它會將傳入的參數當作實際的 JavaScript 語句來解析,然后把執行結果插入到原位置。通過 eval() 執行的代碼被認為是包含該次調用的執行環境的一部分,因此被執行的代碼具有與該執行環境相同的作用域鏈。這意味著通過 eval() 執行的代碼可以引用在包含環境中定義的變量,舉個例子:
var msg = "hello world"; eval("console.log(msg)"); // "hello world"
可見,變量 msg 是在 eval() 調用的環境之外定義的,但其中調用的 console.log() 仍然能夠顯示 "hello world"。這是因為上面第二行代碼最終被替換成了一行真正的代碼。同樣地,我們也可以在 eval() 調用中定義一個函數,然后再在該調用的外部代碼中引用這個函數:
eval("function sayHi() { console.log("hi"); }"); sayHi(); // "hi"
顯然,函數 sayHi() 是在 eval() 內部定義的。但由于對 eval() 的調用最終會被替換成定義函數的實際代碼,因此可以在下一行調用 sayHi() 。對于變量也一樣:
eval("var msg = "hello world";"); console.log(msg); // "hello world"
在 eval() 中創建的任何變量或函數都不會被提升,因為在解析代碼的時候,它們被包含在一個字符串中;它們只在 eval() 執行的時候創建。
嚴格模式下,在外部訪問不到 eval() 中創建的任何變量或函數,因此前面兩個例子都會導致錯誤。同樣,在嚴格模式下,為 eval 賦值也會導致錯誤:
"use strict"; eval = "hi"; // causes error
能夠解釋代碼字符串的能力非常強大,但也非常危險。因此在使用 eval() 時必須極為謹慎,特別是在用它執行用戶輸入數據的情況下。否則,可能會有惡意用戶輸入威脅你的站點或應用程序安全的代碼(即所謂的代碼注入)。
Global 對象的屬性Global 對象還包含一些屬性,其中一部分屬性已經在本書前面介紹過了。例如,特殊的值 undefined、NaN 以及 Infinity 都是 Global 對象的屬性。此外,所有原生引用類型的構造函數,像 Object 和 Function,也都是 Global 對象的屬性。下表列出了 Global 對象的所有屬性。
屬性 | 說明 | 屬性 | 說明 |
---|---|---|---|
undefined | 特殊值undefined | Date | 構造函數Date |
NaN | 特殊值NaN | RegExp | 構造函數RegExp |
Infinity | 特殊值Infinity | Error | 構造函數Error |
Object | 構造函數Object | EvalError | 構造函數EvalError |
Array | 構造函數Array | RangeError | 構造函數RangeError |
Function | 構造函數Function | ReferenceError | 構造函數ReferenceError |
Boolean | 構造函數Boolean | SyntaxError | 構造函數SyntaxError |
String | 構造函數String | TypeError | 構造函數TypeError |
Number | 構造函數Number | URIError | 構造函數URIError |
ECMAScript 5 明確禁止給 undefined、NaN 和 Infinity 賦值,這樣做即使在非嚴格模式下也會導致錯誤。
window 對象JavaScript 雖然沒有指出如何直接訪問 Global 對象,但 Web 瀏覽器都是將這個全局對象作為 window 對象的一部分加以實現的。因此,在全局作用域中聲明的所有變量和函數,就都成為了 window 對象的屬性。來看下面的例子。
var color = "red"; function sayColor(){ console.log(window.color); } window.sayColor(); // "red"
JavaScript 中的 window 對象除了扮演規定的 Global 對象的角色外,還承擔了很多別的任務。
Math 對象JavaScript 還為保存數學公式和信息提供了一個公共位置,即 Math 對象。與我們在 JavaScript 直接編寫的計算功能相比,Math 對象提供的計算功能執行起來要快得多。Math 對象中還提供了輔助完成這些計算的屬性和方法。
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的平方根(即2的平方根的倒數) |
Math.SQRT2 | 2的平方根 |
Math 對象還包含許多方法,用于輔助完成簡單和復雜的數學計算。其中,min() 和 max() 方法用于確定一組數值中的最小值和最大值。這兩個方法都可以接收任意多個數值參數,如下面的例子所示。
var max = Math.max(3, 54, 32, 16); console.log(max); // 54 var min = Math.min(3, 54, 32, 16); console.log(min); // 3
要找到數組中的最大或最小值,可以像下面這樣使用 apply() 方法。
var values = [1, 2, 3, 4, 5, 6, 7, 8]; var max = Math.max.apply(Math, values); console.log(max); // 8
這個技巧的關鍵是把 Math 對象作為 apply() 的第一個參數,從而正確地設置 this 值。然后,可以將任何數組作為第二個參數。
舍入方法下面來介紹將小數值舍入為整數的幾個方法:Math.ceil()、Math.floor() 和 Math.round()。這三個方法分別遵循下列舍入規則:
Math.ceil() 執行向上舍入,即它總是將數值向上舍入為最接近的整數;
Math.floor() 執行向下舍入,即它總是將數值向下舍入為最接近的整數;
Math.round() 執行標準舍入,即它總是將數值四舍五入為最接近的整數。
下面是使用這些方法的示例:
console.log(Math.ceil(25.9)); // 26 console.log(Math.ceil(25.5)); // 26 console.log(Math.ceil(25.1)); // 26 console.log(Math.round(25.9)); // 26 console.log(Math.round(25.5)); // 26 console.log(Math.round(25.1)); // 25 console.log(Math.floor(25.9)); // 25 console.log(Math.floor(25.5)); // 25 console.log(Math.floor(25.1)); // 25random() 方法
Math.random() 方法返回介于0和1之間一個隨機數,包括0而不包括1。對于某些站點來說,這個方法非常實用,因為可以利用它來隨機顯示一些名人名言和新聞事件。套用下面的公式,就可以利用 Math.random() 從某個整數范圍內隨機選擇一個值。
值 = Math.floor(Math.random() * 可能值的總數 + 第一個可能的值)
公式中用到了 Math.floor() 方法,這是因為 Math.random() 總返回一個小數值。而用這個小數值乘以一個整數,然后再加上一個整數,最終結果仍然還是一個小數。舉例來說,如果你想選擇一個1到10之間的數值,可以像下面這樣編寫代碼:
var num = Math.floor(Math.random() * 10 + 1);
總共有10個可能的值(1到10),而第一個可能的值是1。而如果想要選擇一個介于2到10之間的值,就應該將上面的代碼改成這樣:
var num = Math.floor(Math.random() * 9 + 2);
從2數到10要數9個數,因此可能值的總數就是9,而第一個可能的值就是2。多數情況下,其實都可以通過一個函數來計算可能值的總數和第一個可能的值,例如:
function selectFrom(lowerValue, upperValue) { var choices = upperValue - lowerValue + 1; return Math.floor(Math.random() * choices + lowerValue); } var num = selectFrom(2, 10); console.log(num); // 介于2和10之間(包括2和10)的一個數值
函數 selectFrom() 接受兩個參數:應該返回的最小值和最大值。而用最大值減最小值再加1得到了可能值的總數,然后它又把這些數值套用到了前面的公式中。這樣,通過調用 selectFrom(2,10) 就可以得到一個介于2和10之間(包括2和10)的數值了。利用這個函數,可以方便地從數組中隨機取出一項,例如:
var colors = ["red", "green", "blue", "yellow", "black", "purple", "brown"]; var color = colors[selectFrom(0, colors.length-1)]; console.log(color); // 可能是數組中包含的任何一個字符串其他方法
Math 對象中還包含其他一些與完成各種簡單或復雜計算有關的方法,但詳細討論其中每一個方法的細節及適用情形超出了本書的范圍。下面我們就給出一個表格,其中列出了這些沒有介紹到的 Math 對象的方法。
方法 | 說明 |
---|---|
Math.abs(num) | 返回num的絕對值 |
Math.asin(x) | 返回x的反正弦值 |
Math.exp(num) | 返回Math.E的num次冪 |
Math.atan(x) | 返回x的反正切值 |
Math.log(num) | 返回num的自然對數 |
Math.atan2(y,x) | 返回y/x的反正切值 |
Math.pow(num,power) | 返回num的power次冪 |
Math.cos(x) | 返回x的余弦值 |
Math.sqrt(num) | 返回num的平方根 |
Math.sin(x) | 返回x的正弦值 |
Math.acos(x) | 返回x的反余弦值 |
Math.tan(x) | 返回x的正切值 |
雖然 ECMA-262 規定了這些方法,但不同實現可能會對這些方法采用不同的算法。畢竟,計算某個值的正弦、余弦和正切的方式多種多樣。也正因為如此,這些方法在不同的實現中可能會有不同的精度。
關卡// 如何高效產生m個n范圍內的不重復隨機數(m<=n) var getRandomNumber = function(n, m){ // 待實現方法體 } console.log(getRandomNumber(20, 3)); // 8,4,19更多
關注微信公眾號「劼哥舍」回復「答案」,獲取關卡詳解。
關注 https://github.com/stone0090/javascript-lessons,獲取最新動態。
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/80732.html
摘要:對象數組初始化表達式,闖關記之上文檔對象模型是針對和文檔的一個。闖關記之數組數組是值的有序集合。數組是動態的,根闖關記之語法的語法大量借鑒了及其他類語言如和的語法。 《JavaScript 闖關記》之 DOM(下) Element 類型 除了 Document 類型之外,Element 類型就要算是 Web 編程中最常用的類型了。Element 類型用于表現 XML 或 HTML 元素...
摘要:本課程之所以叫做闖關記,是因為部分章節精心設計了挑戰關卡,通過提供更多的實戰機會,讓大家可以循序漸進地有目的地有挑戰地開展學習。課程結構及目錄以下目錄只是初步構想,課程結構及內容會根據實際情況隨時進行調整。 為何寫作此課程 stone 主要負責基于 Web 的企業內部管理系統的開發,雖然能夠熟練地使用 JavaScript,但隨著對 JavaScript 的理解越來越深,才發現自己尚...
摘要:屬性名可以是包含空字符串在內的任意字符串,但對象中不能存在兩個同名的屬性。客戶端中表示網頁結構的對象均是宿主對象。這里的函數稱做構造函數,構造函數用以初始化一個新創建的對象。通過關鍵字和構造函數調用創建的對象的原型就是構造函數的屬性的值。 對象是 JavaScript 的數據類型。它將很多值(原始值或者其他對象)聚合在一起,可通過名字訪問這些值,因此我們可以把它看成是從字符串到值的映射...
摘要:把上面的函數聲明改為等價的函數表達式,就會在執行期間導致錯誤。換句話說,引用的是函數據以執行的環境對象當在網頁的全局作用域中調用函數時,對象引用的就是。這兩個方法的用途都是在特定的作用域中調用函數,實際上等于設置函數體內對象的值。 函數是一段代碼,它只定義一次,但可以被執行或調用任意次。在 JavaScript 里,函數即對象,程序可以隨意操控它們。比如,可以把函數賦值給變量,或者作為...
摘要:瀏覽器只是實現的宿主環境之一,其他宿主環境包括和。年月,版發布,成為國際標準。事件定義了事件和事件處理的接口。對于已經正式納入標準的來說,盡管各瀏覽器都實現了某些眾所周知的共同特性,但其他特性還是會因瀏覽器而異。 JavaScript 是面向 Web 的編程語言,絕大多數現代網站都使用了 JavaScript,并且所有的現代 Web 瀏覽器(電腦,手機,平板)均包含了 JavaScri...
閱讀 1136·2019-08-30 12:44
閱讀 642·2019-08-29 13:03
閱讀 2551·2019-08-28 18:15
閱讀 2419·2019-08-26 10:41
閱讀 3082·2019-08-26 10:28
閱讀 3029·2019-08-23 16:54
閱讀 1983·2019-08-23 15:16
閱讀 802·2019-08-23 14:55