前端（三）—— JavaScript:ECMAScript

11. JS介绍

11.1 JavaScript概述

1、Javascript组成

JavaScript的实现包括以下3个部分：

核心（ECMAScript）	描述了JS的语法和基本对象
文档对象模型（DOM）	处理网页内容的方法和接口
浏览器对象模型（BOM）	与浏览器交互的方法和接口

2、ECMAScript和JavaScript的关系

1996年11月，JavaScript的创造者-Netscape公司，决定将JavaScript提交给国际标准化组织ECMA，希望这门语言能够成为国际标准。次年，ECMA发布262号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言的标准，并将这种语言称为ECMAScript，这个版本就是1.0版

该标准一开始就是针对JavaScript语言制定的，但是没有称其为JavaScript，有两个方面的原因。一是商标，JavaScript本身已被Netscape注册为商标。二是想体现这门语言的制定者是ECMA，而不是Netscape，这样有利于保证这门语言的开发性和中立性。

因此ECMAScript和JavaScript的关系是：
① ECMAScript是一个标准，JS只是它的一个实现，其他实现包括ActionScript；
② “ECMAScript可以为不同种类的宿主环境提供核心的脚本编程能力……”，即ECMAScript不与具体的宿主环境相绑定，如JS的宿主环境是浏览器，AS的宿主环境是Flash；
③ECMAScript描述了以下内容：语法、类型、语句、关键字、保留字、运算符、对象

3、ECMAScript的历史

年份	名称	描述
1997	ECMAScript 1	第一个版本
1998	ECMAScript 2	版本变更
1999	ECMAScript 3	添加正则表达式 添加try/catc
	ECMAScript 4	没有发布
2009	ECMAScript 5	添加"strict mode"严格模式 添加JSON支持
2011	ECMAScript 5.1	版本变更
2015	ECMAScript 6	添加类和模块
2016	ECMAScript 7	增加指数运算符（**） 增加Array.prototype.includes

注意：

1、ES6就是指ECMAScript 6

2、尽管 ECMAScript 是一个重要的标准，但它并不是 JavaScript 唯一的部分，当然，也不是唯一被标准化的部分。实际上，一个完整的 JavaScript 实现是由以下 3 个不同部分组成的：
① 核心（ECMAScript） - 代码
② 文档对象模型（DOM） Document object model (整合js，css，html)
③ 浏览器对象模型（BOM） Broswer object model（整合js和浏览器）

简单地说，ECMAScript描述JavaScript语言本身的相关内容。JavaScript是脚本语言；是一种轻量级的编程语言；是可插入HTML页面的编程代码。JavaScript插入HTML 页面后，可由所有的现代浏览器执行

11.2 JavaScript引入方式

方式一：Script标签内写代码

其实我们也可以在网页中进行检查，写上代码并执行，如下：

方式二：引入外部JS文件

有点类似于CSS中引入外部的文件，我们可以新建个JS文件，并在其中写入相关的代码，并在HTML中引入该文件

11.3 JavaScript语言规范

使用Python在PyCharm中运行JavaScript代码，并且输出结果，需要在PyCharm安装node.js插件

11.3.1 打印

console.log()    // 类似于print()

11.3.2 注释

① 单行注释：

//这是单行注释

② 多行注释：

/*
这里面可以放些多行的注释
这里面可以放些多行的注释
*/

11.3.3 结束符

JavaScript中的语句要以分号为结束符

11.4 JavaScript语言基础

11.4.1 变量命名

JavaScript的变量名可以使用_，数字，字母，$组成，不能以数字开头

11.4.2 声明变量

① 变量名是区分大小写的
② 推荐使用驼峰式命名规则，首字母大写
③ 保留字不能用做变量名

11.4.3 声明变量的方式

1、方式一：使用var

① 使用var可以一次声明一个变量，也可以一次声明多个变量，不同变量之间使用逗号隔开

var name;                //一次声明一个变量
var name, age, gender;   //一次声明多个变量

② 声明变量时可以不初始化（即赋初值），此时其值默认为undefined；也可以在声明变量的同时初始化变量

var name = "雨落"；                          //声明的同时初始化变量
var name = "雨落", age = 18, gender;         //在一条声明中初始化部分变量
var name = "雨落", age = 18, gender = '男';  //在一条声明中初始化全部变量

③ 变量的具体数据类型根据所赋的值的数据类型来确定

var message = "hello";   //值为字符串类型，所以message变量的类型为字符串类型
var message = 123;       //值为数字类型，所以message变量的类型为数字类型
var message = true;      //值为布尔类型，所以message变量的类型为布尔类型

④ 在实际应用中，常常直接将循环变量的生命作为循环语法的一部分

for(var i = 0 ; i < 10 ; i += );  

2、使用let

ES6新增了let命令，用于声明变量。其用法类似于var，但是所声明的变量只在let命令所在的代码块内有效。例如：for循环的计数器就很适合使用let命令

for(let i = 0 ; i < 10 ; i += );  

3、使用const

ES6新增const用来声明常量。一旦声明，其值就不能改变。这个东西就是为了定义一个固定的常量，供大家使用，这个常量不会改变。需要特别注意的是：使用const声明变量时，必须给变量赋初值，且该值在整个代码的运行过程中不能被修改。另外，变量也不能重复多次声明。这些要求任何一点没满足都会报错

const PI = 3.1415;
console.log(PI);    // 3.1415

PI = 3;             // TypeError: "PI" is read-only

11.5 JavaScript数据类型

静态语言比如c：创建变量时，要指定变量的类型，python3.6也出现了类型注解的新特性def func(x:int, y:int) --> int: return x + y，意思是参数是int类型，返回值也是int类型的，起到注释的作用

var x;             // 此时x是undefined
var x = 1;         // 此时x是数字
var x = "YuLuo"    // 此时x是字符串

11.5.1 数值(Number)

JavaScript不区分整型和浮点型，就只有一种数字类型

var a = 12.34;
var b = 20;
var c = 123e5;     // 12300000
var d = 123e-5;    // 0.00123

还有一种NaN，表示不是一个数字（Not a Number），也就是说是一个值，但不是数字。parseInt()函数可解析一个字符串，并返回一个整数；parseFloat()函数可解析一个字符串，并返回一个浮点数

console.log(parseInt('123'));     // 123
console.log(parseInt('ABC'));     // NaN
console.log(parseFloat('1.23'));  // 1.23

var a1 = 1.23;
console.log(a1);                  // 1.23
console.log(typeof a1);           // number

a2 = parseFloat('1.23');
console.log(a2);                  // 1.23
console.log(typeof a2);           // number

a3 = parseInt('123a');
console.log(a3);                  // 123
console.log(typeof a3);           // number

11.5.2 字符串(String)

var a = "Hello";
var b = "world;
var c = a + b; 
console.log(c);     // Helloworld

常用方法如下：

方法	说明
.length	查看字符串长度
.trim()	移除两端空白，得到一个新值
.trimLeft()	移除左边的空白，得到一个新值
.trimRight()	移除右边的空白，得到一个新值
.charAt(n)	返回第n个字符，类似索引，超过最大值返回''空字符串
.concat(value, ...)	拼接字符串
.indexOf(substring, start)	查找元素索引，这个start是从索引几开始找，没有返回-1
.substring(from, to)	根据索引获取子序列，不支持负数，所以一般都不用
.slice(start, end)	切片
.toLowerCase()	全部变小写
.toUpperCase()	全部变大写
.split(delimiter, limit)	分割

1、.length：查看字符串长度并返回值

var a = 'helloworld';
console.log(a.length);

// 输出结果：
10

2、.trim()：移除两端空白，得到一个新值，原值不改变

var a = '  he ll o ';
var b = a.trim();
console.log(b);

// 输出结果：
he ll o

3、.charAt(n)：返回第n个字符，类似索引，从0开始，超过最大值返回''空字符串

var a = 'hello';
var b = a.charAt(1);
console.log(b);

// 输出结果：
e

4、.concat(value, ...) ：拼接字符串

var a = 'hello';
var b = 'world';
var c = a.concat(b)；
console.log(c);

// 输出结果：
helloworld

5、.indexOf(substring, start) ：查找元素索引，这个start是从索引几开始找，没有返回-1

var a = 'helloworld';
var b = a.indexOf('o',3);
console.log(b)

// 输出结果：
4

6、.slice(start, end)：切片

var a = 'helloworld';
var b = a.slice(0, 5);
console.log(b)

// 输出结果：
hello

7、​​​​​​.toUpperCase()：全部变大写

var a = 'helloworld';
var b = a.toUpperCase();
console.log(b)

// 输出结果：
HELLOWORLD

8、.split(delimiter, limit)：分割，后面的参数是指返回切割后的元素个数，超出也不会报错，只会按最大切割的元素个数返回

var a = 'helloworld';
var b = a.split('o',3);
console.log(b)

// 输出结果：
[ 'hell', 'w', 'rld' ]

注意区别：.slice(start, stop)和.substring(start, stop)

1、两者的相同点：
① 如果start等于end，返回空字符串
② 如果stop参数省略，则取到字符串末
③ 如果某个参数超过string的长度，这个参数会被替换为string的长度

2、substirng()的特点：
① 如果 start > stop ，start和stop将被交换
② 如果参数是负数或者不是数字，将会被0替换

3、silce()的特点：
① 如果 start > stop 不会交换两者
② 如果start小于0，则切割从字符串末尾往前数的第abs(start)个的字符开始(包括该位置的字符)
③ 如果stop小于0，则切割在从字符串末尾往前数的第abs(stop)个字符结束(不包含该位置字符)

补充：ES6中引入了模板字符串。模板字符串（template string）是增强版的字符串，用反引号（`）标识，ESC键下面那个键就是反引号。它可以当做普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。你使用chorme浏览器就行，chorme浏览器支持ES6

① 普通字符串
`这是普通字符串！`

② 多行文本
`这是多行的文本
这是多行的文本`


③ 字符串中嵌入变量
var name = "q1mi", time = "today";
`Hello ${name}, how are you ${time}?`

11.5.3 布尔值(Boolean)

① 区别于Python，true和false都是小写；
② 空字符串、0、null、undefined、NaN都是false

11.5.4 null和undefined

① null表示值是空，一般在需要指定或清空一个变量时才会使用，如 name=null；
② undefined表示当声明一个变量但未初始化时，该变量的默认值是undefined。还有就是函数无明确的返回值时，返回的也是undefined
③ null表示变量的值是空，undefined则表示只声明了变量，但还没有赋值

11.5.5 对象(Object)

① JavaScript 中的所有事物都是对象：字符串、数值、数组、函数...此外，JavaScript 允许自定义对象；
② JavaScript 提供多个内建对象，比如 Number、String、Date、Array 等，通过new实例化的对象都是object类型(var s = new String('hello')，var n = new Number(12)等)，数组不需要new生命，类型就是object类型；
③ 对象只是带有属性和方法的特殊数据类型

var a = 'aaa';
var b = new String('bbb');
var c = 111
var d = new Number(222)
console.log(typeof a);      // string
console.log(typeof b);      // object
console.log(typeof c);      // number
console.log(typeof d);      // object

11.5.6 数组(Array)

数组对象的作用是：使用单独的变量名来存储一系列的值。类似于Python中的列表

var a = [123, "ABC"];
var b = new Array([234, "def"])

console.log(a[1])       // ABC
console.log(typeof a)   // object
console.log(typeof b)   // object

常用方法如下：

方法	说明
.length	获取数组的元素个数
.push(ele)	尾部追加元素
.pop()	获取尾部的元素，并将其删除
.unshift(ele)	头部插入元素
.shift()	头部移除元素
.slice(start, end)	切片
.reverse()	反转，在原数组上改的
.join(seq)	将数组元素连接成字符串，seq是连接符
.concat(val, ...)	连接数组，得到一个新数组，原数组不变
.sort()	排序
.forEach()	将数组的每个元素传递给回调函数
.splice()	删除元素，并向数组添加新元素
.map()	返回一个数组元素调用函数处理后的值的新数组

1、.length：获取数组的元素个数

var a = [11, 22, 33, "aa"];
console.log(a.length);

// 输出结果：
4

2、.push(ele)：尾部追加元素

var a = [11, 22, 33, "aa"];
a.push(true);
console.log(a);

// 输出结果：
[ 11, 22, 33, 'aa', true ]

3、.pop()：获取尾部的元素，并将其删除

var a = [11, 22, 33, "aa"];
var b = a.pop();
console.log(a);
console.log(b)

// 输出结果：
[ 11, 22, 33 ]
aa

4、.unshift(ele)：头部插入元素

var a = [11, 22, 33, "aa"];
a.unshift('bb');
console.log(a);

// 输出结果：
[ 'bb', 11, 22, 33, 'aa' ]

5、.shift()：头部移除元素

var a = [11, 22, 33, "aa"];
var b = a.shift();
console.log(a);
console.log(b);

// 输出结果：
[ 22, 33, 'aa' ]
11

6、.slice(start, end)：切片

var a = [11, 22, 33, "aa"];
var b = a.slice(0,2);
console.log(b);

// 输出结果：
[ 11, 22 ]

7、.reverse()：反转，在原数组上改的

var a = [11, 22, 33, "aa"];
a.reverse();
console.log(a);

// 输出结果：
[ 'aa', 33, 22, 11 ]

8、.join(seq)：将数组元素连接成字符串，原数组不变，seq是连接符

var a = [11, 22, 33, "aa"];
var b = a.join('-');
console.log(a);
console.log(b);

// 输出结果：
[ 11, 22, 33, 'aa' ]
11-22-33-aa

9、.concat(val, ...)：连接数组，得到一个新数组，原数组不变

var a = [11, 22, 33, "aa"];
var b = ['bb', 'cc'];
var c = a.concat(b);
console.log(a);
console.log(b);
console.log(c);

// 输出结果：
[ 11, 22, 33, 'aa' ]
[ 'bb', 'cc' ]
[ 11, 22, 33, 'aa', 'bb', 'cc' ]

10、.sort()  ：排序，它会把数字转化成字符串，按照ASCII码进行排序

1、借助函数前的排序：
var a = [12, 3, 45, 6];
var b = a.sort();
console.log(b);


// 输出结果：
[ 12, 3, 45, 6 ]

注意：想要解决这个问题，就得借助一个函数，该函数的实线原理如下，将数组里的前两个值传给参数a和b，如果a-b>0，则调换a，b值的前后顺序，再把第二个值和第三个值传给参数a和b，以此类推最终得出一个升序的数组

2、借助函数后得排序：
function sortNumeber(a, b){
  return a - b
};
var a = [12, 3, 45, 6];
var b = a.sort(sortNumeber);
console.log(b);

// 输出结果：
[ 3, 6, 12, 45 ]

11、.forEach()：将数组的每个元素传递给回调函数

语法：

forEach(function(currentValue, index, arr), thisValue)

注意：
1. 函数function()：必需，指数组中每个元素需要调用的函数；
2. 参数currentValue：必需，指当前元素；
3. 参数index：可选，指当前元素的索引值；
4. 参数arr：可选，当前元素所属的数组对象；
5. 参数thisValue：可选，传递给函数的值一般用 "this" 值（默认undefined）

12、.splice()：删除元素，并向数组添加新元素，有三个参数，分别对应从哪删（索引），删多少，删除位置新替代的元素（可写多个元素）

var a = [11, 22, 33, "aa"];
var b = a.splice(1,1, 'bb', 'cc');
console.log(a);
console.log(b);

// 输出结果：
[ 11, 'bb', 'cc', 33, 'aa' ]
[ 22 ]

13、.map()：返回一个数组元素调用函数处理后的值的新数组

语法：

map(function(currentValue,index,arr), thisValue)

注意：
1. 函数function()：必需，指数组中的每个元素都会执行这个函数；
2. 参数currentValue：必需，指当前元素；
3. 参数index：可选，指当前元素的索引值；
4. 参数arr：可选，当前元素所属的数组对象；
5. 参数thisValue：可选，传递给函数的值一般用 "this" 值（默认undefined）

11.6 内置对象和方法

JavaScript中的所有事物都是对象：字符串、数字、数组、日期，等等。在JavaScript中，对象是拥有属性和方法的数据

类型	内置对象	介绍
数据类型	Number	数字对象
	String	字符串对象
	Boolean	布尔值对象
组合对象	Array	数组对象
	Math	数学对象
	Date	日期对象
高级对象	Object	自定义对象
	Error	错误对象
	Function	函数对象
	RegExp	正则表达式对象
	Global	全局对象

11.6.1 自定义对象

JavaScript的对象（Object）本质上是键值对的集合（Hash结构），但是只能用字符串作为键

var a = {'name': '雨落','age': 18};
console.log(typeof a);      //object


// 可以通过简直对的形式取值
console.log(a['name']);     // 雨落

// 可以通过万能的点取值
console.log(a.age);         // 18

for循环遍历对象中的内容：

var a = {'name': '雨落','age': 18};
for (var i in a){
  console.log(i, a[i]);
}

// 输出结果：
name 雨落
age 18

类型查询：typeof是一个一元运算符（就像++，--，！，- 等一元运算符），不是一个函数，也不是一个语句。如果变量是一种引用类型或 Null 类型的，需要注意的是typeof null返回为object，因为特殊值null被认为是一个空的对象引用

console.log(typeof "abc")       // string
console.log(typeof null)        // object
console.log(typeof true)        // boolean
console.log(typeof 123)         // number
console.log(typeof NAN)         // undefined
console.log(typeof undefined)   // undefined

11.7 运算符

11.7.1 算数运算符

加+、减-、乘*、除/、取余%、自加++、自减--

注意i++和++i：两者都意为自加1，i++操作优先级低，先执行逻辑，然后再自加1；而++i，这个自加操作优先级高，先自加1，然后再执行代码后面的逻辑

var a = 100;
a++;
console.log(a);
++a;
console.log(a);

// 输出结果：
101
102

var a = 100;
console.log(a++ == 100);  // true   先判断此时a==100？在执行加1

var b = 100;
console.log(++b == 100);  // false  先执行加1，再判断此时a==100？

11.7.2 比较运算符

大于>、大等于>=、小于<、小等于<=、不等于!=、相等==、全等===、不全等!==

注意==和===：===意为全等于，既比较类型也比较值，不做类型转换，类型不同的一定不等；==意为弱等于，两边值类型不同的时候，要先进行类型转换，再比较

console.log(1 == "1" )    // true
console.log(1 === "1")    // false

11.7.3 逻辑运算符

① && 类似于and，同为真则取真
console.log(1 && 0)   // 0

② || 类似于or，有一真即为真
console.log(1 || 0)   // 1

③ ! 类似于not，取反
console.log(!0)       //true

11.7.4 赋值运算符

赋值=、加等于+=、减等于-=、乘等于*=、除等于/=

11.8 流程控制

11.8.1 if - else

var a = 10;
if (a > 5){
  console.log("yes");
}else {
  console.log("no");
}

// 输出结果：
yes

11.8.2 if - else if - else

var a = 10;
if (a > 5){
  console.log("a > 5");
}else if (a < 5) {
  console.log("a < 5");
}else {
  console.log("a = 5");
}

// 输出结果：
a > 5

11.8.3 switch切换

var a = 1;
switch (a){
  case 0:
    console.log("等于0");
    break;
  case 1:
    console.log("等于1");
    break;
  default:
    console.log("不是0或1");
}

// 输出结果：
等于1

11.8.4 while循环

var i = 0;
while (i < 3) {
  console.log(i);
  i++;
}

// 输出结果：
0
1
2

11.8.5 for循环

var a = [11, 22, 33];
for (var i in a){
  console.log(i);
}

// 输出结果：
0
1
2

var a = [11, 22, 33];
for (var i=0; i<a.length; i++){
  console.log(i, a[i]);
}

// 输出结果：
0 11
1 22
2 33

var a = {'k1':'v1', k2:'v2'};    // 键可以不加引号
for (var i in a){
    console.log(i, a[i]);
}

// 输出结果：
k1 v1
k2 v2

11.8.6 三元运算

var a = 1;
var b = 2;
var c = a > b ? a : b
/* 如果a>b这个条件成立，就把冒号前面的值给c，否则把冒号后面的值给c，
类似于python中的：c = a if a > b else b */
console.log(c)

// 输出结果：
2

12. JS函数

12.1 函数定义

1、普通函数

function f1() {
  console.log("Hello world!");
}

f1();

// 输出结果：
Hello world!

2、带参数的函数

function f2(a, b) {
  console.log(arguments);         // 内置的arguments对象
  console.log(arguments.length);
  console.log(a, b);
}

// 输出结果：
[Arguments] { '0': 1, '1': 2 }
2
1 2

3、带返回值的参数

function sum(a, b){
  return a + b;  
}
/* 在JS中，return a ，b; 只能给你返回最后一个值，
如果就想返回多个值，你可以用数组包裹起来 return [a,b]; */

console.log(sum(1, 2));
/* sum(1,2,3)，参数给多了，也不会报错，还是执行前两个参数的和，
sum(1)，少参数或者没参数也不报错，不过返回值就会是NAN */

// 输出结果：
3

4、 匿名函数 - 多和其他函数配合使用

var sum = function(a, b){
/* 在ES6中，使用var，可能会飘黄但不影响，建议你使用let来定义变量 */
  return a + b;  
}

console.log(sum(1, 2));

// 输出结果：
3

5、立即执行函数 - 函数直接执行，无需被调用执行

(function(a, b){
  console.log(a + b);
})(1, 2);
/* Python中写可以这么写：
ret=(lambda x, y : x + y)(10, 20)
print(ret) */

// 输出结果：
3

补充：ES6中允许使用“箭头”（=>）定义函数，可以理解为匿名函数，用的不多

var f = v => v;

// 等同于
var f = function(v){
  return v;
}

如果箭头函数不需要参数或需要多个参数，就是用圆括号代表参数部分

var f = () => 5;

// 等同于
var f = function(){return 5};

var sum = (num1, num2) => num1 + num2;

// 等同于
var sum = function(num1, num2){
  return num1 + num2;
}

12.2 函数中的arguments参数

function add(a,b){
  console.log(a+b);
  console.log(arguments.length)
  /* 获取传入的参数的个数，arguments就是指传入的所有的实参，
  放在一个数组里面，这个arguments.length是统计这个数组的元素的个数 */
}

add(1,2)

// 输出结果：
3
2

注意：函数只能返回一个值，如果要返回多个值，只能将其放在数组或对象中返回

12.3 函数的全局变量和局部变量

1、局部变量：在JavaScript函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它（该变量的作用域是函数内部）。只要函数运行完毕，本地变量就会被删除

2、全局变量：在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它

3、变量生存周期：
        ① JavaScript变量的生命期从它们被声明的时间开始
        ② 局部变量会在函数运行以后被删除
        ③ 全局变量会在页面关闭后被删除

12.4 作用域

首先在函数内部查找变量，找不到则到外层函数查找，逐步找到最外层

var city = "BeiJing";
function f() {
  var city = "ShangHai";
  function inner(){
    var city = "ShenZhen";
    console.log(city);
  }
  inner();
}

f();

// 输出结果：
ShenZhen

/* 分析：
当执行f()函数时，会执行f()内的inner()函数，自内而外寻找city这个变量。
发现inner()函数内部的city = "ShenZhen" */

var city = "BeiJing";
function Bar() {
  console.log(city);
}
function f() {
  var city = "ShangHai";
  return Bar;
}
var ret = f();
ret(); 

// 输出结果：
BeiJing

/* 分析：
当执行ret()函数，会执行f()函数，进而return Bar，会执行Bar()函数。
进而打印Bar()内的city，只能在全局变量找到city = "BeiJing" */

var city = "BeiJing";
function f(){
    var city = "ShangHai";
    function inner(){
        console.log(city);
    }
    return inner;
}
var ret = f();
ret();

// 输出结果：
ShangHai

13. 对象

13.1 面向对象

1、创建对象

var person=new Object();  // 创建一个person对象
person.name="YuLuo";      // person对象的name属性
person.age=18;            // person对象的age属性

面向对象，在ES5中没有类的概念，只有个构造函数，命名的首字母要大写，实例化的时候使用new关键字进行实例化

function Person(name){
    this.name = name;    // 封装属性；此处的this类似于Python函数的self
}
var p = new Person('yuluo');
console.log(p)
console.log(p.name)

// 输出结果：
Person { name: 'yuluo' }
yuluo

Person.prototype.sum = function (a, b){  // 封装方法
    return a + b;
}
console.log(p.sum(1, 2))

// 输出结果：
3

13.2 Date对象

var d = new Date();
console.log(d);                   // Wed Nov 15 2023 23:31:14 GMT+0800
console.log(d.toDateString());    // Wed Nov 15 2023
console.log(d.toLocaleString());  // 2023/11/15 11:31:14
console.log(d.getDate());         // 15    获取日份
console.log(d.getDay());          // 3     获取星期（0-6，0表示周一，依次类推）
console.log(d.getMonth());        // 10    获取月份（0-11，0表示1月，依次类推）
console.log(d.getFullYear());     // 2023  获取完整年份
console.log(d.getHours());        // 23    获取小时
console.log(d.getMinutes());      // 31    获取分钟
console.log(d.getSeconds());      // 14    获取秒钟
console.log(d.getMilliseconds()); // 992   获取毫秒
console.log(d.getTime());         // 1700062274992  1970/1/1午夜至今的毫秒数

13.3 JSON对象

var str1 = '{"name": "yuluo", "age": 18}';
var obj1 = {"name": "yuluo", "age": 18};

// JSON字符串转换成对象 - 反序列化
var obj = JSON.parse(str1);

// 对象转换成JSON字符串 - 序列化
var str = JSON.stringify(obj1);

console.log(obj);
console.log(str);

// 输出结果：
{ name: 'yuluo', age: 18 }
{"name":"yuluo","age":18}

13.3 RegExp对象

1、正则匹配

// 设置正则的方式一：
var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$");

// 设置正则的方式二：
var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/;


var s = 'yuluo';
console.log(reg2.test(s))   // 检查字符串s是否符合reg2的正则要求
console.log(reg2.test())    // 此处test()为空，JS默认添加了'undefined'

// 输出结果：
false
true

/* 分析：
自定义字符串s='yuluo'，只有5个字符串，不满足reg2的正则要求{5,11}，
最起码要多于5个字符串，不超过11个字符串，且第一个字符满足[a-zA-Z]，
即只能是小写的a-z以及大写的A-Z */

使用正则全局匹配的时候要注意一点，test不要超出匹配的元素个数

var reg = /u/g
var s = 'yuluo is a cool boy';
console.log(reg.test(s))     // true
console.log(reg.lastIndex)   // 2
console.log(reg.test(s))     // true
console.log(reg.lastIndex)   // 4
console.log(reg.test(s))     // false
console.log(reg.lastIndex)   // 0

/* 分析：
正则规则里面写了/u/g，全局匹配的时候，就会出现lastIndex，
第一次test时，lastIndex为2；当test过多超过匹配的元素个数时，就会返回false */

2、match匹配

var s = 'yuluo';
console.log(s.match(/u/))     // 匹配出第一个u，并告知索引位置
console.log(s.match(/u/)[0])  // 匹配出第一个u，并打印出来
console.log(s.match(/u/g))    // 全局匹配，找出所有的u，以数组打印出来

// 输出结果：
[ 'u', index: 1, input: 'yuluo', groups: undefined ]
u
[ 'u', 'u' ]

3、search匹配

var s = 'yuluo';
console.log(s.search(/u/))     // 匹配出第一个u的索引位置

// 输出结果：
1

4、split分割

var s = 'yuluo';
console.log(s.split(/u/))     // 用符合正则规则的元素分割字符串

// 输出结果：
[ 'y', 'l', 'o' ]

13.4 Math对象

Math：不需要new来创建对象，直接使用Math.下面的方法

方法	描述
.abs(x)	返回数的绝对值
.exp(x)	返回 e 的指数
.floor(x)	小数部分进行直接舍去
.log(x)	返回数的自然对数（底为e）
.max(x,y)	返回 x 和 y 中的最高值
.min(x,y)	返回 x 和 y 中的最低值
.pow(x,y)	返回 x 的 y 次幂
.random()	返回 0 ~ 1 之间的随机数
.round(x)	把数四舍五入为最接近的整数
.sin(x)	返回数的正弦
.sqrt(x)	返回数的平方根
.tan(x)	返回角的正切

console.log(Math.abs(-2));      // -2的绝对值为2
console.log(Math.exp(2));       // e的2次方为7.389
console.log(Math.floor(2.9));   // 2.9舍去小数部分为2
console.log(Math.log(2));       // 0.693
console.log(Math.max(2, 3));    // 3
console.log(Math.min(2, 3));    // 2
console.log(Math.pow(2, 3));    // 2的3次方为8
console.log(Math.random());     // 随机产生0-1的随机数
console.log(Math.sin(3.14));    // 3.14（约等于π）的正弦值为0.002
console.log(Math.sqrt(4));      // 4的平方根为2
console.log(Math.tan(3.14));    // 3.14（约等于π）的正切值为-0.02