一、JS简介:
1.1.JS起源
Javascript是一种由Netscape(网景)的Livescript发展而来的原型化继承的面向对象的动态类型的区分大小写的客户端脚本语言，主要目的是为了解决服务器端语言遗留的速度问题，为客户提供更流畅的浏览效果。当时服务端需要对数据进行验证，由于网络速度相当缓慢,只有28.8kbps，验证步骤浪费的时间太多。于是Netscape的浏览器Navigator加入了JavaScript，提供了数据验证的基本功能。ECMA-262是正式的JavaScript标准。JavaScript的正式名称是"ECMAScript"，JavaScript的组成包含ECMAScript、DOM、BOM。
1.2.JS特点
JS是一种运行于浏览器端上的小脚本语句,可以实现网页如文本内容动态变化,数据动态变化和动画特效等,JS有如下特点:
(1)脚本语言:
JavaScript是一种解释型的脚本语言。不同于C、C++、Java等语言先编译后执行，JavaScript不会产生编译出来的字节码文件，而是在程序的运行过程中对源文件逐行进行解释并运行。
(2)基于对象:
JavaScript是一种基于对象的脚本语言，它不仅可以创建对象，也能使用现有的对象。但是在面向对象的三大特性封装、继承、多态中，JavaScript能够实现封装，可以模拟继承，不支持多态，所以它不是一门面向对象的编程语言。
(3)弱类型:
JavaScript中也有明确的数据类型，但是声明一个变量后它可以接收任何类型的数据，并且会在程序执行过程中根据上下文自动转换该变量对应的数据类型。
(4)事件驱动:
JavaScript是一种采用事件驱动的脚本语言，它不需要经过Web服务器就可以对用户的输入做出具体的响应;
(5)跨平台性:
JavaScript脚本语言不依赖于操作系统，仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用，使用的前提是机器上的浏览器支持JavaScript脚本语言。目前JavaScript已被大多数的浏览器所支持。
1.3.JS的引入方式:
(1).内部脚本方式引入
在页面中通过一对<script></script>标签引入JS代码,script代码放置位置具备一定的随意性,一般放在head标签中居多。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>小标题</title>
<script>
function suprise(){
//弹窗提示
alert("Hello,我是惊喜")
}
</script>
</head>
<body>
<button onclick = "suprise()">点我有惊喜</button>
</body>
</html>
(2)外部脚本方式引入:
内部脚本只能在当前页面上使用，代码复用度不高。可以将脚本放在独立的js文件中，通过<script>标签引入外部脚本文件。一对<script>标签要么用于定义内部脚本，要么用于引入外部js文件，不能混用。一个html文档中可以拥有多个script标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>小标题</title>
<script src="Js/button.js" type="text/Javascript"></script>
</head>
<body>
<button onclick="suprise()">点我有惊喜</button>
</body>
</html>
二、JS的数据类型和运算符:
2.1.JS的数据类型:
(1)数值类型:数值类型统一为number,不区分整数和浮点数
(2)字符串类型:字符串类型为string，和Java中的string相似。JS中不严格区分单双引号,都可以用于表示字符串
(3)布尔类型:布尔类型为boolean,和Java中的boolean相似;但是在JS的if语句中,非空字符串会被转换为'真'，非零数字也会被认为是'真';
(4)引用数据类型:引用数据类型对象是Object类型,各种对象和数组在JS中都是Object类型
(5)function类型:JS中的各种函数属于function数据类型
(6)命名未赋值:js为弱类型语言,统一使用var声明对象和变量,在赋值时才确定真正的数据类型,变量如果只声明没有赋值的话其对应的数据类型为undefined;
(7)赋予NULL值:在JS中如果给一个变量赋值为null，其数据类型为Object，可以通过typeof关键字判断其数据类型
2.2.JS中使用var声明变量的特点:
(1)弱类型变量,可以统一声明成var
(2)var声明的变量可以再次声明
(3)变量可以使用不同的数据类型多次赋值
(4)JS的语句可以以';'结尾,也可以不用';'结尾
(5)变量标识符严格区分大小写
(6)标识符的命名规则参照JAVA
(7)如果使用了一个没有声明的变量,那么运行时会报uncaught ReferenceError
(8)如果一个变量只声明,没赋值,那么值是undefined
2.3.JS的运算符:
(1)算数运算符:+ - * / %
其中需要注意的是 / 和 %:
a./在除以0时，结果是Infinity，而不是报错；
b.%在模0时，结果是NaN，意思为not a number ，而不是报错；
(2)复合算数运算符:%= /= *= -= += -- ++
复合算数运算基本和JAVA一致,需要注意的同样是/=和%=:
a./=在除以0时，结果是Infinity，而不是报错；
b.%=在模0时，结果是NaN，意思为not a number ，而不是报错；
(3)关系运算符:> < >= <= == === !=
a.==符号如果两端的数据类型不一致，会尝试将两端的数据转换成number，再对比number大小;
b.===符号如果两端数据类型不一致，直接返回false，数据类型一致再比较是否相同。
(4)逻辑运算符:|| &&
几乎和JAVA中的一样，需要注意的是，这里直接就是短路的逻辑运算符，单个的|和&以及^是位运算符
(5)条件运算符: 条件?值1:值2
(6)位运算符:| & ^ << >> >>>
三、JS的流程控制和函数:
3.1.分支结构:
(1)if结构:
这里的if结构几乎和JAVA中的一样,需要注意的是if()中的非空字符串会被认为是true;if()中的非零数字会被认为是true;if()中的非空对象也会被认为为true
var month = 10;
if(month==12||month==1||month==2){
console.log("冬天")
}else if(month>=3&&month<=5){
console.log("春天")
}else if(month>=6&&month<=8){
console.log("夏天")
}else{
console.log("秋天")
}(2)switch结构:同Java中的switch-case结构
var monthStr = prompt("请输入月份")
var month = Number.parseInt(monthStr)
switch(month){
case 3:
case 4:
case 5:
console.log("春季");
break;
case 6:
case 7:
case 8:
console.log("夏季");
break;
case 9:
case 10:
case 11:
console.log("秋季");
break;
case 12:
case 1:
case 2:
console.log("冬季");
break;
default:
console.log("月份有误");
}
3.2.循环结构:
(1)while结构:
var i=1;
while(i<=9){
var j=1;
while(j<=i){
document.write(j+"*"+i+"="+i*j+" ");
j++;
}
document.write("<hr/>");
i++;
}(2)for结构:
for(var i=1;i<=9;i++){
for(var j=1;j<=i;j++){
document.write(j+"*"+i+"="+i*j+" ");
}
document.write("<hr/>");
}(3)foreach结构:
迭代数组时和java不一样,括号中的临时变量表示的是元素的索引，不是元素的值。()中也不在使用冒号分隔，而是使用in关键字。
var cities =["北京","上海","深圳","武汉","西安","成都"]
document.write("<ul>")
for(var index in cities){
document.write("<li>"+cities[index]+"</li>")
}
document.write("</ul>")3.3.函数声明:
JS中的方法多称为函数，函数的声明语法和JAVA中有较大区别。
(1)函数说明:
a.函数没有权限控制符;
b.不用声明函数的返回值类型，需要返回在函数体中直接return即可，也无需void关键字;
c.参数列表中无需数据类型;
d.调用函数时实参和形参的个数可以不一致;在方法内部通过arguments获得调用时的实际参数
e.声明函数时需要用function关键字;
f.函数没有异常列表;
g.函数可以作为另外一个实参传递给另外一个函数
(2)具体代码:
/*语法1:function 函数名(参数列表){函数体}*/
function sum(a,b){
return a+b;
}
var result =sum(10,20);
console.log(result);
/*语法2: var 函数名 = function(参数列表){函数体} */
var add =function(a,b){
return a+b;
}
var result = add(1,2);
console.log(result);四、JS对象和JSON
4.1.JS声明对象的语法:
(1)方式1:通过new Object()直接创建对象
var person = new Object();
// 给对象添加属性并赋值
person.name = "张小明":
person.age = 10;
person.foods = ["苹果","橘子","香蕉","葡萄"];
// 给对象添加功能函数
person.eat = function(){
console.log(this.age+"岁的"+this.name+"喜欢吃:");
for(var i=0;i<this.foods.length;i++){
console.log(this.foods[i])
}
}
// 获得对象属性值
console.log(person.name)
console.log(person.age)
// 调用对象方法
person.eat()(2)方式2:通过{}形式创建对象
var person = {
"name":"张小明",
"age":10,
"foods":["苹果","香蕉","橘子","葡萄"],
"eat":function(){
console.log(this.age+"岁的"+this.name+"喜欢吃:")
for(var i=0;i<this.foods.length;i++){
console.log(this.foods[i]);
}
}
}
// 获得对象属性值
console.log(person.name);
console.log(person.age);
// 调用对象方法
person.eat();4.2.JSON格式:
JSON 就是一种字符串格式，这种格式无论是在前端还是在后端都可以很容易地和对象之间进行转换，所以常用于前后端数据传递;
JSON的语法:var str="{'属性名':属性值,'属性名':{'属性名':属性值,'属性名':['值1','值1','值3']}";
JSON字符串一般用于传递数据,一般都是用对象的属性表示数据，所以在此不研究对象的函数只看对象的属性;通过JSON.parse()方法可以将一个JSON串转换成对象;通过JSON.stringify()方法可以将一个对象转换成一个JSON格式的字符串;
/*定义一个JSON串 */
var personStr ='{"name":"张小明","age":20,"girlFriend":{"name":"铁铃","age":23},"foods":["苹果","香蕉”,"橘子","葡萄"],"pets":[{"petName":"大黄","petType":"dog"},{"petName":"小花","petType":"cat"}]}';
console.log(personStr);
console.log(typeof personStr);
/*将一个JSON串转换为对象 */
var person =JSON.parse(personStr);
console.log(person);
console.log(typeof person);
/*获取对象属性值 */
console.log(person.name);
console.log(person.age);
console.log(person.girlFriend.name);
console.log(person.foods[1]);
console.log(person.pets[1].petName);
console.log(person.pets[1].petType);/* 定义一个对象 */
var person = {
'name':'张小明',
'age':20,
'girlFriend':{
'name':'铁铃'
'age':23
},
'foods':['苹果','香蕉''橘子'],
'pets':[
{
'petName':'大黄',
'petTpye':'dog'
},
{
'petName':'小花',
'petTpye':'cat'
},
]
}
/*获取对象属性值 */
console.log(person.name)
console.log(person.age)
console.log(person.girlFriend.name)
console.log(person.foods[1])
console.log(person.pets[1].petName)
console.log(person.pets[1].petType)
/*将对象转换成JSON字符串 */
var personStr = JSON.stringify(person)
console.log(personStr)
console.log(typeof personStr)
4.3.JS常见对象:
(1)数组:Array对象用于在变量中存储多个值，第一个数组元素的索引值为0，第二个索引值为1，以此类推。
创建数组的四种方式:
var array = new Array();// 创建空数组
var array = new Array(int size);// 创建数组时指定长度
var array = new Array(ele1,ele2,...,eleN);// 创建数组时指定元素值
var array = [ele1,ele2,...,eleN];// 相当于第三种方法的简写
数组属性:
constructor:返回创建数组对象的原型函数;
length:设置或返回数组元素的个数;
prototype:允许向数组对象添加属性或方法;数组常见API:JavaScript Array 对象 | 菜鸟教程
1.concat(array2, array3,..., arrayX)
(1)函数功能:
连接两个或更多的数组,并返回结果;
(2)参数:
array2, array3,..., arrayX表示需要连接的数组
(3)返回值:
一个Array对象,是通过把所有arrayX参数添加到arrayObject中生成的,如果进行concat()操作的参数是数组那么添加的是数组中的元素而不是数组
2.copyWithin(target, start, end)
(1)函数功能:从数组的指定位置拷贝元素到该数组的另一个指定位置中;
(2)参数:
target:必需,复制到指定目标索引位置
start:可选,元素复制的起始位置
end:可选,停止复制的索引位置(默认为array.length),如果为负值表示倒数
(3)返回值:
一个Array对象
3.entries()
(1)函数功能:
返回数组的可迭代对象;该对象包含数组的键值对(key/value);迭代对象中数组的索引值作为key,数组元素作为value;
(2)参数:
无参数
(3)返回值:
数组迭代对象
4.every(function(currentValue,index,arr), thisValue)
(1)函数功能:
检测数值元素的每个元素是否都符合条件;
如果数组中检测到有一个元素不满足则整个表达式返回false且剩余的元素不会再进行检测;
如果所有元素都满足条件则返回true;
every()不会对空数组进行检测以及不会改变原始数组;
(2)参数:
function(currentValue, index,arr):必须,函数,数组中的每个元素都会执行这个函数
currentValue:必须,当前元素的值
index:可选,当前元素的索引值
arr:可选,当前元素属于的数组对象
thisValue:可选,对象作为该执行回调时使用,传递给函数,用作"this"的值;
如果省略了thisValue,则"this"的值为"undefined";
(3)返回值:
布尔值,如果所有元素都通过检测返回true,否则返回false
5.fill(value, start, end)
(1)函数功能:
使用一个固定值来填充数组;
(2)函数参数:
value:必需,填充的值;
start:可选,开始填充位置;
end:可选,停止填充位置(默认为array.length);
(3)返回值:
数组
6.filter(function(currentValue,index,arr), thisValue)
(1)函数功能:
检测数值元素,并返回符合条件所有元素的数组;
该方法会创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素;
不会对空数组进行检测以及不会改变原始数组;
(2)函数参数:
function(currentValue, index,arr):必须,函数,数组中的每个元素都会执行这个函数
currentValue:必须,当前元素的值;
index:可选,当前元素的索引值;
arr:可选,当前元素属于的数组对象;
(3)返回值:
返回数组,包含了符合条件的所有元素,如果没有符合条件的元素则返回空数组
7.find(function(currentValue,index,arr), thisValue)
(1)函数功能:
返回符合传入测试(函数)条件的数组元素;
为数组中的每个元素都调用一次函数执行;
当数组中的元素在测试条件时返回true时,返回符合条件的元素,之后的值不会再调用执行函数
如果没有符合条件的元素返回undefined
对于空数组函数是不会执行的,并没有改变数组的原始值
(2)函数参数:
function(currentValue, index,arr):必须,函数,数组中的每个元素都会执行这个函数
currentValue:必须,当前元素的值;
index:可选,当前元素的索引值;
arr:可选,当前元素属于的数组对象;
(3)返回值:
返回符合测试条件的第一个数组元素值,如果没有符合条件的则返回undefined
8.findIndex(function(currentValue, index, arr), thisValue)
(1)函数功能:
返回数组中第一个符合传入测试(函数)条件的数组元素索引;
为数组中的每个元素都调用一次函数执行
当数组中的元素在测试条件时返回true时返回符合条件的元素的索引位置,之后的值不会再调用执行函数
如果没有符合条件的元素返回-1;
对于空数组函数是不会执行的;并没有改变数组的原始值
(2)参数说明:
function(currentValue, index,arr):必须,函数,数组中的每个元素都会执行这个函数
currentValue:必须,当前元素的值;
index:可选,当前元素的索引值;
arr:可选,当前元素属于的数组对象;
(3)返回值:
返回符合测试条件的第一个数组元素索引,如果没有符合条件的则返回-1;
9.forEach(callbackFn(currentValue, index, arr), thisValue)
(1)函数说明:
数组每个元素都执行一次回调函数;
用于调用数组的每个元素并将元素传递给回调函数;
对于空数组是不会执行回调函数的
(2)参数说明:
callbackFn(currentValue, index, arr):必需,数组中每个元素需要调用的函数
currentValue:必需,当前元素
index:可选,当前元素的索引值
arr:可选,当前元素所属的数组对象
thisValue:可选,传递给函数的值一般用"this"值,如果这个参数为空"undefined"会传递给"this"值
(3)返回值:
undifined
10.from(object, mapFunction, thisValue)
(1)函数说明:
通过给定的对象中创建一个数组;
用于通过拥有length属性的对象或可迭代的对象来返回一个数组;
如果对象是数组返回true否则返回false
(2)参数说明:
object:必需,要转换为数组的对象
mapFunction:可选,数组中每个元素要调用的函数;
thisValue:可选,映射函数(mapFunction)中的this对象
(3)返回值:
数组对象
11.includes(searchElement, fromIndex)
(1)函数功能:
判断一个数组是否包含一个指定的值;如果是返回true否则false
(2)函数参数:
searchElement:必须,需要查找的元素值
fromIndex:可选,从该索引处开始查找searchElement;
如果为负值则按升序从array.length + fromIndex的索引开始搜索,默认为0;
如果fromIndex大于等于数组长度则返回false,该数组不会被搜索
如果fromIndex为负值,计算出的索引将作为开始搜索searchElement的位置,如果计算出的索引小于0则整个数组都会被搜索
(3)函数返回值:
布尔值,如果找到指定值返回true否则返回false
12.indexOf(item,start)
(1)函数功能:
搜索数组中的元素,并返回它所在的位置;
该方法将从头到尾地检索数组,看是否含有对应的元素;
开始检索的位置在数组start处或数组的开头(没有指定start参数时),如果找到一个item则返回item的第一次出现的位置,开始位置的索引为0;如果在数组中没找到指定元素则返回-1
(2)函数参数:
item:必须,表示待查找的元素;
start:可选的整数参数,规定在数组中开始检索的位置,它的合法取值是0到stringObject.length - 1,如省略该参数则将从字符串的首字符开始检索
(3)函数返回值:
元素在数组中的位置,如果没有搜索到则返回-1
13.isArray()
(1)函数功能:
判断对象是否为数组;
如果对象是数组返回true否则返回false
(2)参数说明:
obj:必需,代表要判断的对象
(3)返回值:
布尔值,如果对象是数组返回true,否则返回false
14.join(separator)
(1)函数功能:
把数组的所有元素放入一个字符串;
用于把数组中的所有元素转换一个字符串,
元素是通过指定的分隔符进行分隔的
(2)参数说明:
separator:可选,指定要使用的分隔符,如果省略该参数则使用逗号作为分隔符
(3)函数返回值:
String:返回一个字符串,该字符串是通过把arrayObject的每个元素转换为字符串,然后把这些字符串连接起来,在两个元素之间插入separator字符串而生成的
15.keys()
(1)函数功能:
返回数组的可迭代对象,包含原始数组的键(key);
用于从数组创建一个包含数组键的可迭代对象;
如果对象是数组返回true,否则返回false;
(2)函数参数:
没有参数
(3)函数返回值:
一个数组可迭代对象
16.lastIndexOf(item,start)
(1)函数功能:
搜索数组中的元素,并返回它最后出现的位置;
如果要检索的元素没有出现,则该方法返回-1;
该方法将从尾到头地检索数组中指定元素item,开始检索的位置在数组的start处或数组的结尾(没有指定 start参数时),如果找到一个item则返回item从尾向前检索第一个次出现在数组的位置,数组的索引开始位置是从0开始的;
(2)参数说明:
item:必需,规定需检索的字符串值;
start:可选的整数参数,规定在字符串中开始检索的位置,它的合法取值是0到stringObject.length-1,如省略该参数,则将从字符串的最后一个字符处开始检索
(3)函数返回值:
Number:如果在stringObject中的fromindex位置之前存在searchvalue,则返回的是出现的最后一个searchvalue的位置
17.map(function(currentValue,index,arr), thisValue)
(1)函数功能:
通过指定函数处理数组的每个元素,并返回处理后的数组;
返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值;
按照原始数组元素顺序依次处理元素;
不会对空数组进行检测以及不会改变原始数组
(2)函数参数:
function(currentValue, index,arr):必须,函数,数组中的每个元素都会执行这个函数
currentValue:必须,当前元素的值;
index:可选,当前元素的索引值;
arr:可选,当前元素属于的数组对象;
thisValue:可选,对象作为该执行回调时使用,传递给函数,用作"this"的值,如果省略了thisValue或者传入 null、undefined,那么回调函数的this为全局对象
(3)函数返回值:
返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值
18.pop()
(1)函数功能:
删除数组的最后一个元素并返回删除的元素;此方法会改变数组的长度
(2)参数说明:
无参数
(3)函数返回值:
返回删除的元素
19.push(item1, item2, ..., itemX)
(1)函数功能:
向数组的末尾添加一个或更多元素,并返回新的长度;
新元素将添加在数组的末尾;此方法会改变数组的长度;
(2)参数说明:
item1, item2, ..., itemX:必需,表示要添加到数组的元素
(3)函数返回值:
插入元素后数组的新长度
20.reduce(function(total, currentValue, currentIndex, arr), initialValue)
(1).函数功能:
将数组元素计算为一个值(从左到右);
接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值
可以作为一个高阶函数用于函数的compose
对于空数组是不会执行回调函数的
(2).参数说明:
function(total,currentValue, index,arr):必需,用于执行每个数组元素的函数
total:必需,初始值,或者计算结束后的返回值;
currentValue:必需,当前元素;
currentIndex:可选,当前元素的索引;
initialValue:可选,传递给函数的初始值
(3).函数返回值:
返回计算结果
21.reduceRight(function(total, currentValue, currentIndex, arr), initialValue)
(1).函数说明:
将数组元素计算为一个值(从右到左);
功能和reduce()是一样的,不同的是reduceRight()从数组的末尾向前将数组中的数组项做累加
对于空数组是不会执行回调函数的
(2).函数参数:
function(total,currentValue, index,arr):必需,用于执行每个数组元素的函数
total:必需,初始值,或者计算结束后的返回值;
currentValue:必需,当前元素;
currentIndex:可选,当前元素的索引;
initialValue:可选,传递给函数的初始值;
(3).函数返回值:
返回计算结果
22.reverse()
(1).函数功能:
反转数组的元素顺序;
(2)函数参数:
无参数
(3).函数返回值:
颠倒顺序后的数组
23.shift()
(1).函数功能:
删除并返回数组的第一个元素;
用于把数组的第一个元素从其中删除,并返回第一个元素的值
(2).函数参数:
无参数
(3).函数返回值:
数组原来的第一个元素的值
26.slice(start, end)
(1).函数功能:
选取数组的一部分并返回一个新数组;
可从已有的数组中返回选定的元素,
可提取字符串的某个部分并以新的字符串返回被提取的部分
不会改变原始数组
(2).函数参数:
start:可选,规定从何处开始选取;
如果该参数为负数则表示从原数组中的倒数第几个元素开始提取,slice(-2)表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素);
end:可选,规定从何处结束选取;该参数是数组片断结束处的数组下标,如果没有指定该参数那么切分的数组包含从start到数组结束的所有元素,如果该参数为负数则它表示在原数组中的倒数第几个元素结束抽取;
slice(-2,-1)表示抽取了原数组中的倒数第二个元素到最后一个元素(不包含最后一个元素,也就是只有倒数第二个元素)
(3).函数返回值:
返回一个新的数组,包含从start(包括该元素)到end(不包括该元素)的arrayObject中的元素
27.some(function(currentValue,index,arr),thisValue)
(1).函数功能:
检测数组元素中是否有元素符合指定条件;
检测数组中的元素是否满足指定条件(函数提供);
会依次执行数组的每个元素,如果有一个元素满足条件则表达式返回true,剩余的元素不会再执行检测;如果没有满足条件的元素则返回false
不会对空数组进行检测以及不会改变原始数组
(2).函数参数:
currentValue:必须,当前元素的值;
index:可选,当前元素的索引值;
arr:可选,当前元素属于的数组对象;
thisValue:可选,对象作为该执行回调时使用,传递给函数,用作"this"的值,如果省略了thisValue或者传入 null、undefined,那么回调函数的this为全局对象
(3).函数返回值:
布尔值,如果数组中有元素满足条件返回true,否则返回false
28.sort(sortfunction)
(1).函数功能:
对数组的元素进行排序;
排序顺序可以是字母或数字,并按升序或降序;
默认排序顺序为按字母升序;
当数字是按字母顺序排列时"40"将排在"5"前面;
使用数字排序必须通过一个函数作为参数来调用;
通过函数指定数字是按照升序还是降序排列;
该方法会改变原始数组
(2).函数参数:
sortfunction:可选,规定排序顺序,必须是函数
(3).函数返回值:
对数组的引用,请注意:数组在原数组上进行排序,不生成副本
29.splice(index,howmany,item1,.....,itemX):
(1).函数功能:
从数组中添加或删除元素;
该方法会改变原始数组
(2).参数说明:
index:必需,规定从何处添加/删除元素;该参数是开始插入和(或)删除的数组元素的下标,必须是数字;
howmany:可选,规定应该删除多少元素,必须是数字但可以是"0";如果未规定此参数则删除从index开始到原数组结尾的所有元素;
item1, ..., itemX:可选,要添加到数组的新元素
(3).函数返回值:
如果从arrayObject中删除了元素则返回的是含有被删除的元素的数组
30.toString()
(1).函数功能:
把数组转换为字符串,并返回结果;数组中的元素之间用逗号分隔;
(2).函数参数:
无参数
(3).函数返回值:
数组的所有值用逗号隔开组成的字符串
31.unshift(item1,item2, ..., itemX)
(1).函数功能:
向数组的开头添加一个或更多元素,并返回新的长度;该方法将改变数组的数目
(2).参数说明:
item1,item2, ..., itemX:可选,向数组起始位置添加一个或者多个元素
(3).函数返回值:
数组新长度
32.valueOf()
(1).函数功能:
返回数组对象的原始值;
该原始值由Array对象派生的所有对象继承
通常由JavaScript在后台自动调用,并不显式地出现在代码中
该方法不会改变原数组
(2).函数参数:
无参数
(3).函数返回值:
Array,返回的数组值
33.Array.of(element0, element1, /* … ,*/ elementN)
(1).函数功能:
将一组值转换为数组,不考虑参数的数量或类型;
如果对象是数组返回true,否则返回false
(2).函数参数:
element0:必需,表示要转换为数组的元素;
element1, /* … ,*/ elementN:可选,表示要转换为数组的元素;
(3).函数返回值:
数组对象
34.Array.at(index)
(1).函数功能:
用于接收一个整数值并返回该索引对应的元素,允许正数和负数,负整数从数组中的最后一个元素开始倒数;
匹配给定索引的数组中的元素,如果找不到指定的索引则返回undefined
在传递非负数时at()方法等价于括号表示法;
当需要从数组的末端开始倒数时通常的做法是访问length并将其减去从末端开始的相对索引;
而at()方法允许使用相对索引,即可以使用Array.at(-1)
(2).函数参数:
index:要返回的数组元素的索引(位置),当传递负数时支持从数组末端开始的相对索引;也就是说如果使用负数返回的元素将从数组的末端开始倒数
(3).函数返回值:
数组中索引为index的一个元素
35.Array.flat(depth)
(1).函数功能:
创建一个新数组,这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成;
会按照一个可指定的深度递归遍历数组,并将所有元素与遍历到的子数组中的元素合并为一个新数组返回;
返回一个包含将数组与子数组中所有元素的新数组;
会递归地遍历数组,将所有嵌套的数组元素提取出来生成一个新的一维数组
(2).参数说明:
depth:指定要提取嵌套数组的结构深度,默认值为1
(3).函数返回值:
数组
26.Array.flatMap(callback,thisArg)
// 箭头函数
flatMap((currentValue) => { /* … */ } )
flatMap((currentValue, index) => { /* … */ } )
flatMap((currentValue, index, array) => { /* … */ } )
// 回调函数
flatMap(callbackFn)
flatMap(callbackFn, thisArg)
// 行内回调函数
flatMap(function(currentValue) { /* … */ })
flatMap(function(currentValue, index) { /* … */ })
flatMap(function(currentValue, index, array){ /* … */ })
flatMap(function(currentValue, index, array) { /* … */ }, thisArg)
(1).函数功能:
使用映射函数映射每个元素,然后将结果压缩成一个新数组;
首先使用映射函数映射每个元素,然后将结果压缩成一个新数组;它与map连着深度值为1的flat几乎相同,但 flatMap通常在合并成一种方法的效率稍微高一些;
返回值是一个新的数组,其中每个元素都是回调函数的结果并且结构深度depth值为1
(2).函数参数:
callback:可以生成一个新数组中的元素的函数,可以传入三个参数：
currentValue:当前正在数组中处理的元素
index:可选,数组中正在处理的当前元素的索引;
array:可选,表示被调用的map数组;
thisArg:可选的,执行callback函数时使用的this值
(3).函数返回值:
数组(2)Boolean对象:Boolean对象用于转换一个不是Boolean类型的值转换为Boolean类型值 (true或者false)
创建Boolean对象的方式:
var b = new Boolean();
如果布尔对象无初始值或者其值为0,-0,null,"",false,undefined,NaN
那么对象的值为false,否则其值为true
Boolean对象属性:
constructor:返回对创建此对象的Boolean函数的引用
prototype:使有能力向对象添加属性和方法Boolean对象方法:
toString():把布尔值转换为字符串并返回结果;
valueOf():返回Boolean对象的原始值;(3)Date对象:Date对象用于处理日期与时间
创建Date对象的方式:
var d = new Date();
var d = new Date(milliseconds); // 参数为毫秒
var d = new Date(dateString);
var d = new Date(year, month, day, hours, minutes, seconds, milliseconds);
milliseconds参数是一个Unix时间戳,是一个整数值,表示自1970年1月1日00:00:00 UTC以来的毫秒数;
dateString参数表示日期的字符串值;
year,month,day,hours,minutes,seconds,milliseconds分别表示年、月、日、时、分、秒、毫秒;Date对象属性:
constructor:返回对创建此对象的Date函数的引用
prototype:使有能力向对象添加属性和方法Date对象方法:JavaScript Date 对象 | 菜鸟教程
1.getDate()
(1).函数功能:
从Date对象返回一个月中的某一天(1 ~ 31);
(2).函数参数:
无参数
(3).函数返回值:
Number类型,表示dateObject所指的月份中的某一天,使用本地时间;返回值是1 ~ 31之间的一个整数
2.getDay()
(1).函数功能:
从Date对象返回一周中的某一天(0 ~ 6);
(2).函数参数:
无参数
(3).函数返回值:
Number类型,返回值是0(周日)到6(周六)之间的一个整数
3.getFullYear()
(1).函数功能:
从Date对象以四位数字返回年份;
(2).函数参数:
无参数
(3).函数返回值:
Number类型,表示年份的4位数字
4.getHours()
(1).函数功能:
返回Date对象的小时(0 ~ 23);返回时间的小时字段
(2).函数参数:
无参数
(3).函数返回值:
Number类型,返回值是0(午夜)到23(晚上11点)之间的一个整数
5.getMilliSeconds()
(1).函数功能:
返回Date对象的毫秒(0 ~ 999);
(2).函数参数:
无参数
(3).函数返回值:
Number类型,返回值是0 ~ 999之间的一个整数,该数字代表毫秒数
6.getMinutes()
(1).函数功能:
返回Date对象的分钟(0 ~ 59);
(2).函数参数:
无参数
(3).函数返回值:
Number类型,date Object的分钟字段,以本地时间显示;返回值是0 ~ 59之间的一个整数
7.getMonth()
(1).函数功能:
从Date对象返回月份(0 ~ 11);
(2).函数参数:
无参数
(3).函数返回值:
Number类型,返回值是0(一月)到11(十二月)之间的一个整数
8.getSeconds()
(1).函数功能:
返回Date对象的秒数(0 ~ 59);
(2).函数参数:
无参数
(3).函数返回值:
Number类型,返回值是0 ~ 59之间的一个整数
9.getTime()
(1).函数功能:
返回1970年1月1日至今的毫秒数;
(2).函数参数:
无参数
(3).函数返回值:
Number类型,表示指定的日期和时间距1970年1月1日午夜(GMT 时间)之间的毫秒数
10.getTimeZoneOffSet()
(1).函数功能:
返回本地时间与格林威治标准时间(GMT)的分钟差;以分钟为单位
(2).函数参数:
无参数
(3).函数返回值:
Number类型,表示本地时间与GMT时间之间的时间差,以分钟为单位
11.getUTCDate()
(1).函数功能:
根据世界时从Date对象返回月(UTC)中的一天(1 ~ 31);
协调世界时(UTC)是以原子时秒长为基础,在时刻上尽量接近于世界时的一种时间计量系统
协调世界时又称世界统一时间,世界标准时间,国际协调时间,简称UTC
UTC时间即是GMT(格林尼治)时间
(2).函数参数:
无参数
(3).函数返回值:
Number类型,返回该月中的某一天(是 1 ~ 31 中的一个值)
12.getUTCDay()
(1).函数功能:
根据世界时从Date对象返回周中的一天(0 ~ 6);
协调世界时(UTC)是以原子时秒长为基础,在时刻上尽量接近于世界时的一种时间计量系统
协调世界时又称世界统一时间,世界标准时间,国际协调时间,简称UTC
UTC时间即是GMT(格林尼治)时间
(2).函数参数:
无参数
(3).函数返回值:
Number类型,该值是0(星期天)~ 6(星期六)中的一个值
13.getUTCFullYear()
(1).函数功能:
根据世界时从Date对象返回四位数的年份;
使用UTC计算日期方法是根据本地的时间与日期
协调世界时(UTC)是以原子时秒长为基础,在时刻上尽量接近于世界时的一种时间计量系统
协调世界时又称世界统一时间,世界标准时间,国际协调时间,简称UTC
UTC时间即是GMT(格林尼治)时间
(2).函数参数:
无参数
(3).函数返回值:
Number类型,代表年份的四位数字
14.getUTCHours()
(1).函数功能:
根据世界时返回Date对象的小时(0 ~ 23);
协调世界时(UTC)是以原子时秒长为基础,在时刻上尽量接近于世界时的一种时间计量系统
协调世界时又称世界统一时间,世界标准时间,国际协调时间,简称UTC
UTC时间即是GMT(格林尼治)时间
(2).函数参数:
无参数
(3).函数返回值:
Number类型,该值是一个0(午夜)~ 23(晚上 11 点)之间的整数
15.getUTCMilliSeconds()
(1).函数功能:
根据世界时返回Date对象的毫秒(0 ~ 999);
协调世界时(UTC)是以原子时秒长为基础,在时刻上尽量接近于世界时的一种时间计量系统
协调世界时又称世界统一时间,世界标准时间,国际协调时间,简称UTC
UTC时间即是GMT(格林尼治)时间
(2).函数参数:
无参数
(3).函数返回值:
Number类型,该值是一个0 ~ 999之间的整数
16.getUTCMinutes()
(1).函数功能:
根据世界时返回Date对象的分钟(0 ~ 59);
协调世界时(UTC)是以原子时秒长为基础,在时刻上尽量接近于世界时的一种时间计量系统
协调世界时又称世界统一时间,世界标准时间,国际协调时间,简称UTC
UTC时间即是GMT(格林尼治)时间
(2).函数参数:
无参数
(3).函数返回值:
Number类型,该值是一个0 ~ 59之间的整数
17.getUTCMonth()
(1).函数功能:
根据世界时从Date对象返回月份(0 ~ 11);
协调世界时(UTC)是以原子时秒长为基础,在时刻上尽量接近于世界时的一种时间计量系统
协调世界时又称世界统一时间,世界标准时间,国际协调时间,简称UTC
UTC时间即是GMT(格林尼治)时间
(2).函数参数:
无参数
(3).函数返回值:
Number类型,该值是一个0 ~ 11之间的整数
18.getUTCSeconds()
(1).函数功能:
根据世界时返回Date对象的秒钟(0 ~ 59);
(2).函数参数:
无参数
(3).函数返回值:
Number类型,该值是一个0 ~ 59之间的整数
19.parse(datestring)
(1).函数功能:
可解析一个日期时间字符串,返回1970年1月1日午夜到指定日期(字符串)的毫秒数;
(2).函数参数:
datestring:必需,表示日期和时间的字符串
(3).函数返回值:
Number类型,表示指定的日期和时间据1970/1/1午夜(GMT时间)之间的毫秒数
20.setDate(day)
(1).函数功能:
设置Date对象中月的某一天(1 ~ 31);
(2).函数参数:
day:必需,表示一个月中的一天的一个数值(1 ~ 31);
day=0为上一个月的最后一天;day=-1为上一个月最后一天之前的一天
如果当月有31天day=32为下个月的第一天
如果当月有30天day=32为下一个月的第二天
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
21.setFullYear(year,month,day)
(1).函数功能:
设置Date对象中的年份(四位数字);
可用于设置月份及月份中的一天
(2).函数参数:
year:必需,表示年份的四位整数,用本地时间表示
month:可选,表示月份的数值;用本地时间表示
month介于0到11之间的整数值表示从一月到十二月
month = -1为去年的最后一个月
month = 12为明年的第一个月
month = 13为明年的第二个月
day:可选,表示一个月中的一天的一个数值(1 ~ 31);
day=0为上一个月的最后一天;day=-1为上一个月最后一天之前的一天
如果当月有31天day=32为下个月的第一天
如果当月有30天day=32为下一个月的第二天
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
22.setHours(hour,min,sec,millisec)
(1).函数功能:
设置Date对象中的小时(0 ~ 23);
该方法可用于设置分钟,秒以及毫秒数
(2).函数参数:
hour:必需,表示小时的数值,介于0(午夜)~23(晚上11点)之间,以本地时间计
hour = -1为昨天的最后一小时
hour = 24为明天的第一小时
min:可选,表示分钟的数值,介于0 ~ 59之间
min = -1为上一小时的最后一分钟
min = 60为下一小时的第一分钟
sec:可选,表示秒的数值,介于0 ~ 59之间
sec = -1为上一分钟的最后一秒
sec = 60为下一分钟的第一秒钟
millisec:可选,表示毫秒的数值,介于0 ~ 999之间
millisec = -1为上一秒钟的最后一毫秒
millisec = 1000为下一秒钟的第一毫秒
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
23.setMilliSeconds(millisec)
(1).函数功能:
设置Date对象中的毫秒(0 ~ 999);
(2).函数参数:
millisec:必须,表示毫秒的数值,介于0 ~ 999之间
millisec = -1为上一秒钟的最后一毫秒
millisec = 1000为下一秒钟的第一毫秒
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
24.setMinutes(min,sec,millisec)
(1).函数功能:
设置Date对象中的分钟(0 ~ 59);该方法同样可用于设置秒数与毫秒数
(2).函数参数:
min:必须,表示分钟的数值,介于0 ~ 59之间
min = -1为上一小时的最后一分钟
min = 60为下一小时的第一分钟
sec:可选,表示秒的数值,介于0 ~ 59之间
sec = -1为上一分钟的最后一秒
sec = 60为下一分钟的第一秒钟
millisec:可选,表示毫秒的数值,介于0 ~ 999之间
millisec = -1为上一秒钟的最后一毫秒
millisec = 1000为下一秒钟的第一毫秒
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
25.setMonth(month,day)
(1).函数功能:
设置Date对象中月份(0 ~ 11);这个方法可用于设置月份中的某一天
(2).函数参数:
month:必须,表示月份的数值;用本地时间表示
month介于0到11之间的整数值表示从一月到十二月
month = -1为去年的最后一个月
month = 12为明年的第一个月
month = 13为明年的第二个月
day:可选,表示一个月中的一天的一个数值(1 ~ 31);
day=0为上一个月的最后一天;day=-1为上一个月最后一天之前的一天
如果当月有31天day=32为下个月的第一天
如果当月有30天day=32为下一个月的第二天
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
26.setSeconds(sec,millisec)
(1).函数功能:
设置Date对象中的秒钟(0 ~ 59);这个方法可以用于设置毫秒数
(2).函数参数:
sec:必须,表示秒的数值,介于0 ~ 59之间
sec = -1为上一分钟的最后一秒
sec = 60为下一分钟的第一秒钟
millisec:可选,表示毫秒的数值,介于0 ~ 999之间
millisec = -1为上一秒钟的最后一毫秒
millisec = 1000为下一秒钟的第一毫秒
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
27.setTime(millisec)
(1).函数功能:
setTime()方法以毫秒设置Date对象;
(2).函数参数:
millisec:必需,要设置的日期和时间据GMT时间1970年1月1日午夜之间的毫秒数;
这种类型的毫秒值可以传递给Date()构造函数,可以通过调用Date.UTC()和Date.parse()方法获得该值
以毫秒形式表示日期可以使它独立于时区
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
28.setUTCDate(day)
(1).函数功能:
根据世界时设置Date对象中月份的一天(1 ~ 31);
(2).函数参数:
day:必须,表示一个月中的一天的一个数值(1 ~ 31);
day=0为上一个月的最后一天;day=-1为上一个月最后一天之前的一天
如果当月有31天day=32为下个月的第一天
如果当月有30天day=32为下一个月的第二天
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
29.setUTCFullYear(year,month,day)
(1).函数功能:
根据世界时设置Date对象中的年份(四位数字);
(2).函数参数:
year:必需,表示年份的四位整数,用本地时间表示;
该参数应该是含有世纪值的完整年份,如1999而不只是缩写的年份值,比如99
month:可选,表示月份的数值;用本地时间表示
month介于0到11之间的整数值表示从一月到十二月
month = -1为去年的最后一个月
month = 12为明年的第一个月
month = 13为明年的第二个月
day:可选,表示一个月中的一天的一个数值(1 ~ 31);
day=0为上一个月的最后一天;day=-1为上一个月最后一天之前的一天
如果当月有31天day=32为下个月的第一天
如果当月有30天day=32为下一个月的第二天
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
30.setUTCHours(hour,min,sec,millisec)
(1).函数功能:
根据世界时设置Date对象中的小时(0 ~ 23);
该方法可用于设置分钟数,秒数以及毫秒数
(2).函数参数:
hour:必需,表示小时的数值,介于0(午夜)~23(晚上11点)之间
hour = -1为昨天的最后一小时
hour = 24为明天的第一小时
min:可选,表示分钟的数值,介于0 ~ 59之间
min = -1为上一小时的最后一分钟
min = 60为下一小时的第一分钟
sec:可选,表示秒的数值,介于0 ~ 59之间
sec = -1为上一分钟的最后一秒
sec = 60为下一分钟的第一秒钟
millisec:可选,表示毫秒的数值,介于0 ~ 999之间
millisec = -1为上一秒钟的最后一毫秒
millisec = 1000为下一秒钟的第一毫秒
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
31.setUTCMilliSeconds(millisec)
(1).函数功能:
根据世界时设置Date对象中的毫秒(0 ~ 999);
(2).函数参数:
millisec:必须,表示毫秒的数值,介于0 ~ 999之间
millisec = -1为上一秒钟的最后一毫秒
millisec = 1000为下一秒钟的第一毫秒
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
32.setUTCMinutes(min,sec,millisec)
(1).函数功能:
根据世界时设置Date对象中的分钟(0 ~ 59);
(2).函数参数:
min:必须,表示分钟的数值,介于0 ~ 59之间,用世界时表示
min = -1为上一小时的最后一分钟
min = 60为下一小时的第一分钟
sec:可选,表示秒的数值,介于0 ~ 59之间
sec = -1为上一分钟的最后一秒
sec = 60为下一分钟的第一秒钟
millisec:可选,表示毫秒的数值,介于0 ~ 999之间
millisec = -1为上一秒钟的最后一毫秒
millisec = 1000为下一秒钟的第一毫秒
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
33.setUTCMonth(month,day)
(1).函数功能:
根据世界时设置Date对象中的月份(0 ~ 11);这个方法可以适用于设置月份的某一天
(2).函数参数:
month:必须,表示月份的数值;用本地时间表示
month介于0到11之间的整数值表示从一月到十二月
month = -1为去年的最后一个月
month = 12为明年的第一个月
month = 13为明年的第二个月
day:可选,表示一个月中的一天的一个数值(1 ~ 31);
day=0为上一个月的最后一天;day=-1为上一个月最后一天之前的一天
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
34.setUTCSeconds(sec,millisec)
(1).函数功能:
setUTCSeconds()方法用于根据世界时(UTC)设置指定时间的秒字段;
(2).函数参数:
sec:必须,表示秒的数值,介于0 ~ 59之间
sec = -1为上一分钟的最后一秒
sec = 60为下一分钟的第一秒钟
millisec:可选,表示毫秒的数值,介于0 ~ 999之间
millisec = -1为上一秒钟的最后一毫秒
millisec = 1000为下一秒钟的第一毫秒
(3).函数返回值:
Number类型,表示1970年1月1日午夜至调整过日期的毫秒数
35.toDateString()
(1).函数功能:
Date对象的日期部分转换为字符串;
(2).函数参数:
无参数
(3).函数返回值:
String类型,表示日期作为字符串输出
36.toISOString()
(1).函数功能:
使用ISO标准返回字符串的日期格式;
该标准称为ISO-8601,格式为:YYYY-MM-DDTHH:mm:ss.sssZ
(2).函数参数:
无参数
(3).函数返回值:
String类型,表示ISO标准格式的时间与日期
37.toJSON()
(1).函数功能:
以JSON数据格式返回日期字符串;
JSON数据用同样的格式就像xISO-8601标准:YYYY-MM-DDTHH:mm:ss.sssZ
(2).函数参数:
无参数
(3).函数返回值:
String类型,表示JSON数据格式的日期
38.toLocalDateString()
(1).函数功能:
根据本地时间格式把Date对象的日期部分转换为字符串;
(2).函数参数:
无参数
(3).函数返回值:
String类型,日期和时间以字符串形式输出
39.toLocalTimeString()
(1).函数功能:
根据本地时间格式把Date对象的时间部分转换为字符串;
(2).函数参数:
无参数
(3).函数返回值:
String类型,date Object的时间部分的字符串表示,以本地时间区表示,并根据本地规则格式化
40.toLocalString()
(1).函数功能:
根据本地时间格式把Date对象转换为字符串;
(2).函数参数:
无参数
(3).函数返回值:
String类型,日期和时间以字符串形式输出
41.toString()
(1).函数功能:
把Date对象转换为字符串;
当Date对象需要显示为一个字符串时这个方法会自动被调用
(2).函数参数:
无参数
(3).函数返回值:
String类型,日期和时间以字符串形式输出
42.toTimeString()
(1).函数功能:
把Date对象的时间部分转换为字符串;
(2).函数参数:
无参数
(3).函数返回值:
String类型,时间以字符串形式输出
43.toUTCString()
(1).函数功能:
可根据世界时(UTC)把Date对象转换为字符串,并返回结果
(2).函数参数:
无参数
(3).函数返回值:
String类型,date Object的字符串表示,用世界时(UTC)表示
44.Date.UTC(year,month,day,hours,minutes,seconds,millisec)
(1).函数功能:
可根据世界时返回1970年1月1日到指定日期的毫秒数
(2).函数参数:
year:必需,表示年份的四位数字
month:必需,表示月份的整数,介于0 ~ 11
day:必需,表示日期的整数,介于1 ~ 31
hours:可选,表示小时的整数,介于0 ~ 23
minutes:可选,表示分钟的整数,介于0 ~ 59
seconds:可选,表示秒的整数,介于0 ~ 59
millisec:可选,表示毫秒的整数,介于0 ~ 999
(3).函数返回值:
Number类型,返回指定的时间距GMT时间1970年1月1日午夜的毫秒数
45.valueOf()
(1).函数功能:
返回Date对象的原始值;原始值返回1970年1月1日午夜以来的毫秒数
(2).函数参数:
无参数
(3).函数返回值:
Number类型,date的毫秒表示,返回值和方法Date.getTime返回的值相等,返回1970年1月1日午夜以来的毫秒数(4)Math对象:Math对象用于执行数学任务,Math对象并不像Date和String那样是对象的类，因此没有构造函数Math()
Math对象属性:
E:返回算术常量e,即自然对数的底数(约等于2.718);
LN2:返回2的自然对数(约等于0.693);
LN10:返回10的自然对数(约等于2.302);
LOG2E:返回以2为底的e的对数(约等于1.4426950408889634);
LOG10E:返回以10为底的e的对数(约等于0.434);
PI:返回圆周率(约等于3.14159);
SQRT1_2:返回2的平方根的倒数(约等于0.707);
SQRT2:返回2的平方根(约等于1.414);Math对象方法:JavaScript Math 对象 | 菜鸟教程
1.abs(x)
(1).函数功能:
返回x的绝对值;
(2)函数参数:
x:必需,必须是一个数值
(3)函数返回值:
Number类型,表示x的绝对值,如果x不是数字返回NaN,如果x为null返回0
2.acos(x)
(1).函数功能:
返回x的反余弦值;返回的值是0到PI之间的弧度值
如果参数x超过了-1.0~1.0的范围那么浏览器将返回NaN
如果参数x取值-1那么将返回PI
(2).函数参数:
x:必需,必须是-1.0~1.0之间的数
(3).函数返回值:
Number类型,x的反余弦值,返回的值是0到PI之间的弧度值
3.asin(x)
(1).函数功能:
返回x的反正弦值;返回-PI/2到PI/2之间的弧度值
如果参数x超过了-1.0 ~ 1.0的范围那么浏览器将返回NaN
如果参数x取值1那么将返回PI/2
(2).函数参数:
x:必需,必须是一个数值,该值介于-1.0~1.0之间
(3).函数返回值:
Number类型,x的反正弦值,返回的值是-PI/2到PI/2之间的弧度值
4.atan(x)
(1).函数功能:
以介于-PI/2与PI/2弧度之间的数值来返回x的反正切值;
(2).函数参数:
x:必需,必须是一个数值
(3).函数返回值:
Number类型,表示x的反正切值,返回的值是-PI/2到PI/2之间的弧度值
5.atan2(y,x)
(1).函数功能:
返回从x轴到点(x,y)的角度(介于-PI/2与PI/2弧度之间);
(2).函数参数:
y:必须,一个数字代表Y坐标
x:必须,一个数字代表x坐标
(3).函数返回值:
Number类型,表示x的反正切值,返回一个-PI到PI之间的数值,表示点(x, y)对应的偏移角度;
这是一个逆时针角度,以弧度为单位,正X轴和点(x, y)与原点连线之间;
注意此函数接受的参数:先传递y坐标,然后是x坐标
6.ceil(x)
(1).函数功能:
对数进行上舍入;如果参数是一个整数,该值不变
执行的是向上取整计算,它返回的是大于或等于函数参数,并且与之最接近的整数
(2).函数参数:
x:必需,必须是一个数值
(3).函数返回值:
Number类型,表示大于等于x并且与它最接近的整数
7.cos(x)
(1).函数功能:
返回数的余弦;
返回的是-1.0到1.0之间的数
(2).函数参数:
x:必需,必须是一个数值
(3).函数返回值:
Number类型,表示x的余弦值,返回的是-1.0到1.0之间的数
8.exp(x)
(1).函数功能:
返回Ex的指数;返回e的x次幂的值;其中e为自然对数
(2).函数参数:
x:必需,必须是一个数值
(3).函数返回值:
Number类型,返回e的x次幂,e代表自然对数的底数,其值近似为2.71828
9.floor(x)
(1).函数功能:
对x进行下舍入;
返回小于等于x的最大整数
如果传递的参数是一个整数则该值不变
(2).函数参数:
x:必需,是任意数值或表达式
(3).函数返回值:
Number类型,是小于等于x且与x最接近的整数
10.log(x)
(1).函数功能:
返回数的自然对数(底为e);
如果x为负数则返回NaN
如果x为0则返回-Infinity
(2).函数参数:
x,必需,代表任意数值或表达式
(3).函数返回值:
Number类型,表示x的自然对数
11.max(x,y,z,...,n)
(1).函数功能:
返回x,y,z,...,n中的最高值;
(2).函数参数:
x,y,z,...,n:可选,1或多个值
(3).函数返回值:
Number类型,代表传入参数中最大的值,如果没有参数则返回-Infinity;
如果有某个参数为NaN或是不能转换成数字的非数字值则返回NaN;
12.min(x,y,z,...,n)
(1).函数功能:
返回x,y,z,...,n中的最小值;
(2).函数参数:
x,y,z,...,n:可选,1或多个值
(3).函数返回值:
Number类型,代表传入参数中最小的值,如果没有参数则返回Infinity;
如果有某个参数为NaN或是不能转换成数字的非数字值则返回NaN;
13.pow(x,y)
(1).函数功能:
返回x的y次幂;
(2).函数参数:
x:必需,底数,必须是数字
y:必需,幂数,必须是数字
(3).函数返回值:
Number类型,代表x的y次幂
14.random()
(1).函数功能:
返回0(包含)~1(不包含)之间的一个随机数;
(2).函数参数:
无参数
(3).函数返回值:
Number类型,表示0.0 ~ 1.0(不包含)之间的一个伪随机数
返回min(包含)~max(不包含)之间的数字:Math.floor(Math.random() * (max - min) ) + min
15.round(x)
(1).函数功能:
四舍五入;可把一个数字舍入为最接近的整数
(2).函数参数:
x:必需,必须是数字
(3).函数返回值:
Number类型,是最接近x的整数
16.sin(x)
(1).函数功能:
返回数的正弦;返回值在-1.0到1.0之间
(2).函数参数:
x:必需,一个以弧度表示的角;将角度乘以0.017453293(2PI/360)即可转换为弧度
(3).函数返回值:
Number类型,表示参数x的正弦值,返回值在-1.0到1.0之间
17.sqrt(x)
(1).函数功能:
返回数的平方根;
(2).函数参数:
x:必需,必须是大于等于0的数
(3).函数返回值:
Number/NaN类型,代表参数x的平方根,如果x小于0则返回NaN
18.tan(x)
(1).函数功能:
返回角的正切;
(2).函数参数:
x:必需,一个以弧度表示的角;将角度乘以0.017453293(2PI/360)即可转换为弧度
(3).函数返回值:
Number类型,表示角度的正切值
19.tanh(x)
(1).函数功能:
返回一个数的双曲正切函数值;
(2).函数参数:
x:必需,待计算的数字
(3).函数返回值:
Number类型,表示所给数字的双曲正切值
20.trunc(x)
(1).函数功能:
将数字的小数部分去掉,只保留整数部分;
(2).函数参数:
x:任意数字
(3).函数返回值:
Number类型,表示给定数字的整数部分(5)Number对象:Number对象是原始数值的包装对象;
创建Number对象的方式:
var num = new Number(value);
如果一个参数值不能转换为一个数字将返回NaN(非数字值)Number对象属性:
1.constructor:返回对创建此对象的Number函数的引用;
2.MAX_VALUE:可表示的最大的数;
MAX_VALUE是Javascript Number对象的静态属性,只能通过Number.MAX_VALUE调用
使用自定义的Number x(x.MAX_VALUE)将无法获取MAX_VALUE属性:得到的结果为undefined
3.MIN_VALUE:可表示的最小的数;
MIN_VALUE是Javascript Number对象的静态属性,只能通过Number.MIN_VALUE调用
使用自定义的Number x(x.MIN_VALUE)将无法获取MIN_VALUE属性:得到的结果为undefined
MIN_VALUE是JavaScript最接近0的数,不是负值,负值属性为MAX_NUMBER
4.NEGATIVE_INFINITY:负无穷大,溢出时返回该值;
表示小于Number.MIN_VALUE的值
NEGATIVE_INFINITY是JavaScript Number对象的静态变量
使用自定义Number对象x调用该属性(x.NEGATIVE_INFINITY)将返回undefined
5.NaN:非数字值;
NaN属性是代表非数字值的特殊值,该属性用于指示某个值不是数字
可以把Number对象设置为该值,来指示其不是数字值
6.POSITIVE_INFINITY:正无穷大,溢出时返回该值;
POSITIVE_INFINITY表示大于Number.MAX_VALUE的值
POSITIVE_INFINITY是JavaScript Number对象的静态方法
使用自定义的Number对象x调用该属性(x.POSITIVE_INFINITY)将返回undefined
7.prototype:允许可以向对象添加属性和方法;
当构造一个属性时所有的Number对象将被添加上该属性及值
当构造一个方法时所有的Number对象都会有这个方法
Number.prototype不允许引用一个单独的Number对象,但是可以使用Number()对象
prototype型是一个全局对象的构造函数,可用于所有的JavaScript对象Number对象方法:JavaScript Number 对象 | 菜鸟教程
1.Number.isFinite(value)
(1).函数功能:
检测指定参数是否为无穷大;
如果number是NaN(非数字)或者是正、负无穷大的数则返回false
Number.isFinite()与全局的isFinite()函数不同,全局的isFinite()会先把检测值转换为Number然后在检测
Number.isFinite()不会将检测值转换为Number对象,如果检测值不是Number类型则返回false
(2).函数参数:
value:要检测的值
(3).函数返回值:
布尔型,如果是有限数字返回true,否则返回false
2.Number.isInteger(value)
(1).函数功能:
检测指定参数是否为整数;
如果是整数返回true,否则返回false
(2).函数参数:
value:要检测的值
(3).函数返回值:
布尔型,如果是整数返回true,否则返回false
3.Number.isNaN(value)
(1).函数功能:
检测指定参数是否为NaN;
用于判断传递的值是否为NaN,并且检查其类型是否为Number,如果值为NaN且类型为Number,则返回true,否则返回false
不能使用相等运算符==和===来判断一个值是否是NaN
Number.isNaN()不会自行将参数转换成数字,只有在参数是值为NaN的数字时才会返回true
(2).函数参数:
value:要检测的值
(3).函数返回值:
布尔型,如果值为NaN且类型为Number则返回true,否则返回false
4.Number.isSafeInteger(value)
(1).函数功能:
检测指定参数是否为安全整数;
用来判断传入的参数值是否是一个"安全整数",如果是安全整数返回true,否则返回false
一个安全整数是一个符合下面条件的整数：
可以准确地表示为一个IEEE-754双精度数字,其IEEE-754表示不能是舍入任何其他整数以适应IEEE-754表示的结果
安全整数范围为-(2^53 - 1)到2^53 - 1之间的整数,包含-(2^53 - 1)和2^53 - 1
(2).函数参数:
value:要检测的值
(3).函数返回值:
布尔型,如果是安全整数则返回true,否则返回false
5.toExponential(x)
(1).函数功能:
把对象的值转换为指数计数法;
(2).函数参数:
x:可选,规定指数计数法中的小数位数,是0 ~ 20之间的值,包括0和20;
有些实现可以支持更大的数值范围,如果省略了该参数将使用尽可能多的数字
(3).函数返回值:
String类型,返回Number Object的字符串表示,采用指数计数法,即小数点之前有一位数字,小数点之后有x位数字,该数字的小数部分将被舍入,必要时用0补足,以便它达到指定的长度;
6.toFixed(x)
(1).函数功能:
把数字转换为字符串,结果的小数点后有指定位数的数字;
将一个浮点数转换为指定小数位数的字符串表示,如果小数位数高于数字则使用0来填充
可把Number四舍五入为指定小数位数的数字
toFixed()方法在进行四舍五入时可能会产生一些不准确的结果,这是因为toFixed()方法在处理浮点数时实际上使用的是舍入到最近的偶数(银行家舍入)策略,而不是标准的四舍五入.这种舍入策略是为了在大量运算时减小累积误差
(2).函数参数:
x:必需,规定小数的位数,是0 ~ 20之间的值,包括0和20,有些实现可以支持更大的数值范围,如果省略了该参数将用0代替
(3).函数返回值:
String类型,表示数字字符串
7.toLocaleString(locales, options)
(1).函数功能:
返回数字在特定语言环境下的表示字符串;
新的locales和options参数让应用程序可以指定要进行格式转换的语言,并且定制函数的行为;
在旧的实现中会忽略locales和options参数,使用的语言环境和返回的字符串的形式完全取决于实现方式
(2).函数参数:
locales:可选
options:可选
(3).函数返回值:
字符串类型,表示返回一个语言环境下的表示字符串
8.toPrecision(x)
(1).函数功能:
把数字格式化为指定的长度;
返回指定长度的数值字符串,以指定的精度返回该数值对象的字符串表示,四舍五入到precision参数指定的显示数字位数
(2).函数参数:
x:可选,规定要转换为几位数,该参数是1 ~ 100之间(且包括1和100)的值,如果省略了该参数则调用方法 toString()返回原始数字的字符串形式;
如果precision参数不在1和100(包括)之间,将会抛出一个RangeError
(3).函数返回值:
String类型,表示指定精度的数字格式
9.toString(radix)
(1).函数功能:
把数字转换为字符串,使用指定的基数;
(2).函数参数:
radix:可选,规定表示数字的基数,是2 ~ 36之间的整数,若省略该参数则使用基数10,但是要注意如果该参数是10以外的其他值，则ECMAScript标准允许实现返回任意值
(3).函数返回值:
String类型,表示把数字转换成的对应进制的字符串
10.valueOf()
(1).函数功能:
返回一个Number对象的基本数字值;
(2).函数参数:
无参数
(3).函数返回值:
Number类型,表示一个数的原始值(6)String对象:String对象用于处理文本(字符串);
创建String对象的方式:
var txt = new String("string");
或者更简单方式:
var txt = "string";Number对象属性:
constructor:对创建该对象的函数的引用;
length:字符串的长度;
prototype:允许向对象添加属性和方法;
String对象方法:
JavaScript String 对象 | 菜鸟教程
1.charAt(index)
(1).函数功能:
返回在指定位置的字符;
第一个字符位置为0,第二个字符位置为1,以此类推;
(2).函数参数:
index:必需,表示字符串中某个位置的数字,即字符在字符串中的位置
(3).函数返回值:
String类型,表示返回在指定位置的字符
2.charCodeAt(index)
(1).函数功能:
返回在指定的位置的字符的Unicode编码;
返回值是0-65535之间的整数,表示给定索引处的UTF-16代码单元,
字符串中第一个字符的位置为0,第二个字符位置为1,以此类推
(2).函数参数:
index:必需,表示字符串中某个位置的数字,即字符在字符串中的下标
(3).函数返回值:
Number类型,表示返回在指定的位置的字符的Unicode编码
3.concat(string1, string2, ..., stringX)
(1).函数功能:
连接两个或更多字符串并返回新的字符串;
该方法没有改变原有字符串,但是会返回连接两个或多个字符串新字符串
(2).函数参数:
string1, string2, ..., stringX:必需,表示将被连接为一个字符串的一个或多个字符串对象
(3).函数返回值:
String类型,表示两个或多个字符串连接后生成的新字符串
4.endsWith(searchvalue, length)
(1).函数功能:
判断当前字符串是否是以指定的子字符串结尾的(区分大小写);
如果传入的子字符串在搜索字符串的末尾则返回true,否则将返回false
(2).函数参数:
searchvalue:必需,表示要搜索的子字符串
length:设置字符串的长度,默认值为原始字符串长度string.length
(3).函数返回值:
布尔值,如果字符串以指定的值结尾返回true,否则返回false
5.fromCharCode(n1, n2, ..., nX)
(1).函数功能:
将Unicode编码转为字符;
接受一个指定的Unicode值,然后返回一个字符串
该方法是String的静态方法,字符串中的每个字符都由单独的Unicode数字编码指定
(2).函数参数:
n1, n2, ..., nX:必需,表示一个或多个Unicode值,即要创建的字符串中的字符的Unicode编码
(3).函数返回值:
String类型,代表Unicode编码的字符
6.indexOf(searchvalue,start)
(1).函数功能:
返回某个指定的字符串值在字符串中首次出现的位置;
如果没有找到匹配的字符串则返回-1
indexOf()方法区分大小写
(2).函数参数:
searchvalue:必需,规定需检索的字符串值
start:可选的整数参数,规定在字符串中开始检索的位置,它的合法取值是0到string Object.length - 1,如省略该参数则将从字符串的首字符开始检索
(3).函数返回值:
Number类型,表示查找指定字符串第一次出现的位置,如果没找到匹配的字符串则返回-1
7.includes(searchvalue, start)
(1).函数功能:
查找字符串中是否包含指定的子字符串;
如果找到匹配的字符串则返回true,否则返回false
该方法区分大小写
(2).函数参数:
searchvalue:必需,表示要查找的字符串
start:可选表示设置从哪个位置开始查找,默认为0
(3).函数返回值:
Boolean类型,如果找到匹配的字符串返回true,否则返回false
8.lastIndexOf(searchvalue,start)
(1).函数功能:
从后向前搜索字符串,并从起始位置(0)开始计算返回字符串最后出现的位置;
如果指定第二个参数start,则在一个字符串中的指定位置从后向前搜索
该方法将从后向前检索字符串,但返回是从起始位置(0)开始计算子字符串最后出现的位置,看它是否含有字符串
开始检索的位置在字符串的start处或字符串的结尾(没有指定start时)
如果没有找到匹配字符串则返回-1
该方法是区分大小写的
(2).函数参数:
searchvalue:必需,表示规定需检索的字符串值
start:可选的整数参数,规定在字符串中开始检索的位置,它的合法取值是0到stringObject.length - 1;如省略该参数则将从字符串的最后一个字符处开始检索
(3).函数返回值:
Number类型,表示查找的字符串最后出现的位置,如果没有找到匹配字符串则返回-1
9.match(regexp)
(1).函数功能:
查找找到一个或多个正则表达式的匹配;
将检索字符串String Object,以找到一个或多个与regexp匹配的文本;
这个方法的行为在很大程度上有赖于regexp是否具有标志g,如果regexp没有标志g,那么match()方法就只能在stringObject中执行一次匹配;
如果没有找到任何匹配的文本match()将返回null,否则它将返回一个数组,其中存放了与它找到的匹配文本有关的信息
(2).函数参数:
regexp:必需,规定要匹配的模式的RegExp对象,如果该参数不是RegExp对象则需要首先把它传递给RegExp 构造函数将其转换为RegExp对象
(3).函数返回值:
Array:存放匹配结果的数组,该数组的内容依赖于regexp是否具有全局标志g,如果没找到匹配结果返回null
10.repeat(count)
(1).函数功能:
复制字符串指定次数,并将它们连接在一起返回;
(2).函数参数:
count:必需,表示设置要复制的次数
(3).函数返回值:
String类型,表示返回复制指定次数并连接在一起的字符串
11.replace(searchvalue,newvalue)
(1).函数功能:
在字符串中查找匹配的子串,并替换与正则表达式匹配的子串;
(2).函数参数:
searchvalue:必须,规定子字符串或要替换的模式的RegExp对象;如果该值是一个字符串,则将它作为要检索的直接量文本模式,而不是首先被转换为RegExp对象
newvalue:必需,一个字符串值,规定了替换文本或生成替换文本的函数
(3).函数返回值:
String类型,一个新的字符串,是用replacement替换regexp的第一次匹配或所有匹配之后得到的
12.replaceAll(regexp|substr, newSubstr|function)
(1).函数功能:
在字符串中查找匹配的子串,并替换与正则表达式匹配的所有子串;
(2).函数参数:
regexp|substr:必须,规定子字符串或要替换的模式的RegExp对象;如果该值是一个字符串则将它作为要检索的直接量文本模式,而不是首先被转换为RegExp对象;
当使用一个regex时必须设置全局("g")标志,否则它将引发TypeError
newSubstr|function:必需,一个字符串值,规定了替换文本或生成替换文本的函数
(3).函数返回值:
String类型,表示一个新的字符串,是用newSubstr替换regexp的所有匹配之后得到的
13.search(searchvalue)
(1).函数功能:
查找与正则表达式相匹配的值;
用于检索字符串中指定的子字符串或检索与正则表达式相匹配的子字符串
如果没有找到任何匹配的子串则返回-1
(2).函数参数:
searchvalue:必须,表示查找的字符串或者正则表达式
(3).函数返回值:
Number类型,表示与指定查找的字符串或者正则表达式相匹配的String对象起始位置
14.slice(start, end)
(1).函数功能:
提取字符串的片断,并在新的字符串中返回被提取的部分;
可提取字符串的某个部分,并以新的字符串返回被提取的部分;
使用start(包含)和end(不包含)参数来指定字符串提取的部分
start参数字符串中第一个字符位置为0,第二个字符位置为1,以此类推,如果是负数表示从尾部截取多少个字符串,slice(-2)表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)
end参数如果为负数,-1指字符串的最后一个字符的位置,-2指倒数第二个字符,以此类推
(2).函数参数:
start:必须,要抽取的片断的起始下标,第一个字符位置为0;如果为负数则从尾部开始截取
end:可选,紧接着要截取的片段结尾的下标;若未指定此参数则要提取的子串包括start到原字符串结尾的字符串;如果该参数是负数那么它规定的是从字符串的尾部开始算起的位置;slice(-2)表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)
(3).函数返回值:
String类型,表示提取的字符串
15.split(separator,limit)
(1).函数功能:
把字符串分割为字符串数组;
如果把空字符串("")用作separator,那么stringObject中的每个字符之间都会被分割;
该方法不改变原始字符串
(2).函数参数:
separator:可选,字符串或正则表达式,从该参数指定的地方分割string Object;
limit:可选,该参数可指定返回的数组的最大长度,如果设置了该参数,返回的子串不会多于这个参数指定的数组;如果没有设置该参数整个字符串都会被分割,不考虑它的长度
(3).函数返回值:
Array类型,是一个字符串数组,该数组是通过在separator指定的边界处将字符串string Object分割成子串创建的;返回的数组中的字串不包括separator自身
16.startsWith(searchvalue, start)
(1).函数功能:
查看字符串是否以指定的子字符串开头;
如果是以指定的子字符串开头返回true,否则false
该方法对大小写敏感
(2).函数参数:
searchvalue:必需,表示要查找的字符串
start:可选,表示查找的开始位置,默认为0
(3).函数返回值:
Boolean类型,如果字符串是以指定的子字符串开头返回true,否则返回false
17.substr(start,length)
(1).函数功能:
从起始索引号提取字符串中指定数目的字符;
参数指定的是子串的开始位置和长度
(2).函数参数:
start:必需,表示要抽取的子串的起始下标,必须是数值;如果是负数那么该参数声明从字符串的尾部开始算起的位置;也就是说-1指字符串中最后一个字符,-2指倒数第二个字符,以此类推;
length:可选,表示子串中的字符数,必须是数值;如果省略了该参数那么返回从stringObject的开始位置到结尾的字串
(3).函数返回值:
String类型
18.substring(from, to)
(1).函数功能:
提取字符串中两个指定的索引号之间的字符;
返回的子串包括开始处的字符,但不包括结束处的字符;
(2).函数参数:
from:必需,一个非负的整数,规定要提取的子串的第一个字符在string Object中的位置;
to:可选,一个非负的整数,比要提取的子串的最后一个字符在string Object中的位置多1;
如果省略该参数那么返回的子串会一直到字符串的结尾
(3).函数返回值:
String类型
19.toLowerCase()
(1).函数功能:
把字符串转换为小写;
(2).函数参数:
无参数
(3).函数返回值:
String类型
20.toUpperCase()
(1).函数功能:
把字符串转换为大写;
(2).函数参数:
无参数
(3).函数返回值:
String类型
21.trim()
(1).函数功能:
去除字符串两边的空白;
用于删除字符串的头尾空白符,空白符包括:空格、制表符tab、换行符等其他空白符等
不会改变原始字符串
不适用于null,undefined,Number类型
(2).函数参数:
无参数
(3).函数返回值:
String类型,表示移除头尾空格的字符串
22.toLocaleLowerCase()
(1).函数功能:
根据本地主机的语言环境把字符串转换为小写;
本地是根据浏览器的语言设置来判断的
(2).函数参数:
无参数
(3).函数返回值:
String类型,表示根据本地语言转换为小写的字符串
23.toLocaleUpperCase()
(1).函数功能:
根据本地主机的语言环境把字符串转换为大写;
本地是根据浏览器的语言设置来判断的
(2).函数参数:
无参数
(3).函数返回值:
String类型,表示根据本地语言转换为大写的字符串
24.valueOf()
(1).函数功能:
返回某个字符串对象的原始值;
通常由JavaScript在后台自动进行调用,而不是显式地处于代码中
(2).函数参数:
无参数
(3).函数返回值:
String类型
25.toString()
(1).函数功能:
返回一个字符串;
(2).函数参数:
无参数
(3).函数返回值:
String类型五、事件的绑定:
5.1.什么是事件:
HTML事件可以是浏览器行为也可以是用户行为。 当这些一些行为发生时，可以自动触发对应的JS函数的运行。 JS的事件驱动指的就是行为触发代码运行的这种特点。
5.2.常见事件:
(1)鼠标事件:
onclick:当用户点击某个对象时调用的事件句柄;
oncontextmenu:在用户点击鼠标右键打开上下文菜单时触发;
ondblclick:当用户双击某个对象时调用的事件句柄;
onmousedown:鼠标按钮被按下;
onmouseenter:当鼠标指针移动到元素上时触发;
onmouseleave:当鼠标指针移出元素时触发;
onmousemove:鼠标被移动;
onmouseover:鼠标移到某元素之上;
onmouseout:鼠标从某元素移开;
onmouseup:鼠标按键被松开;(2)键盘事件:
onkeydown:某个键盘按键被按下;
onkeypress:某个键盘按键被按下并松开;
onkeyup:某个键盘按键被松开;(3)表单事件:
onblur:元素失去焦点时触发;
onchange:该事件在表单元素的内容改变时触发(<input>,<keygen>,<select>,<textarea>);
onfocus:元素获取焦点时触发;
onfocusin:元素即将获取焦点时触发;
onfocusout:元素即将失去焦点时触发;
oninput:元素获取用户输入时触发;
onreset:表单重置时触发;
onsearch:用户向搜索域输入文本时触发(<input="search">);
onselect:用户选取文本时触发(<input>,<textarea>);
onsubmit:表单提交时触发;5.3.事件的绑定:
(1)通过元素的属性绑定:
a.通过事件属性绑定函数在行为发生时会自动执行函数。
b.一个事件可以同时绑定多个函数;
c.一个元素可以同时绑定多个事件;
d.方法中可以传入this对象,代表当前元素;
<head>
<meta charset="UTF-8">
<title>小标题</title>
<script>
function testDown1(){console.log("down1")}
function testDown2(){console.log("down2")}
function testFocus(){console.log("获得焦点")}
function testBlur(){ console.log("失去焦点")}
function testChange(input){console.log("内容改变");console.log(input.value);}
function testMouseOver(){console.log("鼠标悬停"))}
function testMouseLeave(){console.log("鼠标离开")}
function testMouseMove(){console.log("鼠标移动")}
</script>
</head>
<body>
<input type="text"
onkeydown="testDown1(),testDown2()"
onfocus="testFocus()"
onblur="testBlur()"
onchange="testChange(this)"
onmouseover="testMouse0ver()"
onmouseleave="testMouseLeave()"
onmousemove="testMouseMove()"
/>
</body>(2)通过DOM编程进行绑定:
<head>
<meta charset="UTF-8">
<title>小标题</title>
<script>
//页面加载完毕事件,浏览器加载完整个文档行为
window.onload=function(){
var in1 =document.getElementById("in1");
// 通过DOM编程绑定事件
in1.onchange=testChange
}
function testChange(){
console.log("内容改变");
console.log(event.target.value);
}
</script>
</head>
<body>
<input id="in1" type="text"/>
</body>六、BOM编程:
6.1.什么是BOM:
(1).BOM是Browser Object Model的简写，即浏览器对象模型;
(2).BOM由一系列对象组成，是访问、控制、修改浏览器的属性和方法;
(3).BOM没有统一的标准(每种客户端都可以自定标准);
(4).BOM编程是将浏览器窗口的各个组成部分抽象成各个对象，通过各个对象的API操作组件行为的一种编程;
(5)BOM编程的对象结构如下:
a.window:顶级对象，代表整个浏览器窗口,由浏览器提供，无需new创建;
b.location属性:代表浏览器的地址栏;
c.history属性:代表浏览器的访问历史;
d.screen属性:代表屏幕;
e.navigator属性:代表浏览器软件本身;
f.document属性:代表浏览器窗口目前解析的html文档;
g.console属性:代表浏览器开发者工具的控制台;
h.localStorage属性:代表浏览器的本地数据持久化存储;
i.sessionstorage属性:代表浏览器的本地数据会话级存储;
(6)window对象的常见API:Window 对象 | 菜鸟教程
a.三种弹窗方式:
<head>
<meta charset="UTF-8">
<title>小标题</title>
<script>
function testAlert(){
//普通信息提示框
window.alert("提示信息");
}
function testConfirm(){
//确认框
var con =confirm("确定要删除吗?");
if(con){
alert("点击了确定")
}else{
alert("点击了取消")
}
function testPrompt(){
//信息输入对话框
var res =prompt("请输入昵称","例如:张三");
alert("您输入的是:"+res);
}
</script>
</head>
<body>
<input type="button" value="提示框" onclick="testAlert()"/> <br>
<input type="button" value="确认框" onclick="testConfirm()"/> <br>
<input type="button" value="对话框" onclick="testPrompt()"/> <br>
</body>b.定时任务:
function fun4(){
window.setTimeout(function(){
console.log("hello")
},2000)
}c.其他API:
alert():显示带有一段消息和一个确认按钮的警告框;
atob():解码一个base-64编码的字符串;
btoa():创建一个base-64编码的字符串;
blur():把键盘焦点从顶层窗口移开;
clearInterval():取消由setInterval()设置的timeout;
clearTimeout():取消由setTimeout()方法设置的timeout;
close():关闭浏览器窗口;
confirm():显示带有一段消息以及确认按钮和取消按钮的对话框;
createPopup():创建一个pop-up窗口;
focus():把键盘焦点给予一个窗口;
getSelection():返回一个Selection对象,表示用户选择的文本范围或光标的当前位置;
getComputedStyle():获取指定元素的CSS样式;
matchMedia():该方法用来检查media query语句,它返回一个MediaQueryList对象;
moveBy():可相对窗口的当前坐标把它移动指定的像素;
moveTo():把窗口的左上角移动到一个指定的坐标;
open():打开一个新的浏览器窗口或查找一个已命名的窗口;
print():打印当前窗口的内容;
prompt():显示可提示用户输入的对话框;
resizeBy():按照指定的像素调整窗口的大小;
resizeTo():把窗口的大小调整到指定的宽度和高度;
scrollBy():按照指定的像素值来滚动内容;
scrollTo():把内容滚动到指定的坐标;
setInterval():按照指定的周期(以毫秒计)来调用函数或计算表达式;
setTimeout():在指定的毫秒数后调用函数或计算表达式;
stop():停止页面载入;
postMessage():安全地实现跨源通信;(7)window对象常见属性:Window 对象 | 菜鸟教程
closed:返回窗口是否已被关闭;
defaultStatus:设置或返回窗口状态栏中的默认文本;
document:对Document对象的只读引用;
frames:返回窗口中所有命名的框架,该集合是 Window 对象的数组,每个Window对象在窗口中含有一个框架;
history:对History对象的只读引用;
innerHeight:返回窗口的文档显示区的高度;
innerWidth:返回窗口的文档显示区的宽度;
localStorage:在浏览器中存储key/value对,没有过期时间;
length:设置或返回窗口中的框架数量;
location:用于窗口或框架的Location;
name:设置或返回窗口的名称;
navigator:对Navigator对象的只读引用;
opener:返回对创建此窗口的窗口的引用;
outerHeight:返回窗口的外部高度,包含工具条与滚动条;
outerWidth:返回窗口的外部宽度,包含工具条与滚动条;
pageXOffset:设置或返回当前页面相对于窗口显示区左上角的X位置;
pageYOffset:设置或返回当前页面相对于窗口显示区左上角的Y位置;
parent:返回父窗口;
screen:对Screen对象的只读引用,请参数Screen对象;
screenLeft:返回相对于屏幕窗口的x坐标;
screenTop:返回相对于屏幕窗口的y坐标;
screenX:返回相对于屏幕窗口的x坐;
sessionStorage:在浏览器中存储key/value对,在关闭窗口或标签页之后将会删除这些数据;
screenY:返回相对于屏幕窗口的y坐标;
self:返回对当前窗口的引用,等价于Window属性;
status:设置窗口状态栏的文本;
top:返回最顶层的父窗口;七、DOM编程:
7.1.什么是DOM编程:
简单来说:DOM(Document Object Model)编程就是使用document对象的API，完成对网页HTML文档进行动态修改，以实现网页数据和样式动态变化效果的编程。
document对象代表整个html文档，可用来访问页面中的所有元素，是最复杂的一个dom对象，可以说是学习好dom编程的关键所在;根据HTML代码结构特点，document对象本身是一种树形结构的文档对象。DOM编程其实就是用window对象的document属性的相关API完成对页面元素的控制的编程。
dom树中节点的类型:
node节点，所有结点的父类型:
a.element元素节点，node的子类型之一，代表一个完整标签;
b.attribute属性节点，node的子类型之一，代表元素的属性;
c.text文本节点，node的子类型之一，代表双标签中间的文本;
7.2.获取页面元素的几种方式:
(1)在整个文档范围内查找元素节点:
| 功能 | API | 返回值 |
| 根据id值查询 | document.getElementByld("id值") | 元素节点 |
| 根据标签名查询 | document.getElementsByTagName("标签名") | 元素节点数组 |
| 根据name属性值查询 | document.getElementsByName("name值") | 元素节点数组 |
| 根据类名查询 | document.getElementsByClassName("类名") | 元素节点数组 |
(2)在具体元素节点范围内查找子节点:
| 功能 | API | 返回值 |
| 查找子标签 | element.children | 返回子标签数组 |
| 查找第一个子标签 | element.firstElementChild | 标签对象 |
| 查找最后一个子标签 | element.lastElementChild | 节点对象 |
(3)查找指定子元素节点的父节点
| 功能 | API | 返回值 |
| 查找指定元素节点的父标签 | element.parentElement | 标签对象 |
(4)查找指定元素节点的兄弟节点
| 功能 | API | 返回值 |
| 查找前一个兄弟标签 | node.previousElementSibling | 标签对象 |
| 查找后一个兄弟标签 | node.nextElementSibling | 标签对象 |
7.3.操作元素属性值:
(1)属性操作:
| 需求 | 操作方式 |
| 读取属性值 | 元素对象.属性名 |
| 修改属性值 | 元素对象.属性名=新的属性值 |
| 修改元素样式值 | 元素.style.样式名=新的样式值 (原始样式名中的"_"符号要转换驼峰式,例如background-color需要转换为backgroundColor) |
(2)属性操作:内部文本操作
| 需求 | 操作方式 |
| 获取或者设置标签体的文本内容 | element.innerText |
| 获取或者设置标签体的内容 | element.innerHTML |
7.4.对页面的元素增删操作:
| API | 功能 |
| document.createElement("标签名") | 创建元素节点并返回，但不会自动添加到文档中 |
| document.createTextNode("文本值") | 创建文本节点并返回，但不会自动添加到文档中 |
| element.appendChild(ele) | 将ele添加到element所有子节点后面 |
| parentEle.insertBefore(newEle,targetEle) | 将newEle插入到targetEle前面 |
| parentEle.replaceChild(newEle, oldEle) | 用新节点替换原有的旧子节点 |
| element.remove() | 删除某个标签 |
八、正则表达式:
8.1.正则表达式简介:
正则表达式是描述字符模式的对象。正则表达式用于对字符串模式匹配及检索替换，是对字符串执行模式匹配的强大工具。
8.2.正则表达式的语法:
var patt = new RegExp(pattern,modifiers);
var patt = /pattern/modifiers;8.3.正则表达式修饰符:
| 修饰符 | 描述 |
| i | 执行对大小写不敏感的匹配 |
| g | 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止) |
| m | 执行多行匹配 |
8.4.正则表达式方括号:
| 元字符 | 描述 |
| [abc] | 查找方括号之间的任何字符 |
| [^abc] | 查找任何不在方括号之间的字符 |
| [0-9] | 查找任何从0至9的数字 |
| [a-z] | 查找任何从小写a到小写z的字符 |
| [A-Z] | 查找任何从大写A到大写Z的字符 |
| [A-z] | 查找任何从大写A到小写z的字符 |
| [adgk] | 查找给定集合内的任何字符 |
| [^adgk] | 查找给定集合外的任何字符 |
| (red|blue|green) | 查找任何指定的选项 |
8.5.正则表达式元字符:
| 表达式 | 描述 |
| . | 查找单个字符，除了换行和行结束符 |
| \w | 查找数字、字母及下划线 |
| \W | 查找非单词字符 |
| \d | 查找数字 |
| \D | 查找非数字字符 |
| \s | 查找空白字符 |
| \S | 查找非空白字符 |
| \b | 匹配单词边界 |
| \B | 匹配非单词边界 |
| \0 | 查找NULL字符 |
| \n | 查找换行符 |
| \f | 查找换页符 |
| \r | 查找回车符 |
| \t | 查找制表符 |
| \v | 查找垂直制表符 |
| \xxx | 查找以八进制数xxx规定的字符 |
| \xdd | 查找以十六进制数dd规定的字符 |
| \uxxxx | 查找以十六进制数xxxx规定的Unicode字符 |
8.6.正则表达式量词:
| 量词 | 描述 |
| n+ | 匹配任何包含至少一个n的字符串 |
| n* | 匹配任何包含零个或多个n的字符串 |
| n? | 匹配任何包含零个或一个n的字符串 |
| n{X} | 匹配包含X个n的序列的字符串 |
| n{X,} | X是一个正整数。前面的模式n连续出现至少X次时匹配 |
| n{X,Y} | X和Y为正整数。前面的模式n连续出现至少X次，至多Y次时匹配。 |
| n$ | 匹配任何结尾为n的字符串 |
| ^n | 匹配任何开头为n的字符串 |
| ?=n | 匹配任何其后紧接指定字符串n的字符串 |
| ?!n | 匹配任何其后没有紧接指定字符串n的字符串 |
8.7.RegExp对象方法:
| 方法 | 描述 |
| compile | 在1.5版本中已废弃，编译正则表达式 |
| exec | 检索字符串中指定的值。返回找到的值，并确定其位置。 |
| test | 检索字符串中指定的值，返回true或false |
| toString | 返回正则表达式的字符串 |
8.8.支持正则的String的方法:
| 方法 | 描述 |
| search | 检索与正则表达式相匹配的值 |
| match | 找到一个或多个正则表达式的匹配 |
| replace | 替换与正则表达式匹配的子串 |
| split | 把字符串分割为字符串数组 |
8.9.常用正则表达式:
| 需求 | 正则 |
| 用户名 | /^[a-zA-Z ][a-zA-Z-0-9]{5,9}$/ |
| 密码 | /^[a-zA-Z0-9_-@#& *]{6,12}$/ |
| 前后空格 | I^\s+|\s+$/g |
| 电子邮箱 | /^[a-zA-Z0-9_.-]+@([a-zA-Z0-9-]+[.]{1})+[a-zA-Z]+$/ |
扫一扫
273
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
