forked from theluyuan/Web
963 lines
20 KiB
Markdown
963 lines
20 KiB
Markdown
|
||
|
||
## 面向对象的概念
|
||
|
||
**对象的作用是：封装信息**。比如Student类里可以封装学生的姓名、年龄、成绩等。
|
||
|
||
那为什么不用数组封装信息呢？首先，数组只能存放同一种类型的数据；其次，要功过
|
||
|
||
对象具有**特征**（属性）和**行为**（方法）。
|
||
|
||
面向对象：可以创建自定义的类型、很好的支持继承和多态。
|
||
|
||
面向对象的特征：封装、继承、多态。
|
||
|
||
## 创建自定义对象
|
||
|
||
### 创建单个自定义对象
|
||
|
||
创建一个空白的对象，举例：
|
||
|
||
```
|
||
var student= new Object();
|
||
```
|
||
|
||
完整的举例如下：
|
||
|
||
```javascript
|
||
//调用对象
|
||
console.log(student); //调用对象的方法
|
||
student.sayHi(); //调用对象的方法
|
||
|
||
|
||
//（1）创建一个空白的对象
|
||
var student= new Object();
|
||
|
||
// （2）定义对象的属性
|
||
student.name = "生命壹号";
|
||
student.age = 26;
|
||
// （3）定义对象的方法
|
||
student.sayHi = function () {
|
||
console.log(this.name + "今年的岁数是" + this.age); //如果要调用自己的name，可以使用this
|
||
}
|
||
```
|
||
|
||
输出如下：
|
||
|
||
20180125_1059.png
|
||
|
||
### 引入：创建多个自定义对象
|
||
|
||
举例：
|
||
|
||
```javascript
|
||
var stu1 = createStudent("生命壹号");
|
||
console.log(stu1);
|
||
stu1.sayHi();
|
||
|
||
console.log("------------------");
|
||
|
||
var stu2 = createStudent("许嵩");
|
||
console.log(stu2);
|
||
stu2.sayHi();
|
||
|
||
|
||
// 创建一个函数
|
||
function createStudent(name) {
|
||
var student = new Object();
|
||
student.name = name; //第一个name指的是student对象定义的变量。第二个name指的是createStudent函数的参数。二者不一样
|
||
student.sayHi = function () {
|
||
console.log(this.name + "厉害了");
|
||
}
|
||
return student;
|
||
}
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180125_1121.png
|
||
|
||
上方代码中，注意`student.name = name;`中这两个name是不同的。另外，注意this指的是student的this。
|
||
|
||
### new和this
|
||
|
||
**this：**
|
||
|
||
1、this只出现在函数中。
|
||
|
||
2、谁调用函数，this就指的是谁。
|
||
|
||
3、new People(); People中的this代指被创建的对象实例。
|
||
|
||
|
||
**new之后：**
|
||
|
||
（1）开辟内存空间，存储新创建的对象。new Object()
|
||
|
||
（2）**把this设置为当前对象**
|
||
|
||
（3）执行内部代码，设置对象属性和方法
|
||
|
||
（4）返回新创建的对象
|
||
|
||
因为this指的是new一个Object之后的对象实例。于是，下面这段代码：
|
||
|
||
```javascript
|
||
// 创建一个函数
|
||
function createStudent(name) {
|
||
var student = new Object();
|
||
student.name = name; //第一个name指的是student对象定义的变量。第二个name指的是createStudent函数的参数。二者不一样
|
||
}
|
||
```
|
||
|
||
可以改进为：
|
||
|
||
```javascript
|
||
// 创建一个函数
|
||
function Student(name) {
|
||
this.name = name; //this指的是构造函数中的对象实例
|
||
}
|
||
|
||
```
|
||
|
||
注意上方代码中的注释。
|
||
|
||
于是，便得出了接下来的代码。
|
||
|
||
**利用构造函数自定义对象：**（改进版）
|
||
|
||
```javascript
|
||
//利用构造函数自定义对象
|
||
var stu1 = new Student("smyh");
|
||
console.log(stu1);
|
||
stu1.sayHi();
|
||
|
||
var stu2 = new Student("vae");
|
||
console.log(stu2);
|
||
stu2.sayHi();
|
||
|
||
|
||
// 创建一个构造函数
|
||
function Student(name) {
|
||
this.name = name; //this指的是构造函数中的对象实例
|
||
this.sayHi = function () {
|
||
console.log(this.name + "厉害了");
|
||
}
|
||
}
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180125_1350.png
|
||
|
||
|
||
|
||
### 属性绑定
|
||
|
||
暂略。
|
||
|
||
|
||
### 对象字面量
|
||
|
||
|
||
**对象的字面量**就是一个{}。里面的属性和方法均是**键值对**。
|
||
|
||
例如：
|
||
|
||
```javascript
|
||
var o = {
|
||
name: "生命壹号",
|
||
age: 26,
|
||
isBoy: true,
|
||
sayHi: function() {
|
||
console.log(this.name);
|
||
}
|
||
};
|
||
|
||
console.log(o);
|
||
```
|
||
|
||
控制台输出：
|
||
|
||
20180125_1834.png
|
||
|
||
### json的介绍
|
||
|
||
> 对象字面量和json比较像，这里我们对json做一个简单介绍。
|
||
|
||
JSON：JavaScript Object Notation（JavaScript对象表示形式）。
|
||
|
||
JSON和对象字面量的区别：JSON的属性必须用双引号引号引起来，对象字面量可以省略。
|
||
|
||
json举例：
|
||
|
||
```
|
||
{
|
||
"name" : "zs",
|
||
"age" : 18,
|
||
"sex" : true,
|
||
"sayHi" : function() {
|
||
console.log(this.name);
|
||
}
|
||
};
|
||
```
|
||
|
||
注：json里一般放常量、数组、对象等，但很少放function。
|
||
|
||
另外，对象和json没有长度，json.length的打印结果是undefined。于是乎，自然也就不能用for循环遍历（因为便利时需要获取长度length）。
|
||
|
||
**json遍历的方法：**
|
||
|
||
json 采用 `for...in...`进行遍历，和数组的遍历方式不同。如下：
|
||
|
||
|
||
```html
|
||
<script>
|
||
var myJson = {
|
||
"name": "smyhvae",
|
||
"aaa": 111,
|
||
"bbb": 222
|
||
};
|
||
|
||
//json遍历的方法：for...in...
|
||
for (var key in myJson) {
|
||
console.log(key); //获取 键
|
||
console.log(myJson[key]); //获取 值（第二种属性绑定和获取值的方法）
|
||
console.log("------");
|
||
}
|
||
</script>
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180203_1518.png
|
||
|
||
|
||
## 类和对象
|
||
|
||
函数并没有创建对象的能力，类才有。
|
||
|
||
|
||
```javascript
|
||
class Customer {
|
||
//属性
|
||
public String Name;
|
||
public String Age;
|
||
public String Money;
|
||
|
||
//方法
|
||
public void Buy (String id,int num,double price) {
|
||
self.money -= num * price; //记录订单
|
||
}
|
||
}
|
||
```
|
||
|
||
|
||
## 内置对象
|
||
|
||
内置对象就是指这个语言自带的一些对象，供开发者使用，这些对象提供了一些常用的或是最基本而必要的功能。
|
||
|
||
**javascript的内置对象**：
|
||
|
||
20180201_2330.jpg
|
||
|
||
|
||
## 内置对象：Date
|
||
|
||
### Date对象的声明
|
||
|
||
写法一：
|
||
|
||
```javascript
|
||
var date1 = new Date();
|
||
console.log(date1);
|
||
```
|
||
|
||
写法二：（兼容性最强）
|
||
|
||
```javascript
|
||
var date2 = new Date("2017/09/06 09:00:00");
|
||
console.log(date2);
|
||
```
|
||
|
||
写法三和写法四：（不常用）
|
||
|
||
```javascript
|
||
var date3 = new Date('Wed Jan 27 2017 12:00:00 GMT+0800 (中国标准时间)'); //写法三
|
||
|
||
var date4 = new Date(2017, 1, 27); //写法四
|
||
```
|
||
|
||
以上四种写法的打印结果是：
|
||
|
||
20180202_1040.png
|
||
|
||
|
||
### Date对象的方法：获取日期和时间
|
||
|
||
|
||
Date对象 有如下方法：
|
||
|
||
- `getDate()` 获取日 1-31
|
||
|
||
- `getDay()` **获取星期 0-6**（0代表周日）
|
||
|
||
- `getMonth() ` **获取月 0-11**（1月从0开始）
|
||
|
||
- `getFullYear() ` 获取完整年份（浏览器都支持）
|
||
|
||
- `getHours() ` 获取小时 0-23
|
||
|
||
- `getMinutes() ` 获取分钟 0-59
|
||
|
||
- `getSeconds()` 获取秒 0-59
|
||
|
||
- `getMilliseconds()` 获取毫秒 （1s = 1000ms）
|
||
|
||
- `getTime ()` **返回累计毫秒数**(从1970/1/1午夜)
|
||
|
||
为何累计毫秒数是从1970/1/1开始算起呢？
|
||
|
||
打印结果举例：
|
||
|
||
20180202_1056.png
|
||
|
||
### 返回距离1970/01/01毫秒数
|
||
|
||
也就是返回：此刻时间 减去 1970/01/01 的毫秒数。
|
||
|
||
代码实现：
|
||
|
||
```javascript
|
||
var date1 = Date.now();
|
||
var date2 = +new Date();
|
||
var date3 = new Date().getTime();
|
||
var date4 = new Date().valueOf();
|
||
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180202_1100.png
|
||
|
||
|
||
### 举例：模拟日历
|
||
|
||
要求每天打开这个页面都能定时显示当前的日期。
|
||
|
||
代码实现：
|
||
|
||
```html
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head lang="en">
|
||
<meta charset="UTF-8">
|
||
<title></title>
|
||
<style>
|
||
div {
|
||
width: 800px;
|
||
margin: 200px auto;
|
||
color: red;
|
||
text-align: center;
|
||
font: 600 30px/30px "simsun";
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div></div>
|
||
|
||
<script>
|
||
//模拟日历
|
||
//需求：每天打开这个页面都能定时显示年月日和星期几
|
||
|
||
//1.创建一个当前日期的日期对象
|
||
var date = new Date();
|
||
//2.然后获取其中的年、月、日和星期
|
||
var year = date.getFullYear();
|
||
var month = date.getMonth();
|
||
var hao = date.getDate();
|
||
var week = date.getDay();
|
||
// console.log(year+" "+month+" "+hao+" "+week);
|
||
//3.赋值给div
|
||
var arr = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];
|
||
var div = document.getElementsByTagName("div")[0];
|
||
div.innerText = "今天是："+year+"年"+(month+1)+"月"+hao+"日 "+arr[week];
|
||
|
||
</script>
|
||
|
||
</body>
|
||
</html>
|
||
|
||
```
|
||
|
||
实现效果：
|
||
|
||
20180202_1110.png
|
||
|
||
|
||
### 举例：发布会倒计时
|
||
|
||
实现思路：
|
||
|
||
设置一个定时器，每间隔1毫秒就自动刷新一次div的内容。
|
||
|
||
代码实现：
|
||
|
||
```html
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head lang="en">
|
||
<meta charset="UTF-8">
|
||
<title></title>
|
||
<style>
|
||
div {
|
||
width: 1210px;
|
||
margin: 200px auto;
|
||
color: red;
|
||
text-align: center;
|
||
font: 600 30px/30px "simsun";
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div></div>
|
||
|
||
<script>
|
||
var div = document.getElementsByTagName("div")[0];
|
||
var timer = setInterval(fn, 1);
|
||
|
||
function fn() {
|
||
var nowtime = new Date();
|
||
var future = new Date("2019/02/03 11:20:00");
|
||
var timeSum = future.getTime() - nowtime.getTime(); //获取时间差：发布会时间减去此刻的毫秒值
|
||
var day = parseInt(timeSum / 1000 / 60 / 60 / 24);
|
||
var hour = parseInt(timeSum / 1000 / 60 / 60 % 24);
|
||
var minu = parseInt(timeSum / 1000 / 60 % 60);
|
||
var sec = parseInt(timeSum / 1000 % 60);
|
||
var millsec = parseInt(timeSum % 1000);
|
||
|
||
//问题处理：所有的时间小于10的时候，在前面自动补0，毫秒值要补双0（比如如，把 8 秒改成 08 秒）
|
||
day = day < 10 ? "0" + day : day; //day小于10吗？如果小于，就补0；如果不小于，就是day本身
|
||
hour = hour < 10 ? "0" + hour : hour;
|
||
minu = minu < 10 ? "0" + minu : minu;
|
||
sec = sec < 10 ? "0" + sec : sec;
|
||
if (millsec < 10) {
|
||
millsec = "00" + millsec;
|
||
} else if (millsec < 100) {
|
||
millsec = "0" + millsec;
|
||
}
|
||
// console.log(day);
|
||
// console.log(parseInt(timeSum/1000/60/60/24));
|
||
if (timeSum < 0) {
|
||
div.innerHTML = "距离苹果发布会还有00天00小时00分00秒000毫秒";
|
||
clearInterval(timer);
|
||
return;
|
||
}
|
||
div.innerHTML = "距离苹果发布会还有" + day + "天" + hour + "小时" + minu + "分" + sec + "秒" + millsec + "毫秒";
|
||
}
|
||
</script>
|
||
</body>
|
||
|
||
</html>
|
||
```
|
||
|
||
|
||
实现效果：
|
||
|
||
20180202_1130.gif
|
||
|
||
|
||
## 内置对象String
|
||
|
||
### 简单数据类型、复杂数据类型
|
||
|
||
**1、简单数据类型：**
|
||
|
||
注意，之前学习的简单数据类型`string`是**无法绑定属性和方法**的。比如说：
|
||
|
||
|
||
```javascript
|
||
var str = "smyhvae";
|
||
|
||
str.aaa = 12;
|
||
console.log(typeof str); //打印结果为：string
|
||
console.log(str.aaa); //打印结果为：undefined
|
||
```
|
||
|
||
上方代码中，当我们尝试打印`str.aaa`的时候，会发现打印结果为：undefined。
|
||
|
||
当然，我们可以打印str.length、srt.indexOf("m")等等。因为这两个方法的底层做了数据类型转换。
|
||
|
||
|
||
**2、复杂数据类型：**
|
||
|
||
复杂数据类型`String`是可以绑定属性和方法的。如下：
|
||
|
||
|
||
|
||
|
||
|
||
```javascript
|
||
var strObj = new String("smyhvae");
|
||
strObj.aaa = 123;
|
||
console.log(strObj);
|
||
console.log(typeof strObj); //打印结果：Object
|
||
console.log(strObj.aaa);
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180202_1351.png
|
||
|
||
```
|
||
|
||
```
|
||
|
||
|
||
同理，内置对象Number也有一些自带的方法，比如：
|
||
|
||
- Number.MAX_VALUE;
|
||
|
||
- Number.MIN_VALUE;
|
||
|
||
内置对象Boolean也有一些自带的方法，但是用的不多。
|
||
|
||
|
||
下面讲一下内置对象String的常见方法。
|
||
|
||
|
||
### charAt/charCodeAt：1.2.1 给索引查字符
|
||
|
||
|
||
```javascript
|
||
字符 = Str.charAt(索引值);
|
||
```
|
||
|
||
解释：获取相应位置的字符。
|
||
|
||
字符串中第一个字符的下标是 0。如果参数 index 不在 0 与 string.length 之间，该方法将返回一个空字符串。
|
||
|
||
|
||
|
||
|
||
```javascript
|
||
字符编码 = Str.charCodeAt(索引值);
|
||
```
|
||
|
||
解释： 获取相应位置的Unicode字符编码。
|
||
|
||
|
||
举例1：
|
||
|
||
```javascript
|
||
var str = new String("smyhvae");
|
||
|
||
for (var i = 0; i < str.length; i++) {
|
||
console.log(str.charAt(i));
|
||
}
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180202_1401.png
|
||
|
||
上面这个例子一般不用。一般打印数组和json的时候用索引，打印String不建议用索引。
|
||
|
||
举例2：打印字符串的占位长度
|
||
|
||
提示：一个英文占一个位置，一个中文占两个位置。
|
||
|
||
思路：判断该字符是否在0-127之间（在的话是英文，不在是非英文）。
|
||
|
||
代码实现：
|
||
|
||
```html
|
||
<script>
|
||
// sort(); 底层用到了charCodeAt();
|
||
|
||
var str = "I love my country!我你爱中国！";
|
||
|
||
//需求：求一个字符串占有几个字符位。
|
||
//思路；如果是英文，站一个字符位，如果不是英文占两个字符位。
|
||
//技术点：判断该字符是否在0-127之间。（在的话是英文，不在是非英文）
|
||
alert(getZFWlength(str));
|
||
alert(str.length);
|
||
|
||
//定义方法：字符位
|
||
function getZFWlength(string) {
|
||
//定义一个计数器
|
||
var count = 0;
|
||
for (var i = 0; i < string.length; i++) {
|
||
//对每一位字符串进行判断，如果Unicode编码在0-127，计数器+1；否则+2
|
||
if (string.charCodeAt(i) < 128 && string.charCodeAt(i) >= 0) {
|
||
count++;
|
||
} else {
|
||
count += 2;
|
||
}
|
||
}
|
||
return count;
|
||
}
|
||
</script>
|
||
```
|
||
|
||
打印结果：
|
||
|
||
```
|
||
30
|
||
24
|
||
```
|
||
|
||
从打印结果可以看出：字符串的长度是24，但是却占了30个字符位（一个中文占两个字符位）。
|
||
|
||
另外，sort()方法其实底层也是用到了charCodeAt()，因为用到了Unicode编码。
|
||
|
||
|
||
### indexOf/lastIndexOf：给字符查索引
|
||
|
||
```javascript
|
||
索引值 = str.indexOf/(想要查询的字符);
|
||
|
||
```
|
||
|
||
解释：从前向后索引字符串的位置。
|
||
|
||
因此可以得出一个技巧：**如果获取的索引值为0，说明字符串是以查询的参数为开头的**。
|
||
|
||
同理，lastIndexOf()是从后向前寻找。
|
||
|
||
```javascript
|
||
var str = "abcdea";
|
||
|
||
//给字符查索引(索引值为0,说明字符串以查询的参数为开头)
|
||
console.log(str.indexOf("c"));
|
||
console.log(str.lastIndexOf("c"));
|
||
|
||
console.log(str.indexOf("a"));
|
||
console.log(str.lastIndexOf("a"));
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180202_1420.png
|
||
|
||
### concat：字符串的链接
|
||
|
||
|
||
```javascript
|
||
新字符串 = str1.concat(str2)； 链接两个字符串
|
||
```
|
||
|
||
这种方法基本不用，直接两个字符串相加就好。
|
||
|
||
### 字符串的截取（重要）
|
||
|
||
字符串的截取有好几个方法，下面分别讲解。
|
||
|
||
1、 slice()方法：
|
||
|
||
格式：
|
||
|
||
```javascript
|
||
字符串 = str.slice(索引1，索引2); //两个参数都是索引值。
|
||
```
|
||
|
||
上面的参数，包左不包右。如下：
|
||
|
||
|
||
- (2,5) 表示正常，包左不包右。
|
||
|
||
- (2) 表示**从指定的索引位置开始，剪到最后**。
|
||
|
||
- (-3) 表示从倒数第几个开始，剪到最后.
|
||
|
||
- (5,2) 表示前面的大，后面的小，返回值为空。
|
||
|
||
2、substr()方法：
|
||
|
||
格式：
|
||
|
||
```javascript
|
||
字符串 = srt.substr(索引值, 长度);
|
||
```
|
||
|
||
参数解释：
|
||
|
||
- (2,4)：从索引值为2的字符开始，截取4个字符。
|
||
|
||
- (1)：从指定位置开始，截取到最后。
|
||
|
||
- (-3)：从倒数第几个开始，剪到最后.
|
||
|
||
- 不包括前大后小的情况。
|
||
|
||
### 一些特殊方法
|
||
|
||
**1、trim()**：去除字符串前后的空白。
|
||
|
||
代码举例：
|
||
|
||
```javascript
|
||
//去除前后的空格，trim();
|
||
var str1 = " a b c ";
|
||
console.log(str1);
|
||
console.log(str1.trim());
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180202_1455.png
|
||
|
||
2、**replace()**：替换。
|
||
|
||
举例：
|
||
|
||
```javascript
|
||
//replace()方法：替换
|
||
var str2 = "Today is fine day,today is fine day !!!"
|
||
console.log(str2);
|
||
console.log(str2.replace("today","tomorrow")); //只能替换第一个today
|
||
console.log(str2.replace(/today/gi,"tomorrow")); //这里用到了正则，才能替换所有的today
|
||
```
|
||
|
||
3、split()：字符串变数组。
|
||
|
||
|
||
```javascript
|
||
//split()方法：字符串变数组
|
||
var str3 = "生命壹号|许嵩|smyhvae";
|
||
|
||
console.log(str3);
|
||
console.log(str3.split()); // 无参数，表示：把字符串作为一个元素添加到数组中。
|
||
console.log(str3.split("")); //参数为空字符串，则表示：分隔字符串中每一个字符，分别添加到数组中
|
||
console.log(str3.split("|")); //参数为指定字符，表示：此字符将不会出现在数组的任意一个元素中
|
||
console.log(str3.split("许")); //同理
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180202_1503.png
|
||
|
||
|
||
### 大小写转换
|
||
|
||
举例：
|
||
|
||
|
||
```javascript
|
||
var str = "abcdEFG";
|
||
|
||
//转换成小写
|
||
console.log(str.toLowerCase());
|
||
//转换成大写
|
||
console.log(str.toUpperCase());
|
||
```
|
||
|
||
|
||
|
||
## html方法
|
||
|
||
- anchor() 创建a链接
|
||
|
||
- big()
|
||
|
||
- sub()
|
||
|
||
- sup()
|
||
|
||
- link()
|
||
|
||
- bold()
|
||
|
||
注意，str.link() 返回值是字符串。
|
||
|
||
举例：
|
||
|
||
```javascript
|
||
var str = "你好";
|
||
|
||
console.log(str.anchor())
|
||
console.log(str.big())
|
||
console.log(str.sub())
|
||
console.log(str.sup())
|
||
console.log(str.link("http://www.baidu.com"));
|
||
console.log(str.bold())
|
||
```
|
||
|
||
20180202_1536.png
|
||
|
||
|
||
|
||
|
||
|
||
## 字符串练习
|
||
|
||
**练习1：**"smyhvaevaesmyh"查找字符串中所有m出现的位置。
|
||
|
||
代码实现：
|
||
|
||
|
||
```javascript
|
||
var str2 = "abcoefoxyozzopp";
|
||
for(var i=0;i<str2.length;i++){
|
||
//如果指定位置的符号=== "o"
|
||
//str2[i]
|
||
if( str2.charAt(i)==="o"){
|
||
console.log(i);
|
||
}
|
||
}
|
||
```
|
||
|
||
|
||
|
||
**练习2：**判断一个字符串中出现次数最多的字符，统计这个次数
|
||
|
||
|
||
```html
|
||
<script>
|
||
var str2 = "smyhvaevaesmyhvae";
|
||
|
||
//定义一个json，然后判断json中是够有该属性，如果有该属性，那么值+1;否则创建一个该属性，并赋值为1；
|
||
var json = {};
|
||
for (var i = 0; i < str2.length; i++) {
|
||
//判断：如果有该属性，那么值+1;否则创建一个该属性，并赋值为1；
|
||
var key = str2.charAt(i);
|
||
if (json[key] === undefined) {
|
||
json[key] = 1;
|
||
} else {
|
||
json[key] += 1;
|
||
}
|
||
}
|
||
console.log(json);
|
||
|
||
|
||
console.log("----------------");
|
||
//获取json中属性值最大的选项
|
||
var maxKey = "";
|
||
var maxValue = 0;
|
||
for (var k in json) {
|
||
// if(maxKey == ""){
|
||
// maxKey = k;
|
||
// maxValue = json[k];
|
||
// }else{
|
||
if (json[k] > maxValue) {
|
||
maxKey = k;
|
||
maxValue = json[k];
|
||
}
|
||
// }
|
||
}
|
||
console.log(maxKey);
|
||
console.log(maxValue);
|
||
|
||
|
||
</script>
|
||
```
|
||
|
||
|
||
打印结果：
|
||
|
||
20180202_1540.png
|
||
|
||
|
||
## 内置对象 Math
|
||
|
||
内置对象 Math的常见方法：
|
||
|
||
- Math.abs(); **取绝对值**
|
||
|
||
- Math.floor(); **向下取整**（向小取）
|
||
|
||
- Math.ceil(); **向上取整**（向大取）
|
||
|
||
- Math.round(); 四舍五入取整（正数四舍五入，负数五舍六入）
|
||
|
||
- Math.random(); 随机数0-1
|
||
|
||
|
||
举例：
|
||
|
||
```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
|
||
```
|
||
|
||
20180202_1601.png
|
||
|
||
|
||
|
||
|
||
|
||
|
||
## 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
|
||
```
|
||
|
||
打印结果：
|
||
|
||
20180202_1432.png
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|