JS单体内置对象

前端开发
2018年12月07日
0

ECMA-262对内置对象的定义是:“由ECMAScript实现提供的,不依赖于宿主环境的对象,这些对象在ECMAScript程序执行之前就已经存在了。”意思就是说,开发人员不必显式地实例化内置对象,因为它们已经实例化了。ECMA定义了两个单体内置对象:GlobalMath

Global对象

Global(全局)对象可以说是ECMAScript中最特别的一个对象了,因为不管你从什么角度上看,这个对象都是不存在的。ECMAScript中的Global对象在某种意义上是作为一个终极的“兜底儿对象”来定义的。换句话说,不属性于任何其他对象的属性和方法,最终都是它的属性和方法。事实上,所有在全局作用域中定义的属性和函数,都是Global对象的属性。

URI编码方法

Global对象的encodeURI()encodeURIComponent()方法可以对URI进行编码,以便发送给浏览器。有效的URI不能包含某些字符,例如空格。而这两个编码方法就可以对URI进行编码,它们用特殊的UTF-8编码替代所有无效的字符,从而让浏览器能够接受和理解。

其中,encodeURI()主要用于整个URI,而encodeURIComponent()主要用于对URI的某一段进行编码。它们的主要区别在于:encodeURI()不会对本身属于URI的特殊字符进行编码,例如冒号、正斜杠、问号和井号;而encodeURIComponent()则会对它发现的任何非标准字符进行编码。

js
var uri = 'http://www.humandetail.com/example page.html#start'; console.log(encodeURI(uri)); // http://www.humandetail.com/example%20page.html#start console.log(encodeURIComponent(uri)); // http%3A%2F%2Fwww.humandetail.com%2Fexample%20page.html%23start

与这两个方法对应的两个方法分别是:decodeURI()decodeURIComponent()

js
var uri = 'http%3A%2F%2Fwww.humandetail.com%2Fexample%20page.html%23start'; console.log(decodeURI(uri)); // http%3A%2F%2Fwww.humandetail.com%2Fexample page.html%23start console.log(decodeURIComponent(uri)); // http://www.humandetail.com/example page.html#start

eval()

eval()大概是整个ECMAScript语言中最强大的一个方法,它就像是一个完事的ECMAScript解析器,它只接受一个参数,即要执行的ECMAScript(或JavaScript)字符串。

js
eval('console.log("hi")'); // 等价于 console.log("hi");

通过eval()执行的代码被认为是包含该次调用的执行环境的一部分,因此被执行的代码具有与该环境相同的作用域链。

js
var msg = 'hello world'; eval("console.log(msg)"); // 'hello world' var func = function () { console.log('hi'); } eval("func()"); // 'hi'

eval()中创建的任何变量或函数都不会被提升,因为在解析代码的时候,它们被包含在一个字符串中,它们只在eval()执行的时候创建。

严格模式下,在外部访问不到eval()中创建的任何变量或函数,同样,为eval赋值也会导致错误:

js
'use strict'; eval('var msg = "hello world"'); console.log(msg); // msg is not defined eval = 'hi'; // Unexpected eval or arguments in strict mode

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

ES5明确禁止给undefinedNaNInfinity赋值,这样做即使在非严格模式下也会导致错误。

window对象

ECMAScript虽然没有指出如何直接访问Global对象,但Web浏览器都是将这个全局对象作为window对象的一部分加以实现的。因此,在全局作用域中声明的所有变量和函数,就都成为了window对象的属性。

js
var color = 'red'; function sayColor () { console.log(window.color); } window.sayColor(); // 'red'

另一种取得Global对象的方法是使用以下代码:

js
var global = function () { return this; }

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的平方根

min()和max()方法

min()max()用于确定一组数值中的最小值和最大值。这两个方法都可以接收任意多个数值参数。

js
var max = Math.max(3, 54, 32, 16); var min = Math.max(3, 54, 32, 16); console.log(max); // 54 console.log(min); // 3

要找到数组中的最大或最小值,可以使用apply()方法。

js
var arr = [1, 2, 3, 4, 5, 6, 7]; var max = Math.max.apply(Math, arr);

舍入方法

  • Math.ceil():去除小数部分,并且+1;
  • Math.floor():去除小数部分,其他保持不变;
  • Math.round():去除小数部分,四舍五入。
js
console.log(Math.ceil(10.9)); // 11 console.log(Math.floor(10.9)); // 10 console.log(Math.round(10.9)); // 11 console.log(Math.round(10.4)); // 10

random()方法

Math.random()返回一个大于等于0小于1的随机数。

js
// 套用这个公式可以从某个整数范围内随机选择一个值 值 = Math.floor(Math.random() * 可能值的总数 + 最小可能值) // example // 获取一个在1-10之间的随机整数 1 2 3 4 5 6 7 8 9 10 var num = Math.floor(Math.random() * 10 + 1); // 获取一个在3-9之间的随机整数 3 4 5 6 7 8 9 var num = Math.floor(Math.random() * 7 + 3);

其他方法

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的正切值