您的位置:首页 > Web前端 > JavaScript

JavaScript中的引用类型

2017-04-07 12:58 190 查看
JavaScript中的引用类型


Object类型


两种创建方式:

new操作符
对象字面量(在使用时实际不会调用构造函数)

注意点:Object的属性名可以使用字符串


访问方法:

点表示法 
person.name

方括号法 
person["name"]


上述的两种方法没有本质的区别,但是方括号可以通过变量来访问属性

譬如:
12
var propertyName="name";typeof person[propertyName]
如果属性中包含会导致语法错误的字符或者属性名字使用的是关键字或者保留字,可以使用方括号表示法。例如:

1
person["first name"]="MrErHu"


Array类型


创建Array的两种基本方式

通过构造函数
1
var array=new Array();
通过字面量常数
1
var array=['red','green','blue'];
需要注意的是:

1
var array=['red','green','']
在IE8之前的版本被解析成长度为三的数组,最后一位的值为undefined。但是在其他主流的浏览器中会被接卸成长度为2的数组。


Array中length的用法

length不是只读的,可以通过设置这个属性来添加新的项目或者删除项目
12345
var array=new Array();array[0]=1;array[1]=2;array["index"]=3;alert(array.length);//2
通过上面的例子我们发现,非数字索引不占数组的长度。


检测数组的方式

ECMAScript3
12
if(value instanceof Array){}
ECMAScript5 
Array.isArray()


上面两种方法,第二种会效果更好,第一种方法可能会存在页面内有多个框架,如果数组从一个框架传入另一个框架,会存在不同的构造函数。


转换方法

toString()

toLocaleString()

valueOf()
:返回数组,调用每一项的
toString()
方法


栈方法

push()
:参数可以是任意的
pop()
:返回数组的最后一项


队列方法

shift()
:移除数组的第一项并返回该项
unshift()
:在数组的前端添加任意项并返回新的数组长度 unshift(“red”,”green”)在数组中是red在前
green在后


重排序方法

reverse()
:翻转数组的顺序
sort()
:调用每个数组项的toString()方法,然后默认升序排序。可以接收一个比较函数,比较函数的两个参数,第一个参数位于第二个之前返回一个负数;相等返回0,第一个参数位于第二个参数后面,返回一个正数。如果需要倒序排列,则相反即可。

例如升序的比较函数可以是
function compare(num1,num2){ return num1-num2; }


操作方法

concat()
:基于当前的数组的所有项创建一个新的数组
slice()
:基于当前数组的一个或者多个项目创建数组 参数是返回项的起始和结束位置 如果存在负参数,则用数组长度加上该数来确定实际的位置
splice()
:用途及其广泛,主要用途有三个:
删除 指定两个参数 第一个项的位置和要删除的项数
插入 三个参数:起始位置 0 要插入的项
替换 起始位置 删除的数量 要插入的项


位置方法

indexOf()
:参数 要查找的项目和查找的起始位置
lastIndexOf
:参数 要查找的项目和查找的起始位置


迭代方法(ECMAScript
5)

every()
:对每一项运行函数,全部返回true,则返回true
filter()
:对返回true的项组成数组
forEach()
:对每一项运行函数
map()
:返回每次函数返回的运行结果
some()
:存在一项为true,返回true

对于上述的方法,传入的函数签名
function(item,index,array){}


归并方法

reduce()

reduceRight()


上述两个方法都会迭代整个数组,不同的是二者的顺序。参数 调用的函数和并归的初始值

函数签名是:
function(prev,cur,index,array){}


函数对应的四个参数是:前一个值、当前值、索引、数组对象


Date类型

创建方法 
var now=new Date();


Date对象采用的是国际协调时间,不传递参数自动获取当前的日期和时间。

####创建特定的方法特定日期和时间的方法
Date.parse()
:接受表示日期的字符串
Date.UTC()
:参数是年份、月份、天、小时、分、秒等
Date.now()
:ECMAScript5 返回调用方法的日期和时间的毫秒数


RegExp类型


字面量创建法

创建方式

1
var expression = /pattern/flags
其中:

pattern是正则表达式,

flag是表示, g(global) | i(case-insensitive)| m(multiline)


RegExp构造函数创建法

1
var pattern2=new RegExp(pattern,flags);
两个参数必须都是字符串,必须对pattern的元字符进行双重转义。两种的区别在于字面量创建的只创建一个RegExp实例,但是调用构造函数每次都是创建新的实例。

所具有的实例属性:
global
ignoreCase
lastIndex
multiline
source

所具有的实例方法:
exrc()
:接受一个应用模式的字符串,返回包含第一个匹配信息的数组。返回的是Array实例。但是包含两个额外的属性
index:索引地址 input:应用正则表达式的字符串。
test()
:接受一个字符串参数 返回布尔值表示是否匹配

长属性名 | 短属性名

————|——–

input | \$_

lastMatch | \$\&

lastPattern | \$+

leftContext | \$`

multiline | \$*

rightContext| \$’


Function
类型

在JavaScript语言中函数的本质是对象

三种构造方式
函数声明
function sum(num1,num2){ return num1+num2; }

函数表达式
var sum=functionm(num1,num2){ return num1+num2; };

构造函数
1
var sum=new Function("num1","num2","return num1+num2"); //不推荐
第三种方式不推荐的原因是会导致两次解析代码。


没有重载

因为在创建第二个同名函数的时候,实际上是覆盖了引用的第一个变量


函数声明和函数表达式的区别

首先解析器会率先读取函数声明,通过函数声明提升的过程,读取并将其添加到执行环境中。并使其在执行任何代码之前都可以用。但是函数表达式必须等到解析器执行到它所在的代码行时,才会真的被解析。


作为值的函数

函数在ECMAScript中为对象,因此函数是可以作为值使用。可以将函数作为值传给另一个函数,也可以将函数作为结果返回。

例如:

123
function callSomeFunction(someFunction,someArugment){    return someFunction(someArgument);}
当然我们也可以从函数里面返回另一个函数,下面举例sort函数的比较参数,该比较函数可以根据函数特定的属性排序。

1234567
function createCompareFunction(property){    return function(object1, object2){        var value1=object[property];        var value2=object[property];        return value1-value2;    }}


函数的内部属性

在函数内部有两个特殊的对象:argument和this
argument是一个类数组对象,包含着传入函数的所有参数,其中argument包含着一个callee的变量,指向拥有函数的对象

因此我们的求阶乘的函数就可以表示为
1234567
function factorial(num){    if(num<1){        return 1;    } else{        return num*argumment.callee(num-1);    }}
这样我们就可以在函数内部将函数实现与函数名分离开,不必再耦合在一起。
this 引用函数据以执行的环境对象,在函数执行之前,this对象的值并不确定,可能会在代码执行的过程中引用不同的对象。其实,函数的名字只是一个包含指针的变量而已。不论是在全局的环境中,还是在对象中,指向的函数仍然是同一个。
caller 是ECMAScript规范的另外一个函数对象。这个属性保存着调用当前函数的函数的引用。

例如:
1234567
function outer(){    inner();}function inner(){    alert(inner.caller);}outer();
这段代码会在显示
outer()
函数的源代码。因为
outer()
调用了
inner()
,所以
inner.caller
指向的是
outer()


为了实现更松散的耦合。我们也可以通过
argument.callee.caller
来调用

需要注意的是

在ECMAScript5中定义了
argument.caller
,主要目的是为了区分函数的
caller
argument.caller.>ar
,本质也是为了这么语言的安全性


函数的属性和方法

length
 表示函数希望接受的命名参数的个数
prototype
 不可枚举 详细在下一章中介绍

函数包含的两个非继承的方法

下面的两个方法都是在特定的作用域中调用函数
apply()
:两个参数 一个是运行函数的作用域 另一个是参数数组
call()
 :与
apply()
区别就是接受参数的方式不同,在call()中直接把剩余的参数传递给函数

上面两个函数的作用是可以扩充函数的作用域。不需要方法和对象之间进行耦合。
bind()
:ECMAScript5定义,会创建一个函数的实例,其this的值会绑定到传给
bind()
函数的值


基本包装类型

三种特殊的引用类型:
Boolean

Number

String


实际上,每当读取一个基本类型值得时候,后台就会自动创建一个对应的基本包装类型的对象,但是这个对象的生存期只存在在一行代码的执行瞬间,然后立即被销毁,这意味着我们不能对其添加属性和方法。
Object
对象的构造方法可以更具传入的值得类型返回基本类型的实例,例如
12
var object=new Object("some text");alert(object instanceof String) //true
需要注意的是,直接调用转型函数和通过
new
操作符调用同名的构造函数是不同的。例如:

12345
var value=25;var number=Number(value);alert(typeof number);  //numbervar object=new Number(value);alert(typeof object); //object


Number类型

valueOf()
:返回对象表示的基本类型的数值
toString()
:返回数字的字符串,可以添加数字表示数字进制
toFixed()
:按照指定的数字返回小数位的字符串 四舍五入
toExponential()
:返回以指数表示法表示的数值字符串形式
toPrecesion()
:可能会返回固定格式,也可能返回指数形式。主要是判断精确到的位数。


String类型

length
:字符串包含的字符数

字符方法


charAt()
:接受字符位置,返回指定位置的字符
charCodeAt()
:接受字符位置,返回指定位置的字符编码

字符串操作方法

concat()
:用于将一个或者多个字符串拼装起来,返回新字符串
slice
:第一个参数
起始位置 第二个参数 最后一个字符后面
substr()
:第一个参数
起始位置 第二个参数 字符数
substring()
:第一个参数
起始位置 第二个参数 最后一个字符后面

具体区别主要是对于负数的处理不同,详情可以查询API

字符串位置的方法


indexOf()
:从前开始在字符串搜索指定字符,并返回位置
lastIndexOf()
:从末尾开始在字符串搜索指定字符,并返回位置

上述两种方法都可接受第二个方法,表示开始搜索的位置,因此可以不断的增加index的位置来迭代搜索
trim()
:创建副本并删除前置和后置的空格
toLowerCase()

toUpperCase()


模式匹配


match()

search()

replace()


字符串大小比较

localeCompare()


fromCharCode()

fromCharCode()
:接受一个或者多个字符编码,转化成字符串


内置单体对象

内置对象的定义:有ECMAScript实现提供的,不依赖于宿主环境的对象,这些对象在程序执行之前已经存在。


Global对象


URI编码

encodeURI()
:用于整个URI地址
encodeURIComponent()
:用于URI中的某一段

上述二者的主要区别是
encodeURI()
不会对本来属于URI地址的特殊字符进行编码,例如冒号、问号。但是
encodeURIComponent()
会对所有的特殊字符进行编码
decodeURI()

decodeURIComponent()


eval()
方法


eval()
方法像是一个ECMAScript解释器,接受要执行的ECMAScript字符串,执行代码具有和执行环境相同的作用域链。但是在函数中创建的任何变量和函数都不会被提升。在严格模式下,外部是访问不到函数中创建的任何变量和函数,

window对象


Web浏览器都是将全局对象作为window对象的一部分来实现的。


Math对象


Math对象的常见属性

Math.E

Math.LN10
 :ln10
Math.LN2

Math.Log2e
 :log 2 e
Math.PI


Math方法


min()

max()

ceil()

floor()

round()

random()
:返回一个大于等于0小于1的随机数

例如我们要在整个整数范围内随机选择一个数

值 = Math.floor(Math.random * 可能值的总数 +第一个可能的值)

内置对象Math还提供了其他的数据计算函数,可以访问MDN查询。
原文地址: https://mrerhu.github.io/2016/12/15/JavaScript%E4%B8%AD%E7%9A%84%E5%BC%95%E7%94%A8%E7%B1%BB%E5%9E%8B/
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐