———————————
JavaScript语法结构
「内置对象」
———————————
内置对象
JS中的对象总共分三种:自定义对象、内置对象、浏览器对象。前两种都是JS的基础内容属于ECMAScript。浏览器对象属于JS独有的(属于API)
内置独享包含哪些
根据JS API(Application Program Interface),开发文档说明,讲解的内置对象就是指JS语言自带的一些对象,这些对象供开发者使用,并提供了一些常用的或者最基础的最必要的功能(常用的属性、函数等)
JavaScript内置对象:Math、Date、Array、String等
内置对象的作用
内置对象最大的优点帮助开发者提高开发效率
如何学习一个对象的使用
学习JS内置对象,需要查询文档,在学习一个内置对象的时候,只需要根据文档学会其内部成员的使用方式即可。
[https://developer.mozilla.org/zh-CN/docs/Web]:
如果一个对象的方法所需的参数指定了类型,在使用方法的时候传入的参数类型和所需类不符,则内置函数一般会自动处理好,也有可能抛异常
Math对象
Math对象不是构造函数,它具有数学中常用的一些常数、函数和属性、方法。都是和数学运算有关
常用属性
- PI:圆周率3.14159
常用方法
- abs():求一个数的绝对值
- ceil():向上取整,如果这个数的本质是整数则返回自身,如果是小数则返回比这个小数整数部分大1的整数,如果是负数直接去掉小数部分
- floor():向下取整,如果这个数的本质是整数则返回自身,如果是小数则返回这个小数整数部分,如果是负数直接去比整数部分小1的负整数
- round():四舍五入就近取整 -3.5结果是-3
- max()、min():求最大值或最小值
- random():获取范围在[0-1]之间的随机数 0=<x<1
随机一个整数该如何处理:
console.log(Math.round(Math.random()*10));
随机一个指定范围内的整数:
// 指定一个范围整数取随机整数,并且要求包含这两个整数
// 例如:求5-12之间的随机数
function randomNum(min,max){
return Math.floor(Math.random()*(max-min+1)+min);
}
console.log(randomNum(5,12));
Date对象
Date对象和Math不一样,Date是一个构造函数,所以使用Date时必须先要对其进行实例化(调用构造)然后才能使用其属性和方法。Date对象主要是用来处理日期以及时间
Date对象的构造函数其实有四种
实例化Date
-
获取当前时间必须要实例化
var now=new Date();
-
获取指定时间的日期对象
var now=new Date("2021,10,1");
创建时间时以第二种方式写参数进行创建,参数格式写法可以以字符串格式写"2020,11,18","2020/11/18"等格式
还可以直接用日期做实参,直接写2020,11,18
方法
- getFullYear():获取当前对象的年份部分
- getMonth():获取当前对象的月(0-11)
- getDay():获取当前对象的星期数(0-6),0代表周天
- getDate():获取当前对象的天数
- getHours():获取当前时间的小时数24小时
- getMinutes():获取当前时间的分钟数
- getSeconds():获取当前时间的秒数
- getMilliseconds():获取当前时间的毫秒数
- getTime():获取从1970-1-1(世界标准时间)开始计的毫秒数
总结:
在方法中以get开头的方法一般都是获取某些数据的方法
而以set开头的方法一般都是设置某些数据的方法
而以to开头的方法一般都是将这些数据的类型转成目标类型的方法
Array对象
Array对象用于构造数组的全局对象
创建数组
-
字面量方式
-
new Array()方式
var arr=new Array();
注意:上面方式创建的数组是一个空数组,如果要使用Array对象创建一个非空数组,需要给Array对象实例化时写实参
- 如果只传入一个参数,那么是指定了这个数组的长度为3,元素全部为undefined
- 如果传入了多个参数,那么这些参数充当数组的元素
数组分类
- 一维数组:线型
- 二维数组:面型
- 多维数组:体型
// 创建一维数组
var arr1=[1,2,3,4,5];
console.log(arr1);
// 创建二维数组
var arr2=[[1,2,3],[2,3,4],[1,3,2]];
console.log(arr2);
// 创建三维数组
var arr3=[[[1,2],[2,3],[1,3],[1]],[[2,3],[1,3],[2]]];
console.log(arr3);
检测数组
-
instanceof运算符:可以判断一个对象是否是某个构造函数的实例
console.log(arr1 instanceof Array);
- 只有这个变量等号之后是以构造函数的执行方式赋予的这个类型结果为true
- 数组的字面量创建方式默认是执行了一个构造函数
-
Array.isArray()方法用于判断一个对象是否为数组,这个方法是HTML5中提供的方法
console.log(Array.isArray(num));
属性
- length:数组的长度
方法
对元素进行操作的方法
- push(参数1,参数2,…):向数组的末尾添加一个或者多个元素,返回结果为加完元素之后的长度
- pop():从数组中的最后一个元素开始删除,将数组的长度每执行一次减1,返回结果为删除的这个元素数据
- unshift(参数1,参数2,…):从数组的开头添加一个或更多元素,返回结果为加完元素之后的长度
- shift():从数组中的第一个元素开始删除,将数组的长度每执行一次减1,返回结果为删除的这个元素数据
数组排序
-
reverse():反转数组中的元素的顺序,无参数,反转元数组中的元素顺序,并且返回一个新数组
-
sort():对数组的元素进行排序,该方法会改变原来数组中元素的顺序,并且返回一个新数组
sort函数可以提供参数来设置排序规则
- 如果传入“function(a,b){return a-b;}”,则为升序
- 如果传入“function(a,b){return b-a;}”,则为降序
console.log(arr.sort(function(a,b){return b-a;}));
索引及元素
- indexof():数组中查找给定元素的第一次出现的索引,如果不存在则返回-1
- lastindexof():从数组中的第一个元素开始查找指定元素第一次出现的索引,如果不存在则返回-1
- toString():将数组转换成字符串,元素之间使用逗号分隔
- join():将数组中的所有元素转成一个字符串,元素之间使用指定的分隔符进行连接,如果不给参数默认是逗号
- concat():连接两个或者多个数组,返回一个新数组
- slice(start,end):数组截取从索引为start开始,到end结束不包含结束索引,返回值为截取的新数组
- splice(start,count):删除数组中从索引为start开始的共数count个元素,返回结果为删除的这些元素所组成的新数组
String对象
基本数据类型
为了方便操作基本数据类型,JS提供了三个特殊的类型:String、Number、Boolean
基本数据类型称为原始类型或简单数据类型,而将基本数据类型进行再包装则会称为复杂数据类型,这样可以通过复杂数据类型对基本数据类型进行对象化(基本数据类型也拥有属性和方法的概念)
// var a=5;
// var b=new Number(5);
// console.log(b);
// console.log(typeof a); //结果是Number
// console.log(typeof b); //结果是Object
// console.log(a==b);
字符串的不可变
这里的不可变是指字符串变量声明之后,其值不会发生改变。虽然看上去变量的内容发生了改变,其实质是这个变量指向的地址发生了改变,也就是存储这个新内容的空间是一个新的地址空间。
字符串变量改变数据的过程:
- 当声明一个变量来记录字符串数据,变量的名称指向一个地址,顺着这个地址可以找到一个内存空间,这个空间里面记录的就是数据
- 给变量重新赋值,如果新的数据和原始数据一样,那么变量名称记录的地址是上一步创建时地址
- 如果给变量重新赋值其数据和原始数据不一样,那么系统会重新开辟一个空间将新的数据先存储,然后变量名称中存储的空间地址不再是原始地址,而是这个新的空间地址
- 原始空间地址如果再也没有被记录那么就会被系统回收,里面的数据彻底被释放
因此在编程中尽可能的不要进行大量的连接字符串操作
字符串的本质
可以将字符串看做是一个字符类型的数组,因此其大量的属性和方法用法一样
常用方法
-
charAt(index):返回指定索引位置的字符,和使用索引方式获取结果一样
-
charCodeAt(index):返回指定索引位置的字符的ASCII码
-
endsWith():从指定的位置开始查找指定的字符串,如果查到返回true否则返回false
-
includes():从指定的位置开始查找指定的字符串,如果查到返回true否则返回false
-
replace():将原字符串中指定的字符串进行替换成新的字符串
-
substring(start,end):将原字符串进行截取从start索引开始到end结束(取不到end)
-
substr(start,count):将源字符串进行截取从start索引开始截取count个字符
-
toUpperCase()/toLowerCase():将字符串中的字母进行大小写转换
ES6 的内置对象扩展
Array 的扩展方法
扩展运算符可以将数组或者对象转为用逗号分隔的参数序列
扩展运算符可以应用于合并数组
将类数组或可遍历对象转换为真正的数组
构造函数方法
构造函数方法Array.from()
将伪数组或可遍历对象转换为真正的数组
方法还可以接受第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组
注意:如果是对象,那么属性需要写对应的索引
实例方法:find()
用于找出第一个符合条件的数组成员,如果没有找到返回undefined
实例方法:findIndex()
用于找出第一个符合条件的数组成员的位置,如果没有找到返回-1
实例方法:includes()
判断某个数组是否包含给定的值,返回布尔值。
String 的扩展方法
模板字符串
ES6新增的创建字符串的方式,使用反引号定义
模板字符串中可以解析变量
模板字符串中可以换行
在模板字符串中可以调用函数
实例方法:startsWith() 和 endsWith()
- startsWith():表示参数字符串是否在原字符串的头部,返回布尔值
- endsWith():表示参数字符串是否在原字符串的尾部,返回布尔值
实例方法:repeat()
repeat方法表示将原字符串重复n次,返回一个新字符串
Set 数据结构
ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。
Set本身是一个构造函数,用来生成 Set 数据结构
Set函数可以接受一个数组作为参数,用来初始化。
实例方法
- add(value):添加某个值,返回 Set 结构本身
- delete(value):删除某个值,返回一个布尔值,表示删除是否成功
- has(value):返回一个布尔值,表示该值是否为 Set 的成员
- clear():清除所有成员,没有返回值
遍历
原字符串重复n次,返回一个新字符串
Set 数据结构
ES6 提供了新的数据结构 Set。它类似于数组,但是成员的值都是唯一的,没有重复的值。
Set本身是一个构造函数,用来生成 Set 数据结构
Set函数可以接受一个数组作为参数,用来初始化。
实例方法
- add(value):添加某个值,返回 Set 结构本身
- delete(value):删除某个值,返回一个布尔值,表示删除是否成功
- has(value):返回一个布尔值,表示该值是否为 Set 的成员
- clear():清除所有成员,没有返回值
遍历
Set 结构的实例与数组一样,也拥有forEach方法,用于对每个成员执行某种操作,没有返回值。