文章目录
引用类型的值(对象)是引用类型的一个实例。引用类型实际上是一种数据结构,类似于面对对象语言中类的概念。ECMAScript提供了一些原生的引用类型可以直接使用。以下介绍一些常用的引用类型。
Object类型
创建的方式
- new操作符
Var obj=new Object()
Obj.name='marry'
- 对象字面量
Var obj={
name:'marry',
age:14
}
使用对象字面量的方式创建对象不会调用Object构造函数。
访问属性的方式
- 点访问
obj.name //marry
- 方括号访问(方括号值为字符串)
obj["name"] //marry
Array类型
数组中每一项可以存储任意不同的数据类型,数组大小可以动态变化。
创建的方式
- new 操作符
var a=new Array()
var a1=new Array(10) //为数组指定长度
- 数组字面量
var a=[1,2,3]
读取数组
- 访问数组索引
var a=[1,2,3]
console.log(a[0]) //1,下标索引从0开始
检测数组
- instanceof,问题在一个全局作用域下有效,若网页中包含多个框架,会出现问题
- Array.isArray(),IE9以上支持
var a=new Array()
console.log(a instanceof Array) //true
console.log(Array.isArray(a)) //true
属性与方法
属性
length属性表示数组的长度,可以为该属性赋值,指定数组的长度。
方法
- 栈方法
- push(),传入任意个参数,放到数组的末尾,返回数组的长度;
- pop(),返回数组的最后一项,在栈中相当于栈顶。
栈是一种先进先出的数据结构。
var a=[1,2,3]
a.push(2) //4
console.log(a) //[1,2,3,2]
a.pop() //2
console.log(a) //[1,2,3]
- 队列方法
- unshift(),传入任意个参数,插入到数组的最前面,返回插入后数组的长度;
- pop()
队列是一种先进后出的数据结构。
var a=[1,2,3]
a.unshift(12,23) //5
console.log(a) //[12,23,1,2,3]
a.pop() //3
console.log(a) //[12,23,1,2]
- 重排序方法
- reverse(),反转数组
var a=[1,2,3]
a.reverse() //[3,2,1]
- sort(),调用toString()方法,按升序排列
var a=[1,12,3,2]
a.sort() //[1,12,2,3]
a.sort(function(a,b){
return a-b
}) //[1,2,3,12]
a.sort(function(a,b){
return b-a
}) //[12,3,2,1]
- 操作方法
- concat(),将传入的数据添加到原来的数组中;
var a=[1,2]
a.concat([3,4],5) //[1,2,3,4,5]
- join(),传入分隔符,将数组用分隔符隔开转换为字符串,返回字符串;
var a=[1,2]
a.join('||') //"1||2"
- slice(),传入一个参数,表示开始位置,传入两个参数,表示开始位置和结束位置(不包含开始位置)
var a=[1,2,3,4]
a.slice(1) //[2,3,4]
a.slice(1,2) //[2]
- splice()
- 两个参数,要删除的第一项的位置和要删除的个数;
- 三个参数,起始位置,要删除的项数和要插入的任意数量的项。
var a=[1,2,3,4]
a.splice(0,2)
console.log(a) //[3,4]
a.splice(0,0,1)
console.log(a) //[1,3,4]
a.splice(1,1,2,5)
console.log(a) //[1,2,5,4]
- 位置方法
-indexOf()
-lastIndexOf()
传入两个参数,要查找的项和(可选的)表示查找的位置的索引,一个是从前查找一个是从后查找。
var a=[1,2,3,1]
a.indexOf(1) //0
a.lastIndexOf(1) //3
- 迭代方法
接收两个参数,在每一项运行的函数和(可选的)运行该函数的作用域对象;传入的函数有3个参数,数组项的值,数组项的索引和数组对象本身。
- every(),对数组中每一项运行给定的函数,若每一项都返回true,则返回true;
var a=[2,4,6]
a.every(function(item,i,a){
return (item%2 ==0)
}) //true
- filter(),对数组中每一项运行给定的函数,返回为true的数组项;
var a=[-1,4,6]
a.filter(function(item,i,a){
return item>0
}) //[4,6]
- forEach(),对数组中每一项运行给定的函数;
var a=[-1,4,6]
a.forEach(function(item,i,a){
a[i]=item*2
})
console.log(a) //[-2,8,12]
- map(),对数组中每一项运行给定的函数,返回调用函数的结果组成的数组;
var a=[-1,4,6]
a.map(function(item,i,a){
return item*2
}) //[-2,8,12]
- some(),对数组中每一项运行给定的函数,如果其中任意一项返回true,则返回true。
var a=[-1,4,6]
a.some(function(item,i,a){
return item<0
}) //true
- 归并方法
接收两个参数,一个是在每一项上调用的函数(4个参数,前一个值,当前值,项的索引,数组对象)和(可选的)作为归并基础的初始值。下面两个方法一个从前开始归并一个从后开始归并。
- reduce()
var a=[1,2,3,4,5]
a.reduce(function(prev,next,i,arr){
return prev+next
}) //15
a.reduce(function(prev,next,i,arr){
return prev+next
},10) //25
- reduceRight()
var a=[1,2,3,4,5]
a.reduceRight(function(prev,next,i,arr){
return prev+next
}) //15
a.reduceRight(function(prev,next,i,arr){
return prev+next
},10) //25
这两种方法的结果是一样的,只是遍历数组的方式不一样。
Date类型
UTC时间,1970年1月1日之前或之后285616年
创建的方式
- new
不传入参数,会获取当前的日期和时间;
传入参数须传入日期的毫秒数,会获得指定的日期。
var d=new Date()
console.log(d) //Thu Oct 03 2019 18:40:42 GMT+0800 (中国标准时间)
var d1=new Date(1000)
console.log(d) //Thu Jan 01 1970 08:00:01 GMT+0800 (中国标准时间)
- Date.parse(),接收一个表示日期的字符串参数,返回相应的毫秒数。
字符串的格式可以为:- 月/日/年
- 英文月名 日,年
- 英文星期几 英文月名 日 年 时:分:秒 时区
- ISO 8601扩展格式 YYYY-MM-DDTHH:mm:ss:sssZ(2004-05-25T00:00:00)
Date.parse('10/3/2019') //1570032000000
Date.parse('May 3,2019') //1556812800000
Date.parse('2019-10-03T08:00:00') //1570060800000
- Date.UTC(),年份,月份(0-11),月的那一天(1-31),小时(0-23),分钟,秒和毫秒数。年份和月份必须,日默认为1号,其余默认值为0。
Date.UTC(2019,9,3) //1570060800000
- Date.now(),返回调用这个方法的当前时间,值为毫秒数。
Date.now() //1570100113914
日期格式化方法
- toDateString()
- toTimeString()
- toLocaleDateString()
- toLocaleTimeString()
- toUTCString()
var d=new Date()
d.toDateString() //"Thu Oct 03 2019"
d.toTimeString() //"08:00:00 GMT+0800 (中国标准时间)"
d.toLocaleDateString() //"2019/10/3"
d.toLocaleTimeString() //"上午8:00:00"
d.toUTCString() //"Thu, 03 Oct 2019 00:00:00 GMT"
日期/时间组件方法
-
getTime()
-
setTime(毫秒)
-
getFullYear()
-
getUTCFullYear()
-
setFullYear(年)
-
setUTCFullYear(年)
-
getMonth(),0-11
-
getUTCMonth()
-
setMonth(月)
-
setUTCMonth(月)
-
getDate()
-
getUTCDate()
-
setDate(日)
-
setUTCDate(日)
-
getDay(),0(星期日)-6(星期六)
-
getUTCDay()
-
getHours()
-
getUTCHours()
-
setHours(时)
-
setUTCHours(时)
-
getMinutes()
-
getUTCMinutes()
-
setMinutes(分)
-
setUTCMinutes(分)
-
getSeconds()
-
getUTCSeconds()
-
setSeconds(秒)
-
setUTCSeconds(秒)
-
getMilliseconds()
-
getUTCMilliseconds()
-
setMilliseconds(毫秒)
-
setUTCMilliseconds(毫秒)
-
getTimezoneOffset()
var d=new Date() //Thu Oct 03 2019 22:42:51 GMT+0800 (中国标准时间)
d.getFullYear() //2019
d.getUTCFullYear() //2019
d.getMonth() //9
d.getDay() //4
d.getDate() //3
RegExp类型
创建方式
- new
var r=new RegExp(‘pattern’,‘flags’)
- 正则字面量
var expression=/pattern/flags;
- pattern为正则表达式
- flags为正则表达式的匹配模式,有以下几种:
- g,全局模式
- i,不区分大小写模式
- m,多行模式
实例属性和方法
属性
每个实例拥有的属性:
- global,布尔值,表示是否设置了g标志;
- ignoreCase,布尔值,表示是否设置了i标志;
- lastIndex,整数,表示开始搜索下一个匹配项的字符位置,从0开始。
- multiline,布尔值,表示是否设置了m标志;
- source,正则表达式的字符串表示。
方法
- exec(),接收一个参数,要匹配的模式的字符串,返回第一个包含匹配项的数组。若没有匹配项返回null。返回的数组拥有两个特殊的属性index(匹配项在字符串中的位置)和input(应用正则表达式的字符串)。
var r=/[ab](c)/g
var result=r.exec('bacg')
console.log(result) //["ac", "c", index: 1, input: "bacg", groups: undefined]
- test(),接收一个字符串参数,在字符串与模式匹配的情况下返回true。
var r=/[ab](c)/g
r.test('bacg') //true
RegExp构造函数属性
相当于Java中的静态属性
长属性名 | 短属性名 | 意义 |
---|---|---|
input | $_ | 最近一次要匹配的字符串 |
lastMatch | $& | 最近一次匹配的项 |
lastParen | $+ | 最近一次匹配的捕获组 |
leftContext | $` | input字符串中lastMatch之前的文本 |
mutiline | $* | 布尔值,表示是否所有表达式都使用多行模式。 |
rightContext | $’ | input字符串中lastMatch之后的文本 |
Function类型
在js中函数其实是对象,每一函数都是Function类型的实例。
没有重载
函数名相当于指针,若有两个同名的函数,后面的函数会覆盖前面的函数,因为函数名的指针改变了。不能通过函数参数区别函数,函数没有重载。
函数声明与函数表达式
解析器在执行环境中解析数据时,会先读取函数声明,使其在执行任何代码前可用,这就是函数声明的提升。函数表达式需要等到执行到哪一行时执行,函数表达式不会提升。
sayName() //hello
function sayName(){
console.log('hello')
}
sayName() //报错
var sayName=function sayName(){
console.log('hello')
}
作为值的函数
函数名相当于变量,可以作为值来使用,作为函数参数和函数的返回值。
function plus(a,b){
return a+b
}
function multi(a,b){
return a*b
}
function com(a,b){
return a-b
}
function callPlus(plus,a,b){
return plus(a,b)
}
com(plus(1,1),multi(3,2)) //-4
callPlus(plus,1,3) //4
函数内部属性
函数内部有两个特殊对象:arguments和this,以及caller属性。
- arguments
arguments是一个类数组对象,包含所有的函数参数。arguments有一个callee属性,该属性为一个指针,指向拥有这个arguments对象的函数。
function f(num){
if(num<=1) {
return 1
}else{
//return num*f(num-1)
return num*arguments.callee(num-1)
}
}
- this
this的值为当前函数所在的环境对象,在全局作用域下this指向window。在函数被某个对象调用时,this指向这个对象。 - caller
caller属性指向调用当前函数的函数的引用。
function outer(){
inner()
}
function inner(){
console.log(inner.caller)
}
outer() //ƒ outer(){inner()}
caller属性和arguments.callee.caller的功能是一样的。
function outer(){
inner()
}
function inner(){
console.log(arguments.callee.caller)
}
outer() //ƒ outer(){inner()}
函数属性和方法
属性
每个函数都有这两个属性:length和prototype,length属性表示函数希望接收命名参数的个数,prototype属性表示函数的原型对象。
方法
- apply(),接收两个参数,一个是在其中运行函数的作用域,一个是参数数组(可以为Array,也可以为arguments对象)
- call(),与apply作用一样,参数不是以数组方式传递,而是逐个传递。
- bind(),传入一个对象,会创建一个指向该对象的函数实例。
var o={
name:'marry',
a:1,
b:2
}
function sayName(){
console.log(this.name)
}
function plus(a,b){
return this.a+this.b
}
plus(1,2) //NaN
plus.apply(o,[1,2]) //3
plus.call(o,1,2) //3
var newO=plus.bind(o)
newO() //3
基本包装类型
每一次读取基本类型的值时,后台会创建一个对应的基本包装类型的对象,调用相应的方法。
基本包装类型和引用类型的区别在于对象的生存期,使用new操作符生成的对象,在当前执行环境执行完前会一直存在,而基本包装对象只存在于一行代码中。
Boolean类型
- 创建
var b=new Boolean(true)
- 判断类型
var b1=new Boolean(true)
var b2=true
typeof b1 //"object"
typeof b2 //"boolean"
b1 instanceof Boolean //true
b2 instanceof Boolean ///false
Number类型
- 创建
var n=new Number(10)
- 方法
- toFixed(),接收一个参数,按照指定的小数位返回数值的字符串表示;
- toExponential(),返回以指数形式的字符串表示;
- toPrecision(),接收一个参数,表示数值的所有数字的位数(不包括指数部分)
var n=12.3
n.toFixed(2) //"12.30"
n.toExponential() //"1.23e+1"
n.toPrecision(1) //"1e+1"
n.toPrecision(2) //"12"
n.toPrecision(3) //"12.3"
3.判断类型
var n1=new Number(10)
var n2=10
typeof n1//"object"
typeof n2//"number"
n1 instanceof Number//true
n2 instanceof Number///false
String类型
属性和方法
属性
length属性表示字符串的长度。
方法
-
charAt(),接收一个参数,字符的位置,从0开始,返回该位置的字符。
-
charCodeAt(),接收一个参数,字符的位置,从0开始,返回该位置的字符编码。
var s='hello'
s.charAt(1) //'e'
s.charCodeAt(1) //101
- concat(),将一个或多个字符拼接起来,返回新拼接的字符串;
var s1='hello'
s1.concat(' world',' ','!') //"hello world !"
- slice(),接收两个参数,第一个参数指定字符串开始的位置,第二个参数(可选)指定字符串结束的位置。
var s='hello world'
s.slice(1,3) //"el"
s.slice(2) //"llo world"
- substr(),接收两个参数,第一个参数指定字符串开始的位置,第二个参数(可选)指定返回字符串的个数。
var s='hello world'
s.substr(1,3) //"ell"
s.substr(2) //"llo world"
- substring(),接收两个参数,第一个参数指定字符串开始的位置,第二个参数(可选)指定字符串结束的位置。
var s='hello world'
s.substring(1,3) //"el"
s.substring(2) //"llo world"
- indexOf(),接收两个参数,第一个参数为要搜索的字符串,第二个参数(可选)搜索字符串的位置,返回字符串位置从头开始搜索。
- lastIndexOf(),接收两个参数,第一个参数为要搜索的字符串,第二个参数(可选)搜索字符串的位置,返回字符串位置从最后开始搜索。
var s='hello world'
s.indexOf('l')//2
s.indexOf('l',3) // 3
s.lastIndexOf('l') // 9
s.lastIndexOf('l',4) // 3
- trim(),返回删除前缀和后缀所有空格的字符串
var s=' hello world '
s.trim() //"hello world"
- 大小写转换方法
- toLowerCase()
- toLoacaleLowerCase()
- toUpperCase()
- toLocaleUpperCase()
var s='hello'
s.toUpperCase() //"HELLO"
- match(),接收一个参数,为正则表达式或RegExp对象,返回一个数组,数组的第一项为与整个模式匹配的字符串,之后保存着与捕获组匹配的字符串。
var s='catdateat'
var result=s.match(/[a-z][at]/g)
console.log(result) //["ca", "da", "ea"]
- search(),接收一个参数,为正则表达式或RegExp对象,返回字符串中第一个匹配项的索引。若没有匹配项,返回-1。
var s='tdateat'
s.search(/[a-z][at]/g) //1
- replace(),接收两个参数,第一个参数为正则表达式或RegExp对象,第二个参数为字符串或函数。
var s='catdateat'
var result=s.replace(/[a-z][at]/g,'--')
console.log(result) //"--t--t--t"
- split(),传入一个字符串分隔符将一个字符串分割成多个字串放入数组中。
var s='1||2||3'
s.split('||') //["1", "2", "3"]
- localeCompare(),比较两个字符串,若字符串比另一个字符串靠前返回负数,相等返回0,靠后返回1。
var s1='yellow'
s1.localeCompare('bat') //1
s1.localeCompare('zaa') //-1
s1.localeCompare('yellow') //0
- fromCharCode(),是String的静态方法,接收多个字符编码,转换为字符串。
String.fromCharCode(97,98,99) //"abc"
单体内置对象
不需要实例化的对象,可以直接使用。
Global对象
在全局作用域中定义的属性和函数都是global对象的属性和方法。以下介绍一些可以直接使用的方法。
- encodeURI(),不会对url特有的字符进行编码;
- encodeURIComponent(),会对所有的特殊字符进行编码;
- decodeURI(),对encodeURI()编码的字符进行解码;
- decodURIComponent(),对encodeURIComponent()编码的字符进行解码。
var url='http://www.baidu.com/名称/'
encodeURI(url) //"http://www.baidu.com/%E5%90%8D%E7%A7%B0/"
encodeURIComponent(url) //"http%3A%2F%2Fwww.baidu.com%2F%E5%90%8D%E7%A7%B0%2F"
- eval(),接收一个参数,要执行的ECMAScript字符串。
eval(alert('hello'))
Math对象
Math对象提供了一些常用的关于计算的属性和方法,下面介绍一些常用的方法。
- min(),确定一组数值中的最小值;
- max(),确定一组数值中的最大值;
Math.min(99,1,23) //1
Math.max(99,1,23) //99
- ceil(),向上舍入;
- floor(),向下舍入;
- round(),四舍五入;
Math.ceil(4.3) //5
Math.floor(4.3) //4
Math.round(4.3) //4
Math.round(4.5) //5
- random(),返回大于0小于1的一个随机数;
Math.random() //0.34127108953258833
- abs(num),返回数值的绝对值;
- exp(num),返回以e为底数的num次幂;
- pow(num,power),返回num的power次幂;
- sqrt(num),返回num的平方根。