update: 内置对象 Math
This commit is contained in:
		
							parent
							
								
									7ce3649a5c
								
							
						
					
					
						commit
						1e63a1e791
					
				@ -337,6 +337,10 @@ Font Space有很全的字体,都是用户自己上传的,截至2017年3月
 | 
			
		||||
 | 
			
		||||
- [你的版权常识指南](https://mp.weixin.qq.com/s/4uEBoajTygSADslzem3yZA)
 | 
			
		||||
 | 
			
		||||
- [免费商用 | 这几款字体你值得拥有](https://mp.weixin.qq.com/s/wPqd0H9125bK7775KGoFbg)
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## 我的公众号
 | 
			
		||||
 | 
			
		||||
想学习**代码之外的技能**?不妨关注我的微信公众号:**千古壹号**(id:`qianguyihao`)。
 | 
			
		||||
 | 
			
		||||
@ -119,7 +119,6 @@ fn(1);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## 参考链接
 | 
			
		||||
 | 
			
		||||
- JavaScript预编译原理分析:<https://blog.csdn.net/q1056843325/article/details/52951114>
 | 
			
		||||
@ -148,7 +148,7 @@ obj.sayHi = function() {
 | 
			
		||||
 | 
			
		||||
- 2.以方法的形式调用时,this是调用方法的那个对象
 | 
			
		||||
 | 
			
		||||
- 3.以构造函数的形式调用时,this是新创建的那个对象
 | 
			
		||||
- 3.以构造函数的形式调用时,this是新创建的实例对象
 | 
			
		||||
 | 
			
		||||
### new 一个构造函数的执行流程
 | 
			
		||||
 | 
			
		||||
							
								
								
									
										243
									
								
								04-JavaScript基础/20-内置对象:Math.md
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										243
									
								
								04-JavaScript基础/20-内置对象:Math.md
									
									
									
									
									
										Normal file
									
								
							@ -0,0 +1,243 @@
 | 
			
		||||
 | 
			
		||||
## 内置对象简介
 | 
			
		||||
 | 
			
		||||
> JavaScript 中的对象分为3种:自定义对象 、内置对象、 浏览器对象。
 | 
			
		||||
 | 
			
		||||
> 前面两种对象:是JS的基础内容,属于 ECMAScript; 第三个浏览器对象:属于JS独有,即 JS 内置的API。
 | 
			
		||||
 | 
			
		||||
**内置对象**:就是指这个语言自带的一些对象,供开发者使用,这些对象提供了一些常用或者最基本而必要的功能(属性和方法)。
 | 
			
		||||
 | 
			
		||||
内置对象最大的优点就是帮助我们快速开发。
 | 
			
		||||
 | 
			
		||||
**JavaScript的内置对象**:
 | 
			
		||||
 | 
			
		||||
| 内置对象 | 对象说明 |
 | 
			
		||||
|:-------------|:-------------|
 | 
			
		||||
|  Arguments | 函数参数集合|
 | 
			
		||||
|  Array | 数组|
 | 
			
		||||
|  Boolean | 布尔对象|
 | 
			
		||||
|  Math | 数学对象|
 | 
			
		||||
|  Date | 日期时间|
 | 
			
		||||
|  Error | 异常对象|
 | 
			
		||||
|  Function | 函数构造器|
 | 
			
		||||
|  Number | 数值对象|
 | 
			
		||||
|  Object | 基础对象|
 | 
			
		||||
|  RegExp | 正则表达式对象|
 | 
			
		||||
|  String | 字符串对象|
 | 
			
		||||
 | 
			
		||||
前面的几篇文章中,我们专门讲到了数组 Array。今天这篇文章,我们先来讲一下内置对象 Math。
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## 内置对象 Math 的常见方法
 | 
			
		||||
 | 
			
		||||
Math 和其他的对象不同,它不是一个构造函数,不需要创建对象。所以我们不需要 通过 new 来调用,而是直接使用里面的属性和方法即可。
 | 
			
		||||
 | 
			
		||||
Math属于一个工具类,里面封装了数学运算相关的属性和方法。如下:
 | 
			
		||||
 | 
			
		||||
| 方法 | 描述 | 备注 |
 | 
			
		||||
|:-------------|:-------------|:-------------|
 | 
			
		||||
| Math.PI | 圆周率 | Math对象的属性  |
 | 
			
		||||
| Math.abs() |  **返回绝对值** |  |
 | 
			
		||||
| Math.floor() | **向下取整**(往小取值) |  |
 | 
			
		||||
| Math.ceil() | **向上取整**(往大取值) |  |
 | 
			
		||||
| Math.round() | 四舍五入取整(正数四舍五入,负数五舍六入) |  |
 | 
			
		||||
| Math.random() | 生成0-1之间的**随机浮点数** | 取值范围是 [0,1) |
 | 
			
		||||
| Math.max(x, y, z)  | 返回多个数中的最大值 |  |
 | 
			
		||||
| Math.min(x, y, z)  | 返回多个数中的最小值 |  |
 | 
			
		||||
| Math.pow(x,y) | 返回 x 的 y 次幂 |  |
 | 
			
		||||
| Math.sqrt() | 对一个数进行开方运算 |  |
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
**举例**:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    var num = -0.6;
 | 
			
		||||
 | 
			
		||||
    console.log(Math.abs(num));        //取绝对值
 | 
			
		||||
 | 
			
		||||
    console.log(Math.floor(num));      //向下取整,向小取
 | 
			
		||||
 | 
			
		||||
    console.log(Math.ceil(num));       //向上取整,向大取
 | 
			
		||||
 | 
			
		||||
    console.log(Math.round(num));      //四舍五入取整(正数四舍五入,负数五舍六入)
 | 
			
		||||
 | 
			
		||||
    console.log(Math.random());        //生成0-1之间的随机数
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
运行结果:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
    0.6
 | 
			
		||||
 | 
			
		||||
    -1
 | 
			
		||||
 | 
			
		||||
    -0
 | 
			
		||||
 | 
			
		||||
    -1
 | 
			
		||||
 | 
			
		||||
    0.6453756205275165
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
##  Math.abs() 方法
 | 
			
		||||
 | 
			
		||||
方法定义:返回绝对值。
 | 
			
		||||
 | 
			
		||||
注意:
 | 
			
		||||
 | 
			
		||||
- 参数中可以接收字符串类型的数字,此时会将字符串做隐式类型转换,然后再调用 Math.abs() 方法。
 | 
			
		||||
 | 
			
		||||
代码举例:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    console.log(Math.abs(2)); // 2
 | 
			
		||||
    console.log(Math.abs(-2)); // 2
 | 
			
		||||
 | 
			
		||||
    // 先做隐式类型转换,将 '-2'转换为数字类型 -2,然后再调用 Math.abs()
 | 
			
		||||
    console.log(Math.abs('-2'));
 | 
			
		||||
 | 
			
		||||
    console.log(Math.abs('hello')); // NaN
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
## Math.random() 方法
 | 
			
		||||
 | 
			
		||||
方法定义:生成 [0, 1) 之间的**随机浮点数**。
 | 
			
		||||
 | 
			
		||||
我们来看几个例子。
 | 
			
		||||
 | 
			
		||||
### 生成 [0, x) 之间的随机数
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    Math.round(Math.random()*x)
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 生成 [x, y) 之间的随机数
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    Math.round(Math.random()*(y-x)+x)
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
### 【重要】生成 [x, y]之间的随机整数
 | 
			
		||||
 | 
			
		||||
也就是说:生成两个整数之间的随机整数,**并且要包含这两个整数**。
 | 
			
		||||
 | 
			
		||||
这个功能很常用,我们可以将其封装成一个方法,代码实现如下:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    /*
 | 
			
		||||
    * 生成两个整数之间的随机整数,并且要包含这两个整数
 | 
			
		||||
    */
 | 
			
		||||
    function getRandom(min, max) {
 | 
			
		||||
        return Math.floor(Math.random() * (max - min + 1)) + min;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    console.log(getRandom(1, 10));
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
### 随机点名
 | 
			
		||||
 | 
			
		||||
根据上面的例子,我们还可以再延伸一下,来看看随机点名的例子。
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    /*
 | 
			
		||||
    * 生成两个整数之间的随机整数,并且要包含这两个整数
 | 
			
		||||
    */
 | 
			
		||||
    function getRandom(min, max) {
 | 
			
		||||
        return Math.floor(Math.random() * (max - min + 1)) + min;
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    const arr = ['许嵩', '邓紫棋', '毛不易', '解忧邵帅'];
 | 
			
		||||
    const index = getRandom(0, arr.length - 1); // 生成随机的index
 | 
			
		||||
    console.log(arr[index]); // 随机点名
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## 乘方
 | 
			
		||||
 | 
			
		||||
如果想计算 `a 的 b 次方`,可以使用如下函数:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	Math.pow(a, b);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
Math的中文是“数学”,pow是“power 幂”。
 | 
			
		||||
 | 
			
		||||
**举例1:**
 | 
			
		||||
 | 
			
		||||

 | 
			
		||||
 | 
			
		||||
代码实现:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	var a = Math.pow(3, Math.pow(2, 2));
 | 
			
		||||
	console.log(a);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
**举例2:**
 | 
			
		||||
 | 
			
		||||

 | 
			
		||||
 | 
			
		||||
代码实现:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	var a = Math.pow(Math.pow(3, 2), 4);
 | 
			
		||||
	console.log(a);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
## 开方
 | 
			
		||||
 | 
			
		||||
如果想计算数值a的开二次方,可以使用如下函数:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	 Math.sqrt(a);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
sqrt即“square 开方”。比如:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	var a = Math.sqrt(36);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## url 编码和解码
 | 
			
		||||
 | 
			
		||||
URI (Uniform ResourceIdentifiers,通用资源标识符)进行编码,以便发送给浏览器。有效的URI中不能包含某些字符,例如空格。而这URI编码方法就可以对URI进行编码,它们用特殊的UTF-8编码替换所有无效的字符,从而让浏览器能够接受和理解。
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    encodeURIComponent();   //把字符串作为 URI 组件进行编码
 | 
			
		||||
    decodeURIComponent();   //把字符串作为 URI 组件进行解码
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
举例:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    var url = "http://www.cnblogs.com/smyhvae/";
 | 
			
		||||
 | 
			
		||||
    var str = encodeURIComponent(url);
 | 
			
		||||
    console.log(str);                           //打印url的编码
 | 
			
		||||
    console.log(decodeURIComponent(str));       //对url进行编码后,再解码,还原为url
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
打印结果:
 | 
			
		||||
 | 
			
		||||

 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## 我的公众号
 | 
			
		||||
 | 
			
		||||
想学习**代码之外的技能**?不妨关注我的微信公众号:**千古壹号**(id:`qianguyihao`)。
 | 
			
		||||
 | 
			
		||||
扫一扫,你将发现另一个全新的世界,而这将是一场美丽的意外:
 | 
			
		||||
 | 
			
		||||

 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -1,25 +1,4 @@
 | 
			
		||||
 | 
			
		||||
## 内置对象简介
 | 
			
		||||
 | 
			
		||||
内置对象就是指这个语言自带的一些对象,供开发者使用,这些对象提供了一些常用的或是最基本而必要的功能。
 | 
			
		||||
 | 
			
		||||
**JavaScript的内置对象**:
 | 
			
		||||
 | 
			
		||||
| 内置对象 | 对象说明 |
 | 
			
		||||
|:-------------|:-------------|
 | 
			
		||||
|  Arguments | 函数参数集合|
 | 
			
		||||
|  Array | 数组|
 | 
			
		||||
|  Boolean | 布尔对象|
 | 
			
		||||
|  Date | 日期时间|
 | 
			
		||||
|  Error | 异常对象|
 | 
			
		||||
|  Function | 函数构造器|
 | 
			
		||||
|  Math | 数学对象|
 | 
			
		||||
|  Number | 数值对象|
 | 
			
		||||
|  Object | 基础对象|
 | 
			
		||||
|  RegExp | 正则表达式对象|
 | 
			
		||||
|  String | 字符串对象|
 | 
			
		||||
 | 
			
		||||
前面的几篇文章中,我们专门讲到了数组 Array。今天这篇文章,我们来讲一下其他的内置对象。
 | 
			
		||||
 | 
			
		||||
## 内置对象:Date
 | 
			
		||||
 | 
			
		||||
@ -1,149 +0,0 @@
 | 
			
		||||
 | 
			
		||||
## 内置对象 Math
 | 
			
		||||
 | 
			
		||||
### 内置对象 Math 的常见方法
 | 
			
		||||
 | 
			
		||||
| 方法 | 描述 | 备注 |
 | 
			
		||||
|:-------------|:-------------|:-------------|
 | 
			
		||||
| Math.abs() |  **返回绝对值** |  |
 | 
			
		||||
| Math.floor() | **向下取整**(向小取) |  |
 | 
			
		||||
| Math.ceil() | **向上取整**(向大取) |  |
 | 
			
		||||
| Math.round() | 四舍五入取整(正数四舍五入,负数五舍六入) |  |
 | 
			
		||||
| Math.random() | 生成0-1之间的随机数 | 不包含0和1 |
 | 
			
		||||
| Math.max(x, y, z)  | 返回多个数中的最大值 |  |
 | 
			
		||||
| Math.min(x, y, z)  | 返回多个数中的最小值 |  |
 | 
			
		||||
| Math.pow(x,y) | 返回 x 的 y 次幂 |  |
 | 
			
		||||
| Math.sqrt() | 对一个数进行开方运算 |  |
 | 
			
		||||
 | 
			
		||||
Math 和其他的对象不同,它不是一个构造函数,不需要创建对象。
 | 
			
		||||
 | 
			
		||||
Math属于一个工具类,里面封装了数学运算相关的属性和方法。
 | 
			
		||||
 | 
			
		||||
**举例**:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    var num = -0.6;
 | 
			
		||||
 | 
			
		||||
    console.log(Math.abs(num));        //取绝对值
 | 
			
		||||
 | 
			
		||||
    console.log(Math.floor(num));      //向下取整,向小取
 | 
			
		||||
 | 
			
		||||
    console.log(Math.ceil(num));       //向上取整,向大取
 | 
			
		||||
 | 
			
		||||
    console.log(Math.round(num));      //四舍五入取整(正数四舍五入,负数五舍六入)
 | 
			
		||||
 | 
			
		||||
    console.log(Math.random());        //生成0-1之间的随机数
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
运行结果:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
    0.6
 | 
			
		||||
 | 
			
		||||
    -1
 | 
			
		||||
 | 
			
		||||
    -0
 | 
			
		||||
 | 
			
		||||
    -1
 | 
			
		||||
 | 
			
		||||
    0.6453756205275165
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
### Math.random()方法举例:生成 x-y 之间的随机数
 | 
			
		||||
 | 
			
		||||
生成 0-x 之间的随机数:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    Math.round(Math.random()*x)
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
生成 x-y 之间的随机数:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    Math.round(Math.random()*(y-x)+x)
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
### 乘方
 | 
			
		||||
 | 
			
		||||
如果想计算 `a 的 b 次方`,可以使用如下函数:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	Math.pow(a, b);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
Math的中文是“数学”,pow是“power 幂”。
 | 
			
		||||
 | 
			
		||||
**举例1:**
 | 
			
		||||
 | 
			
		||||

 | 
			
		||||
 | 
			
		||||
代码实现:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	var a = Math.pow(3, Math.pow(2, 2));
 | 
			
		||||
	console.log(a);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
**举例2:**
 | 
			
		||||
 | 
			
		||||

 | 
			
		||||
 | 
			
		||||
代码实现:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	var a = Math.pow(Math.pow(3, 2), 4);
 | 
			
		||||
	console.log(a);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
### 开方
 | 
			
		||||
 | 
			
		||||
如果想计算数值a的开二次方,可以使用如下函数:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	 Math.sqrt(a);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
sqrt即“square 开方”。比如:
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
	var a = Math.sqrt(36);
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## url 编码和解码
 | 
			
		||||
 | 
			
		||||
URI (Uniform ResourceIdentifiers,通用资源标识符)进行编码,以便发送给浏览器。有效的URI中不能包含某些字符,例如空格。而这URI编码方法就可以对URI进行编码,它们用特殊的UTF-8编码替换所有无效的字符,从而让浏览器能够接受和理解。
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    encodeURIComponent();   //把字符串作为 URI 组件进行编码
 | 
			
		||||
    decodeURIComponent();   //把字符串作为 URI 组件进行解码
 | 
			
		||||
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
举例:
 | 
			
		||||
 | 
			
		||||
```javascript
 | 
			
		||||
    var url = "http://www.cnblogs.com/smyhvae/";
 | 
			
		||||
 | 
			
		||||
    var str = encodeURIComponent(url);
 | 
			
		||||
    console.log(str);                           //打印url的编码
 | 
			
		||||
    console.log(decodeURIComponent(str));       //对url进行编码后,再解码,还原为url
 | 
			
		||||
```
 | 
			
		||||
 | 
			
		||||
打印结果:
 | 
			
		||||
 | 
			
		||||

 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
## 我的公众号
 | 
			
		||||
 | 
			
		||||
想学习**代码之外的技能**?不妨关注我的微信公众号:**千古壹号**(id:`qianguyihao`)。
 | 
			
		||||
 | 
			
		||||
扫一扫,你将发现另一个全新的世界,而这将是一场美丽的意外:
 | 
			
		||||
 | 
			
		||||

 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -65,9 +65,9 @@ cookie用于存储时的缺点:
 | 
			
		||||
 | 
			
		||||
- `foreach`用于遍历数组,是数组的一个方法。不支持 return。
 | 
			
		||||
 | 
			
		||||
- `for ... in`获取的对象是index索引值。
 | 
			
		||||
- `for ... in`获取对象里属性的键。
 | 
			
		||||
 | 
			
		||||
- `for ... of`获取的是对象里的值。
 | 
			
		||||
- `for ... of`获取对象里属性的值。
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -328,6 +328,12 @@ Sass 是成熟、稳定、强大的 CSS 扩展语言。入门文档可以看:<
 | 
			
		||||
 | 
			
		||||
- 图片转base64:<http://imgbase64.duoshitong.com/>
 | 
			
		||||
 | 
			
		||||
## 前端周刊
 | 
			
		||||
 | 
			
		||||
- WecTeam 前端周刊:<https://github.com/wecteam/weekly>
 | 
			
		||||
 | 
			
		||||
- Js中文网周刊:<https://www.javascriptc.com/category/javascript-weekly>
 | 
			
		||||
 | 
			
		||||
## 团队
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user