JavaScript学习笔记（2）

---

一、运算符

1.算术运算符

运算符	描述	示例
+	加法	x+y
-	减法	x-y
*	乘法	x*y
* *	幂（ES2016）	var x=5；var z = x ** 2; 结果为25
/	除法	x/y
%	取余数	x%y
+ +	递加	x++
–	递减	x–

2.操作运算符

运算符	描述	示例	等价于
+=	递增赋值	x=3；x+=4；	x=3；x=x+4；
-=	递增赋值	x=3；x-=4；	x=3；x=x-4；
*=	递增赋值	x=3；x*=4；	x=3；x=x*4；
/=	递增赋值	x=3；x/=4；	x=3；x=x/4；

3.比较运算符

运算符	描述
===	严格相等运算符
==	相等运算符
!=	不相等运算符
!==	严格不相等运算符
>	大于运算符
>	大于运算符
<	小于运算符
>=	大于等于运算符
<=	小于等于运算符

等值等型=== 示例:

3===3  //true 类型值相同
3==='4' //false 类型不同，直接返回false 
NaN===NaN //false 需要注意NaN与任何值都不相等包括自身
+0===-0 //true
1===0x1 //true 十进制的1与十六进制的1，值和类型都是相同的
//undefined和null与自身严格相等
undefined === undefined // true
null === null // true
//两个复合类型（对象、数组、函数）的数据比较时，不是比较它们的值是否相等，而是比较它们是否指向同一个地址。
{} === {} // false
[] === [] // false
(function () {} === function () {}) // false
//如果两个变量引用同一个对象，则它们相等
var v1 = {};
var v2 = v1;
v1 === v2 // true

相等运算符== 示例:
比较不同类型的数据时，相等运算符会先将数据进行类型转换，然后再用严格相等运算符比较。下面分成几种情况，讨论不同类型的值互相比较的规则。

(1)原始类型值(原始类型的值会转换成数值再进行比较。)

1==true //true 等同于1===Number(true)
0==false //true 等同于0===Number(false)
'true'=true //false  等同于 Number('true') === Number(true)  等同于 NaN === 1
''==0//ture  等同于 Number('') === 0  等同于 0 === 0
'' == false  // true 等同于 Number('') === Number(false) 等同于 0 === 0
'1' == true  // true 等同于 Number('1') === Number(true) 等同于 1 === 1
'\n  123  \t' == 123 // true 因为字符串转为数字时，省略前置和后置的空格

（2）对象与原始类型值比较

// 数组与数值的比较
[1] == 1 // true
// 数组与字符串的比较
[1] == '1' // true
[1, 2] == '1,2' // true
// 对象与布尔值的比较
[1] == true // true
[2] == true // false

（3）undefined 和 null
undefined和null只有与自身比较，或者互相比较时，才会返回true；与其他类型的值比较时，结果都为false。

undefined == undefined // true
null == null // true
undefined == null // true
false == null // false
false == undefined // false
0 == null // false
0 == undefined // false

（4）相等运算符的缺点
相等运算符隐藏的类型转换，会带来一些违反直觉的结果。

0 == ''             // true
0 == '0'            // true

2 == true           // false
2 == false          // false

false == 'false'    // false
false == '0'        // true

false == undefined  // false
false == null       // false
null == undefined   // true

' \t\r\n ' == 0     // true

非相等运算符：字符串的比较

'cat' > 'dog' // false
'cat' > 'catalog' // false
'cat' > 'Cat' // true' JavaScript 引擎内部首先比较首字符的 Unicode 码点。如果相等，再比较第二个字符的 Unicode 码点，以此类推。 
'大' > '小' // false “大”的 Unicode 码点是22823，“小”是23567，

非相等运算符：非字符串的比较

5 > '4' // true 等同于 5 > Number('4') 即 5 > 4 
true > false // true  等同于 Number(true) > Number(false) 即 1 > 0
2 > true // true 等同于 2 > Number(true) 即 2 > 1

这里需要注意与NaN的比较。任何值（包括NaN本身）与NaN使用非相等运算符进行比较，返回的都是false。

1 > NaN // false
1 <= NaN // false
'1' > NaN // false
'1' <= NaN // false
NaN > NaN // false
NaN <= NaN // false

4.逻辑运算符

运算符	描述
&&	逻辑与
||	逻辑或
!	逻辑非

示例:

 var x=300,y=400
 console.log(x==300&&y==400); //true 当x和y必须同时为true，才返回true，反之为false
 console.log(x==300||y==500); //true 当x和y其中一个为true，才返回true，两个都为false，才返回false
console.log(!(x==y))//true  相当于x不等于y 

运算符的优先级
优先级从高到底
1.（）优先级最高
2.一元运算符 ++ – ！
3.算术运算符 先* 、% 后 + -
4.关系运算符 > >= < <=
5.相等运算符 == != !== ===
6.逻辑运算符 先&& 后||

5.类型运算符

运算符	描述
typeof	返回变量的类型。
instanceof	返回 true，如果对象是对象类型的实例。

示例：

conse.log(typeof 'bill') //返回String
conse.log(typeof 3.1545) //返回number
conse.log(typeof NaN) //返回number
conse.log(typeof false) //返回boolean
conse.log(typeof [1,2,3,4] ) //返回object
conse.log(typeof {name:'Bill', age:62}) //返回object
conse.log(typeof new Date()) //返回object
conse.log(typeof function () {}) //返回object
conse.log(typeof myCar ) //返回undefined
conse.log(typeof null) //返回object

 var x=[1,2,4],y={}
 conse.log(x instanceof Array ) //true
 conse.log(x instanceof Object) //true
 conse.log(y instanceof Object) //true
 function test () {} 
 conse.log(test instanceof Function) //true

5.三元运算符

语法：

条件表达式？结果 1:结果 2

含义：问号前面的位置是判断的条件，判断结果为 boolean 型，为 true 时执行结果 1，为 false 时执行结果 2。

实例：

3>2?console.log("3 比 2 大") : console.log("3 比 2 小");

二、字符串 String

1.什么是字符串？

字符串可以使用单引号或双引号，也可以在字符串中使用引号，只要不匹配包围字符串的引号即可。比如：

var carname = "lw";
var answer = "I am 'lw'";
var test = 'I am "lw"';

下面的代码会混淆浏览器和字符串的结束位置:

var test = 'I've got no right to take my place...';

换种方式：

var test = "I have got no right to take my place...";
var test1 = "I've got no right to take my place...";

还有另一种方式，使用转义符号。在 JavaScript 中，我们通过在字符之前放一个反斜杠来实现这一点。试试这个:

var test = 'I\'ve got no right to take my place...';

2.转义符

转义字符	结果	描述
\\	\	表示斜杠
\’	’	表示一个单引号字符
\"	"	表示双引号符号

下面这六个转义字符最初设计用于控制打字机、电传打字机和传真机。它们在 HTML 中没有任何意义。

转义字符	结果	描述
\b	退格键	退格，将当前位置移到前一列
\f	换页	换页，将当前位置移到下一页开头
\n	新行	换行，将当前位置移到下一行开头
\r	回车	回车，将当前位置移到本行开头
\t	水平制表符	水平制表符（跳到下一个TAB位置）
\v	垂直制表符	垂直制表

3.连接字符串

通过“+”连接字符串，示例：

var test1="hello,bill"
var test2="I'm rose"
var test=test1+test2

4.字符串转换

可以通过toString()方法把数字转换成字符串

var num=123;
var testString=num.toString()
console.log(typeof testString) //结果为string

也可以通过Number()对象把字符串转为数字

var myString="123";
var myNum=Number(myString)
console.log(typeof myNum) //结果为number

5.prototype属性

prototype 属性允许您向对象添加属性和方法 。
注意： Prototype 是全局属性，适用于所有的 Javascript 对象。
语法：object.prototype.name=value

String.prototype.replaceAll = function(search, replacement) {
    var target = this;
    return target.replace(new RegExp(search, 'g'), replacement);
};
	var str="Visit Microsoft!Visit Microsoft!Visit Microsoft!";
	var n=str.replaceAll("Microsoft","Runoob"); //返回 Visit Runoob!Visit Runoob!Visit Runoob!

6.字符串方法和属性

名称	参数	描述
length	无	属性，长度，返回数字
indexOf()	第一个为必须，需检索的字符串值。第二个可选，规定在字符串中开始检索的位置	返回某个指定的字符串值在字符串中首次出现的位置，未找到返回-1
lastIndexOf()	第一个为必须，需检索的字符串值。第二个可选，规定在字符串中开始检索的位置	返回字符串中指定文本最后出现的索引（位置），未找到返回-1。
search()	必须。查找的字符串或者正则表达式。	查找与正则表达式相匹配的值。
slice()	第一个参数为必须:要抽取的片断的起始下标，第一个字符位置为 0。如果为负数，则从尾部开始截取。第二个参数可选:紧接着要截取的片段结尾的下标。若未指定此参数，则要提取的子串包括 start 到原字符串结尾的字符串。如果该参数是负数，那么它规定的是从字符串的尾部开始算起的位置。slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素)	提取字符串的片断，并在新的字符串中返回被提取的部分。
substring()	第一个参数为必须:一个非负的整数，规定要提取的子串的第一个字符在 string Object 中的位。第二个参数可选:一个非负的整数，比要提取的子串的最后一个字符在 string Object 中的位置多 1。如果省略该参数，那么返回的子串会一直到字符串的结尾。	提取字符串中两个指定的索引号之间的字符。
replace()	第一个参数必须:规定子字符串或要替换的模式的 RegExp 对象，请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 RegExp 对象‘第二个参数必须:一个字符串值,规定了替换文本或生成替换文本的函数	在字符串中查找匹配的子串，并替换与正则表达式匹配的子串
toUpperCase()	无	把字符串转换为大写
toLowerCase()	无	把字符串转换为小写
concat()	必须。多个	连接两个或更多字符串，并返回新的字符串。
trim()	无	删除字符串两端的空白符
charAt()	一个参数：必须。表示字符串中某个位置的数字，即字符在字符串中的位置	返回在指定位置的字符。
charCodeAt()	一个参数：必须。表示字符串中某个位置的数字，即字符在字符串中的下标。	返回在指定的位置的字符的 Unicode 编码。
split()	第一个参数可选：字符串或正则表达式，从该参数指定的地方分割 string Object。第二个参数可选：该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度。	把字符串分割为字符串数组。
includes()	第一个参数必须：要查找的字符串，第二个参数可选：设置从那个位置开始查找，默认为 0。	查找字符串中是否包含指定的子字符串。如果有返回true，反之则为false。区分大小写
startsWith()	第一个参数必须：要查找的字符串。第二个参数可选：查找的开始位置，默认为 0。	查看字符串是否以指定的子字符串开头。
endsWith()	第一个参数必须：要搜索的子字符串，第二个参数可选：设置字符串的长度	判断当前字符串是否是以指定的子字符串结尾的（区分大小写），如果字符串以指定的值结尾返回 true，否则返回 false。
repeat()	必须，设置要复制的次数	复制字符串指定次数，并将它们连接在一起返回。
match()	一个参数必须：规定要匹配的模式的 RegExp 对象。如果该参数不是 RegExp 对象，则需要首先把它传递给 RegExp 构造函数，将其转换为 RegExp 对象。	复制字符串指定次数，并将它们连接在一起返回。
fromCharCode()	必须。一个或多个 Unicode 值	将 Unicode 编码转为字符’
toString()	无	返回一个字符串。

下面展示案例：

(1) 获取字符串长度(length)

通过length属性获取字符串长度，返回一个数字

var test="hello world";
console.log(test.length) //结果为11

(2) indexOf() 方法 和 lastIndexOf() 方法

indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。 如果没有找到匹配的字符串则返回 -1。

lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置，如果指定第二个参数start，则在一个字符串中的指定位置从后向前搜索。
注意： 该方法将从后向前检索字符串，但返回是从起始位置 (0)
开始计算子字符串最后出现的位置。 看它是否含有字符串。 开始检索的位置在字符串的 start 处或字符串的结尾（没有指定 start 时）。
如果没有找到匹配字符串则返回 -1 。

let str = "Please locate where 'locate' occurs!";
str.indexOf("locate")    // 返回 7
str.lastIndexOf("locate") //返回 21

str.indexOf("locate", 15)   //返回 21
str.lastIndexOf("locate", 15)    // 返回 7 请记住 lastIndexOf() 方法向后搜索，因此位置 15 表示从位置 15 开始搜索，并搜索到开头。

(3) includes() 方法

includes() 方法用于判断字符串是否包含指定的子字符串。如果找到匹配的字符串则返回 true，否则返回 false

var str = "Hello world, welcome to the Runoob.";
var n = str.includes("world");//返回 true
var n = str.includes("World");//返回 false  区分大小写
var n2 = str.includes("world", 12); //返回 false 从第 12 个索引位置开始查找字符串

(4) concat() 方法

concat() 方法用于连接两个或多个字符串。 该方法没有改变原有字符串，但是会返回连接两个或多个字符串新字符串。不操作原数据。

var str1="Hello ";
var str2="world!";
var str3=" Have a nice day!";
var n = str1.concat(str2,str3); //返回 "Hello world! Have a nice day!"

(5) slice() 方法

slice(start, end) 方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。使用 start（包含） 和end（不包含） 参数来指定字符串提取的部分。
start 参数字符串中第一个字符位置为 0, 第二个字符位置为 1, 以此类推，如果是负数表示从尾部截取多少个字符串，slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）。
end 参数如果为负数，-1 指字符串的最后一个字符的位置，-2 指倒数第二个字符，以此类推。
不操作原数据

var str="Hello world!";
var n=str.slice(3); //返回 "lo world!"
var n2=str.slice(3,8); //返回 "lo wo"
var n3=str.slice(-2);//返回 "d!"
var n4=str.slice(-4,-2);//返回 "rl" 

(6) substring() 方法

substring() 方法用于提取字符串中介于两个指定下标之间的字符。返回的子串包括 开始处的字符，但不包括 结束 处的字符。不操作原数据，start和end不能为负数。

var str="Hello world!"
var n=str.substring(3) //返回 "lo world!"
var n2=str.substring(3,8) //返回 "lo wo"

(7) repeate() 方法

repeat() 方法字符串复制指定次数。不操作原数据

var str = "Runoob";
var n=str.repeat(2);  //返回 "RunoobRunoob"

(8) trim() 方法

trim() 方法用于删除字符串的头尾空白符，空白符包括：空格、制表符 tab、换行符等其他空白符等。
trim() 方法不会改变原始字符串。
trim() 方法不适用于 null, undefined, Number 类型。

var str = "       Runoob        ";
var n=str.trim()  //返回 "Runoob"

(9) toLowerCase() 方法

toLowerCase() 方法用于把字符串转换为小写。不操作原数据

var str="RunOob";
var n=str.toLowerCase() //返回 "runoob"

(10) toUpperCase() 方法

toUpperCase() 方法用于把字符串转换为大写。不操作原数据

var str="RunOob";
var n=str.toUpperCase() //返回 "RUNOOB"

(11) startsWith() 方法

startsWith() 方法用于检测字符串是否以指定的子字符串开始。如果是以指定的子字符串开头返回 true，否则
false。startsWith() 方法对大小写敏感。

var str = "Hello world, welcome to the Runoob.";
var n = str.startsWith("Hello"); //返回true
var n2=str.startsWith("hello"); //返回false
var n3 = str.startsWith("world", 6); //返回true  查看从第 6 个索引位置是否以 "world" 开头:

(12) endsWith() 方法

endsWith() 方法用来判断当前字符串是否是以指定的子字符串结尾的（区分大小写）。如果传入的子字符串在搜索字符串的末尾则返回
true，否则将返回 false。

var str = "To be, or not to be, that is the question.";
var n = str.endsWith("question."); //返回true
var n2=str.endsWith("to be"); //返回false
var n3 = str.endsWith("to be", 19); //返回true  	设置字符串的长度

(13) charAt() 方法

charAt() 方法可返回指定位置的字符。第一个字符位置为 0, 第二个字符位置为 1,以此类推.

var str = "HELLO WORLD";
var n = str.charAt(2) //返回L

(14) charCodeAt() 方法

charCodeAt() 方法可返回指定位置的字符的 Unicode 编码，返回值是 0 - 65535 之间的整数，表示给定索引处的 UTF-16 代码单元。字符串中第一个字符的位置为 0， 第二个字符位置为 1，以此类推。

var str = "HELLO WORLD";
var n = str.charCodeAt(0); //返回72

(15) fromCharCode() 方法

fromCharCode() 可接受一个指定的 Unicode 值，然后返回一个字符串。
注意：该方法是 String 的静态方法，字符串中的每个字符都由单独的 Unicode 数字编码指定。
使用语法： String.fromCharCode()。

var n = String.fromCharCode(65); //返回 A
var n2 = String.fromCharCode(72,69,76,76,79); //返回 "HELLO"

(16) search() 方法

earch() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。如果没有找到任何匹配的子串，则返回 -1。

var str="Mr. Blue has a blue house!"; 
var n=str.search("has "); //返回 9
var n2=str.search("blue ") /返回 15
var n3=str.search(/blue/i) /返回 4 正则表达式忽略大小写

(17) match()方法

match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。
注意： match() 方法将检索字符串 String Object，以找到一个或多个与 regexp匹配的文本。这个方法的行为在很大程度上有赖于 regexp 是否具有标志 g。如果 regexp 没有标志 g，那么 match()方法就只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本， match() 将返回 null。否则，它将返回一个数组，其中存放了与它找到的匹配文本有关的信息。

var str="The rain in SPAIN stays mainly in the plain"; 
var n=str.match(/ain/g); //返回 ['ain', 'ain', 'ain']
var n=str.match(/ain/gi); //返回 [‘ain’,‘AIN’,‘ain’,‘ain’]
//判断是否微信浏览器
function is_weixn(){  
    var ua = navigator.userAgent.toLowerCase();  
    if(ua.match(/MicroMessenger/i)=="micromessenger") {  
        return true;  
    } else {  
        return false;  
    }  
}

(18) replace() 方法

replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
该方法不会改变原始字符串。

var str="Visit Microsoft! Visit Microsoft!";
var n=str.replace("Microsoft","Runoob"); //返回 "Visit Runoob! Visit Microsoft!"

var str2="Mr Blue has a blue house and a blue car";
var n2=str2.replace(/blue/g,"red"); //返回 "Mr Blue has a red house and a red car"

(19) split() 方法

split() 方法用于把一个字符串分割成字符串数组。
提示： 如果把空字符串 (“”) 用作 separator，那么 stringObject 中的每个字符之间都会被分割。
注意： split() 方法不改变原始字符串。

var str="How are you doing today?";
var n=str.split(" "); //返回 ['How', 'are', 'you', 'doing', 'today?']
var n2=str.split(); //返回 ['How', 'are', 'you', 'doing', 'today?'] 省略分割参数
var n3=str.split(""); //返回 ['H', 'o', 'w', ' ', 'a', 'r', 'e', ' ', 'y', 'o', 'u', ' ', 'd', 'o', 'i', 'n', 'g', ' ', 't', 'o', 'd', 'a', 'y', '?']
var n4=str.split(" ",3); //返回 ['How', 'are', 'you'] 将输出3个数组的值
var n5=str.split("o"); //返回 ['H', 'w are y', 'u d', 'ing t', 'day?']

三、数组 Array

1.什么是数组？

数组是一种特殊的变量，它能够一次存放一个以上的值。

2.创建一个数组

//1: 使用new方法创建
var myCars=new Array("Saab","Volvo",'BMW');
console.log(myCars)  //返回 ['Saab', 'Volvo', 'BMW']
var myCars=new Array(4); //这里的4指的是长度
//2: 字面:
let myArray2=[1, 2, 3, 4, 5] //直接输入一个数组（称“字面量数组”） 返回 [1, 2, 3, 4, 5]
//多维数组 多维数组就是数组中还包含数组
var student = [["张三", "男", "18"],["李四", "女", "20"],];
//3.Array.of()方式
var arr=Array.of("Saab","Volvo",'BMW')
console.log(arr) //返回 ['Saab', 'Volvo', 'BMW']

3.访问数组

通过指定数组名以及索引号码，你可以访问某个特定的元素。

示例：

var myCars=["Saab","Volvo","BMW"];
var name=myCars[0]; //返回 "Saab"
myCars[0]="Opel";  //修改了数组 myCars 的第一个元素 	[0] 是数组的第一个元素。[1] 是数组的第二个元素。
console.log(myCars) //返回 ["Opel","Volvo","BMW"] 
var student = [
  ["张三", "男", "18"],
  ["李四", "女", "20"],
];  
student[0][2]; // 返回"18"   表示数组student下标为0的 ["张三", "男", "18"] ,然后下标为2的是18

4.如何识别数组

var fruits =["Banana", "Orange", "Apple", "Mango"]
console.log(typeof fruits) //返回 object typeof 运算符返回 "object"，因为 JavaScript 数组属于对象。
// Array.isArray()方法
console.log(Array.isArray(fruits)) //返回 true
//instanceof 
console.log(fruits instanceof Array ) //返回 true

5.数组的长度

var fruits =["Banana", "Orange", "Apple", "Mango"]
console.log(fruits .length) //返回 4
console.log(fruits[fruits.length-1]) //返回 "Mango"

6.数组对象方法

1.includes() 包含

定义: includes() 方法确定数组是否包含指定的元素。 如果数组包含元素，则此方法返回 true，否则返回 false。、
注意区分大小写。

语法：array.includes(element, start)

参数	描述
element	必须。要搜索的元素。
start	可选。默认 0。在数组中的哪个位置开始搜索。

实例：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var n = fruits.includes("Mango"); //返回 true
var n2 = fruits.includes("Apple", 3); //返回 false 

2. indexOf() 查找第一个

定义:indexOf() 方法可返回数组中某个指定的元素位置。该方法将从头到尾地检索数组，看它是否含有对应的元素。开始检索的位置在数组start 处或数组的开头（没有指定 start 参数时）。如果找到一个 item，则返回 item 的第一次出现的位置。开始位置的索引为0。如果在数组中没找到指定元素则返回 -1。

语法:array.indexOf(item,start)

参数	描述
item	必须。查找的元素。
start	可选的整数参数。规定在数组中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。

实例：

var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
var a = fruits.indexOf("Apple"); //返回 2
var a2 = fruits.indexOf("Apple",4); //返回 6

3.lastIndexOf() 查找最后一个

定义:lastIndexOf() 方法在数组中搜索指定项目，并返回其位置。
搜索将从指定位置开始，如果未指定开始位置，则从末尾开始，并在数组的开头结束搜索。 如果未找到该项目，则 lastIndexOf() 方法返回
-1。 如果要搜索的项目不止一次出现，lastIndexOf() 方法将返回最后一次出现的位置。 提示：如果要从头到尾搜索，使用 indexOf() 方法。

语法:array.lastIndexOf(item, start)

参数	描述
item	必须。规定需检索的字符串值。
start	可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的最后一个字符处开始检索。

实例：

var fruits=["Banana","Orange","Apple","Mango","Banana","Orange","Apple"];
var a = fruits.lastIndexOf("Apple"); //返回 6
var a2 = fruits.lastIndexOf("Apple",4);  //返回2

4.slice() 提取

定义：slice() 方法可从已有的数组中返回选定的元素。该方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。
注意：slice() 方法不会改变原始数组。

语法：array.slice(start, end)

参数	描述
start	可选。规定从何处开始选取。如果该参数为负数，则表示从原数组中的倒数第几个元素开始提取，slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素（包含最后一个元素）
end	可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果该参数为负数， 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素（不包含最后一个元素，也就是只有倒数第二个元素）。

实例：

var fruits = ["Banana", "Orange", "Lemon", "Apple", "Mango"];
var myBest = fruits.slice(-3,-1); //返回 ['Lemon', 'Apple'] 截取倒数第三个（包含）到倒数第一个（不包含）的两个元素
var myBest2 = fruits.slice(-3);  //返回 ['Lemon', 'Apple', 'Mango'] 截取最后三个元素
var myBest3 = fruits.slice(); //返回 ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango']
var myBest4 = fruits.slice(0,3); //返回 ['Banana', 'Orange', 'Lemon']

5.concat() 合并

定义：concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组，而是返回一个新的数组。

语法：array1.concat(array2, array3,…, arrayX)

参数	描述
array2, array3,…, arrayX	必须。需要连接的数组。

实例：

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = ['g', 'h', 'i'];
const array4 = array1.concat(array2);
console.log(array4);  // 返回 ['a', 'b', 'c', 'd', 'e', 'f']
const array5=array1.concat(array2, array3); //返回 ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i']

6.join() 转字符串

定义：join() 方法用于把数组中的所有元素转换一个字符串。元素是通过指定的分隔符进行分隔的。

语法：array.join(separator)

参数	描述
separator	可选。指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。

实例：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
var a= fruits.join(" and "); //返回 "Banana and Orange and Apple and Mango"
var a=fruits.join() //返回 "Banana,Orange,Apple,Mango"
var a3=fruits.join("|") //返回 "Banana|Orange|Apple|Mango"

7.splice() 添加、删除

定义：splice() 方法用于添加或删除数组中的元素。
注意：这种方法会改变原始数组

语法：array.splice(index,howmany,item1,…,itemX)

参数	描述
index	必须。规定从何处添加/删除元素。该参数是开始插入和（或）删除的数组元素的下标，必须是数字。
howmany	可选。规定应该删除多少元素。必须是数字，但可以是 “0”。如果未规定此参数，则删除从 index 开始到原数组结尾的所有元素。
item1, …, itemX	可选。要添加到数组的新元素

实例：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2,1,"Lemon","Kiwi");  //返回  ['Banana', 'Orange', 'Lemon', 'Kiwi', 'Mango']
fruits.splice(2,2);  //返回 ['Banana', 'Orange', 'Mango']
fruits.splice(0,0,"Apple");  //返回 ['Apple', 'Banana', 'Orange', 'Mango']

8.sort() 排序

定义：sort() 方法用于对数组的元素进行排序。排序顺序可以是字母或数字，并按升序或降序。默认排序顺序为按字母升序。
注意：当数字是按字母顺序排列时"40"将排在"5"前面。使用数字排序，你必须通过一个函数作为参数来调用。函数指定数字是按照升序还是降序排列。这些说起来可能很难理解，你可以通过本页实例进一步了解它。
注意： 这种方法会改变原始数组！

语法：array.sort(sortfunction)

参数	描述
sortfunction	可选。规定排序顺序。必须是函数。

实例：

var points = [40,100,1,5,25,10];
points.sort(function(a,b){return a-b}); 
console.log(points) //返回 [1,5,10,25,40,100]
points.sort()
console.log(points) //返回  [1, 10, 100, 25, 40, 5]
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.sort();
console.log(fruits) //返回 ['Apple', 'Banana', 'Mango', 'Orange']

9.reverse() 反转

定义;reverse() 方法用于颠倒数组中元素的顺序。

语法：array.reverse()

实例：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.reverse();//返回  ['Mango', 'Apple', 'Orange', 'Banana']

10.push() 末尾添加

定义：push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。
注意： 新元素将添加在数组的末尾。
注意： 此方法改变数组的长度。

语法：array.push(item1, item2, …, itemX)

参数	描述
item1, item2, …, itemX	必须。要添加到数组的元素。

实例：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.push("Kiwi","Lemon","Pineapple")
console.log(fruits) //返回 ['Banana', 'Orange', 'Apple', 'Mango', 'Kiwi', 'Lemon', 'Pineapple']

11.pop() 删除最后一个

定义：pop() 方法用于删除数组的最后一个元素并返回删除的元素。
注意：此方法改变数组的长度！

语法：array.pop()

实例：

const sites = ['Google', 'Runoob', 'Taobao', 'Zhihu', 'Baidu'];
console.log(sites.pop()); //返回 'Baidu'
consol.log(sites ) //返回 ['Google', 'Runoob', 'Taobao', 'Zhihu']

12.unshift() 开头添加

定义：unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。
注意： 该方法将改变数组的数目。

语法：array.unshift(item1,item2, …, itemX)

参数	描述
item1,item2, …, itemX	可选。向数组起始位置添加一个或者多个元素。

实例：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.unshift("Lemon","Pineapple"); //返回 ["Lemon","Pineapple","Banana", "Orange", "Apple", "Mango"]

13.shif() 删除第一个

定义：shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。
注意： 此方法改变数组的长度！

语法：array.shift()

实例：

var fruits = ["Banana", "Orange", "Apple", "Mango"];
let a=fruits.shift()
console.log(a) // 返回 "Banana"
console.log(fruits) //返回 ['Orange', 'Apple', 'Mango']

14.forEach() 遍历

定义：forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。
注意: forEach() 对于空数组是不会执行回调函数的。

语法：array.forEach(callbackFn(currentValue, index, arr), thisValue)

其它语法形式：

// 箭头函数
forEach((element) => { /* … */ })
forEach((element, index) => { /* … */ })
forEach((element, index, array) => { /* … */ })

// 回调函数
forEach(callbackFn)
forEach(callbackFn, thisArg)

// 内联回调函数
forEach(function(element) { /* … */ })
forEach(function(element, index) { /* … */ })
forEach(function(element, index, array){ /* … */ })
forEach(function(element, index, array) { /* … */ }, thisArg)

参数	描述
callbackFn(currentValue, index, arr)	必须。 数组中每个元素需要调用的函数。函数参数:currentValue：必须,当前元素。 index: 可选,当前元素的索引值。arr:可选,当前元素所属的数组对象。
thisValue	可选。传递给函数的值一般用 “this” 值。如果这个参数为空， “undefined” 会传递给 “this” 值

实例：

var arr = [1, 2, 3, 4, 5];
arr.forEach((item,index)=>{
console.log(item) //依次返回 1 2 3 4 5 
console.log(index) //依次返回 0 1 2 3 4  返回的下标
});

var names = [{name:'Allan'},{name:'Jack'},{name:'Lili'},{name:'Rose'}];
names.forEach((item,index,arr)=>{
console.log(item) //依次返回 {name: 'Allan'}  {name: 'Jack'} {name: 'Lili'} {name: 'Rose'}
console.log(names[index].name) //依次返回  Allan Jack Lili Rose 
console.log(index) //依次返回 0 1 2 3 返回的下标
console.log(arr) //  返回四次[{name:'Allan'},{name:'Jack'},{name:'Lili'},{name:'Rose'}]
   })
  

<!DOCTYPE html>
<head>
    <meta charset="UTF-8" />
    <title></title>
</head>
<body>
    <button onclick="numbers.forEach(myFunction)">点我</button>
    <p>数组元素总和：<span id="demo"></span></p>
    <script>
          var sum = 0;
        var numbers = [65, 44, 12, 4];
        function myFunction(item) {
            sum += item;
            demo.innerHTML = sum;
        }
    </script>
</body>

15.filter() 符合条件的过滤

定义：filter() 方法创建一个新的数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。
注意： filter() 不会对空数组进行检测。
注意： filter() 不会改变原始数组。

语法：array.filter(function(currentValue,index,arr), thisValue)

参数	描述
function(currentValue, index,arr)	必须。函数，数组中的每个元素都会执行这个函数。函数参数: currentValue：必须，当前元素的值。index：可选，当前元素的索引值。arr：可选，当前元素属于的数组对象 。
thisValue	可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。如果省略了 thisValue ，“this” 的值为 “undefined”

实例：

var ages=[32, 33, 12, 40]
var a=ages.filter((item,index,arr)=>{
return item > 18 //大于18的才返回
})
console.log(a) //返回 [32, 33, 40]

var fruits =["Banana", "Orange", "Apple", "Mango"]
var a2=fruits.filter((item,index,arr)=>{
//return item.includes("Orange")
return item.indexOf("Orange")>-1 
})
console.log(a2) //返回 ['Orange']

16.reduce() 累加

定义：reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。 reduce()
可以作为一个高阶函数，用于函数的 compose。
注意: reduce() 对于空数组是不会执行回调函数的。

语法：array.reduce(function(total, currentValue, currentIndex, arr),initialValue)

参数	描述
function(total,currentValue, index,arr)	必须。用于执行每个数组元素的函数。函数参数: total：必须,初始值, 或者计算结束后的返回值。currentValue:必须,当前元素。currentIndex ：可选，当前元素的索引。arr：可选,传递给函数的初始值
initialValue	可选,传递给函数的初始值

实例：

var numbers = [1,2,3,4,5,6,7,8,9,10];
let allsum = numbers .reduce((total,item)=>{
    return total+= item
},100)
console.log(allsum)//155

let string = 'a-b-c-d'
let arr = string.split('-')//[a,b,c,d] 
function getString(all, currentValue, currentIndex, arr) { 
      return all += currentValue
}
let value = arr.reduce(getString) 
console.log(value) // abcd 

17.map() 运算后新的数组

定义：map() 方法返回一个新数组，数组中的元素为原始数组元素调用函数处理后的值。
map() 方法按照原始数组元素顺序依次处理元素。
注意： map() 不会对空数组进行检测。
注意： map() 不会改变原始数组。

语法：array.map(function(currentValue,index,arr), thisValue)

参数	描述
function(currentValue, index,arr)	必须。函数，数组中的每个元素都会执行这个函数。函数参数:currentValue：必须，当前元素的值 。index：可选，当前元素的索引值。arr：可选。当前元素属于的数组对象
thisValue	可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。如果省略了 thisValue，或者传入 null、undefined，那么回调函数的 this 为全局对象。

实例：

var numbers = [65, 44, 12, 4];
var arr=number.map((item,index)=>{
   return item*2
})
console.log(arr) //返回 [130, 88, 24, 8]

18.find() 找到

定义：find() 方法返回通过测试（函数内判断）的数组的第一个元素的值。
find() 方法为数组中的每个元素都调用一次函数执行：
当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素，之后的值不会再调用执行函数。 如果没有符合条件的元素返回undefined 。
注意: find() 对于空数组，函数是不会执行的。
注意: find() 并没有改变数组的原始值。

语法：array.find(function(currentValue, index, arr),thisValue)

参数	描述
function(currentValue, index,arr)	必需。数组每个元素需要执行的函数。函数参数: currentValue：必需，当前元素。index：可选，当前元素的索引值 。arr：可选，当前元素所属的数组对象。
thisValue	可选。 传递给函数的值一般用 “this” 值。如果这个参数为空， “undefined” 会传递给 “this” 值

实例：

var ages = [4, 12, 16, 20];
var obj=ages.find((item,index)=>{
return item>18})
var obj2=ages.find((item,index)=>{
return item>20})
console.log(obj) // 返回 20
console.log(obj2) //返回 undefined

19.findeIndex() 找到元素的下标

定义：findIndex() 方法返回传入一个测试条件（函数）符合条件的数组第一个元素位置。
findIndex() 方法为数组中的每个元素都调用一次函数执行：
当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置，之后的值不会再调用执行函数。
如果没有符合条件的元素返回 -1。
注意: findIndex() 对于空数组，函数是不会执行的。
注意: findIndex() 并没有改变数组的原始值。

语法：array.findIndex(function(currentValue, index, arr), thisValue)

参数	描述
function(currentValue, index,arr)	必需。数组每个元素需要执行的函数。函数参数: currentValue：必需，当前元素。index：可选，当前元素的索引值 。arr：可选，当前元素所属的数组对象。
thisValue	可选。 传递给函数的值一般用 “this” 值。如果这个参数为空， “undefined” 会传递给 “this” 值

实例：

var ages = [4, 12, 16, 20];
var obj=ages.findIndex((item,index)=>{
return item>=12})
console.log(obj) //返回下标 1

20.some() 一真必真

定义：some() 方法用于检测数组中的元素是否满足指定条件（函数提供）。
some() 方法会依次执行数组的每个元素：
如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测。 如果没有满足条件的元素，则返回false。
注意：some() 不会对空数组进行检测。
注意： some() 不会改变原始数组。

语法：array.some(function(currentValue,index,arr),thisValue)

参数	描述
function(currentValue, index,arr)	必须，函数，数组中的每个元素都会执行这个函数。函数参数: currentValue：必需，当前元素。index：可选，当前元素的索引值 。arr：可选，当前元素所属的数组对象。
thisValue	可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。如果省略了 thisValue ，“this” 的值为 “undefined”

实例：

var ages = [4, 12, 16, 20];
var obj=ages.some((item,index)=>{
  return item > 18
})
console.log(obj) //true

20.every() 一假必假

定义：every() 方法用于检测数组所有元素是否都符合指定条件（通过函数提供）。
every() 方法使用指定函数检测数组中的所有元素：
如果数组中检测到有一个元素不满足，则整个表达式返回 false ，且剩余的元素不会再进行检测。如果所有元素都满足条件，则返回 true。
注意：every() 不会对空数组进行检测。
注意： every() 不会改变原始数组。

语法：array.every(function(currentValue,index,arr), thisValue)

参数	描述
function(currentValue, index,arr)	必须，函数，数组中的每个元素都会执行这个函数。函数参数: currentValue：必需，当前元素。index：可选，当前元素的索引值 。arr：可选，当前元素所属的数组对象。
thisValue	可选。对象作为该执行回调时使用，传递给函数，用作 “this” 的值。如果省略了 thisValue ，“this” 的值为 “undefined”

实例：

var ages = [4, 12, 16, 20];
var obj=ages.every((item,index)=>{
  return item > 18
})
console.log(obj) //false

21.from()

定义：from() 方法用于通过拥有 length 属性的对象或可迭代的对象来返回一个数组。如果对象是数组返回 true，否则返回false。

语法：Array.from(object, mapFunction, thisValue)

参数	描述
object	必需，要转换为数组的对象。
mapFunction	可选，数组中每个元素要调用的函数。
thisValue	可选，映射函数(mapFunction)中的 this 对象。

实例：

var setObj = ["a", "b", "c"];
var objArr = Array.from(setObj);
objArr[1] == "b";  // true

var arr = Array.from([1, 2, 3], x => x * 10);
console.log(arr) //返回 [10, 20, 30]

四、Date 对象

定义：Date 对象用于处理日期与时间。

1.创建Date对象

var d = new Date();  
console.log(d) //返回当前时间  如：Wed Mar 29 2023 10:44:47 GMT+0800 (中国标准时间) 

//7个数字分别指定年、月、日、小时、分钟、秒和毫秒（按此顺序）
//JavaScript 从 0 到 11 计算月份,一月是 0。十二月是11
var d2 = new Date(2018, 11, 24, 10, 33, 30, 0);
console.log(d2) //返回 Mon Dec 24 2018 10:33:30 GMT+0800 (中国标准时间)

//6个数字指定年、月、日、小时、分钟、秒
var d = new Date(2018, 11, 24, 10, 33, 30); //返回 Mon Dec 24 2018 10:33:30 GMT+0800 (中国标准时间)

//5个数字指定年、月、日、小时和分钟
var d = new Date(2018, 11, 24, 10, 33);//返回 Mon Dec 24 2018 10:33:00 GMT+0800 (中国标准时间)

//4个数字指定年、月、日和小时
var d = new Date(2018, 11, 24, 10); //返回 Mon Dec 24 2018 10:00:00 GMT+0800 (中国标准时间)

//3 个数字指定年、月和日
var d = new Date(2018, 11, 24);//返回 Mon Dec 24 2018 00:00:00 GMT+0800 (中国标准时间)

//2个数字指定年份和月份
var d = new Date(2018, 11); //返回 Sat Dec 01 2018 00:00:00 GMT+0800 (中国标准时间)

//不能省略月份。如果只提供一个参数，则将其视为毫秒。
var d = new Date(2018); //返回 Thu Jan 01 1970 08:00:02 GMT+0800 (中国标准时间)

//一位和两位数年份将被解释为 19xx 年：
var d = new Date(99, 11, 24); //返回 Fri Dec 24 1999 00:00:00 GMT+0800 (中国标准时间)
var d2= new Date(9, 12, 25); // 返回 Tue Jan 25 1910 00:00:00 GMT+0800 (中国标准时间)

// 从日期字符串创建一个新的日期对象 
var d = new Date("December 25, 2019 12:46:00"); //返回  Wed Dec 25 2019 12:46:00 GMT+0800 (中国标准时间)

2.日期获取方式（常用）

方法	描述
getDate()	以数值返回天（1-31）
getDay()	以数值获取周名（0-6），0为周日，6为周六
getFullYear())	获取四位的年（yyyy）
getHours()	获取小时（0-23）
getMilliseconds()	获取毫秒（0-999）
getMinutes()	获取分（0-59）
getMonth()	获取月（0-11），0为一月，11为12月
getSeconds()	获取秒（0-59）
getTime()	获取时间（从 1970 年 1 月 1 日至今）

实例：

var data = new Date()
var year = data.getFullYear()
var month = data.getMonth() + 1
var date = data.getDate()
var hours = data.getHours()
var minutes = data.getMinutes()
var seconds = data.getSeconds()
var milliseconds = data. getMilliseconds()
var day = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]
var list = year + '-' + month + '-' + date + ' ' + hours + ':' + minutes + ':' + seconds + ':' + milliseconds + ' ' + day[data.getDay()]
console.log(list); //返回当前的日期  如：2023-3-29 14:38:42:553 星期三

下面做一个钟表实例：

<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title></title>
<script>
function startTime(){
	var today=new Date();
	var h=today.getHours();
	var m=today.getMinutes();
	var s=today.getSeconds();// 在小于10的数字前加一个‘0’
	m=checkTime(m);
	s=checkTime(s);
	document.getElementById('txt').innerHTML=h+":"+m+":"+s;
	t=setTimeout(function(){startTime()},500);
}
function checkTime(i){
	if (i<10){
	    //补零
		i="0" + i;
	}
	return i;
}
</script>
</head>
<body onload="startTime()">
<div id="txt"></div>
</body>

3.日期设置方法（常用）

使用“设置日期”方法可以设置日期对象的日期值（年、月、日、小时、分钟、秒、毫秒）。

方法	描述
setDate()	以数值（1-31）设置日
setFullYear()	设置年（可选月和日）
setHours()	设置小时（0-23）
setMilliseconds()	设置毫秒（0-999）
setMinutes()	设置分（0-59）
setMonth()	设置月（0-11）
setSeconds()	设置秒（0-59）
setTime()	设置时间（从 1970 年 1 月 1 日至今的毫秒数）

实例：

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
var today, someday, text;
today = new Date();
someday = new Date();
someday.setFullYear(2100, 0, 15);
if (someday > today) {
  text = "今天在 2100 年 1 月 15 日之前。";
} else {
  text = "今天在 2100 年 1 月 15 日之后。";
}
document.getElementById("demo").innerHTML = text;
</script>
</body>
</html>

五、Math（算数） 对象

Math 对象允许您执行数学任务。
Math 不是构造函数。Math 的所有属性/方法都可以通过使用 Math 作为对象来调用，而无需创建它。

方法	描述
max(x,y,z,…,n)	返回最高值。如果没有给出参数，则返回 -Infinity。如果一个或多个参数不是数字，则返回 NaN。
min(x,y,z,…,n)	返回最小的值。如果没有给出参数，则返回 -Infinity。如果一个或多个参数不是数字，则返回 NaN。
floor(x)	对 x 进行下舍入。
ceil(x)	对 x 进行上舍入。
abs(x)	返回 x 的绝对值。
round(x)	四舍五入。
sin(x)	返回数的正弦。
random()	返回 0 ~ 1 之间的随机数
abs(x)	返回 x 的绝对值。

var x=Math.PI //返回 3.141592653589793
var max=Math.max(0, 150, 30, 20, 38) //返回 150 
var min=Math.min(0, 150, 30, 20, 38) //返回 0
var num=Math.floor(2.7) //返回 2
var num2=Math.ceil(6.4) //返回 7
var num3=Math.abs(-4.7) //返回 4.7
var num4= Math.round(2.49) //返回 2
var num5= Math.sin(3) //返回 0.1411200080598672
var num6= Math.random() //返回0 ~ 1 之间的随机数
var nm7=Math.floor((Math.random() * 100) + 1); //返回 1~100之间的随机整数