JavaScript中的引用类型
2017-04-07 12:58
190 查看
JavaScript中的引用类型
new操作符
对象字面量(在使用时实际不会调用构造函数)
注意点:Object的属性名可以使用字符串
点表示法
方括号法
上述的两种方法没有本质的区别,但是方括号可以通过变量来访问属性
譬如:
如果属性中包含会导致语法错误的字符或者属性名字使用的是关键字或者保留字,可以使用方括号表示法。例如:
通过构造函数
通过字面量常数
需要注意的是:
在IE8之前的版本被解析成长度为三的数组,最后一位的值为undefined。但是在其他主流的浏览器中会被接卸成长度为2的数组。
length不是只读的,可以通过设置这个属性来添加新的项目或者删除项目
通过上面的例子我们发现,非数字索引不占数组的长度。
ECMAScript3
ECMAScript5
上面两种方法,第二种会效果更好,第一种方法可能会存在页面内有多个框架,如果数组从一个框架传入另一个框架,会存在不同的构造函数。
green在后
例如升序的比较函数可以是
删除 指定两个参数 第一个项的位置和要删除的项数
插入 三个参数:起始位置 0 要插入的项
替换 起始位置 删除的数量 要插入的项
对于上述的方法,传入的函数签名
上述两个方法都会迭代整个数组,不同的是二者的顺序。参数 调用的函数和并归的初始值
函数签名是:
函数对应的四个参数是:前一个值、当前值、索引、数组对象
创建方法
Date对象采用的是国际协调时间,不传递参数自动获取当前的日期和时间。
####创建特定的方法特定日期和时间的方法
创建方式
其中:
pattern是正则表达式,
flag是表示, g(global) | i(case-insensitive)| m(multiline)
两个参数必须都是字符串,必须对pattern的元字符进行双重转义。两种的区别在于字面量创建的只创建一个RegExp实例,但是调用构造函数每次都是创建新的实例。
所具有的实例属性:
global
ignoreCase
lastIndex
multiline
source
所具有的实例方法:
index:索引地址 input:应用正则表达式的字符串。
长属性名 | 短属性名
————|——–
input | \$_
lastMatch | \$\&
lastPattern | \$+
leftContext | \$`
multiline | \$*
rightContext| \$’
在JavaScript语言中函数的本质是对象
三种构造方式
函数声明
函数表达式
构造函数
第三种方式不推荐的原因是会导致两次解析代码。
因为在创建第二个同名函数的时候,实际上是覆盖了引用的第一个变量
首先解析器会率先读取函数声明,通过函数声明提升的过程,读取并将其添加到执行环境中。并使其在执行任何代码之前都可以用。但是函数表达式必须等到解析器执行到它所在的代码行时,才会真的被解析。
函数在ECMAScript中为对象,因此函数是可以作为值使用。可以将函数作为值传给另一个函数,也可以将函数作为结果返回。
例如:
当然我们也可以从函数里面返回另一个函数,下面举例sort函数的比较参数,该比较函数可以根据函数特定的属性排序。
在函数内部有两个特殊的对象:argument和this
argument是一个类数组对象,包含着传入函数的所有参数,其中argument包含着一个callee的变量,指向拥有函数的对象
因此我们的求阶乘的函数就可以表示为
这样我们就可以在函数内部将函数实现与函数名分离开,不必再耦合在一起。
this 引用函数据以执行的环境对象,在函数执行之前,this对象的值并不确定,可能会在代码执行的过程中引用不同的对象。其实,函数的名字只是一个包含指针的变量而已。不论是在全局的环境中,还是在对象中,指向的函数仍然是同一个。
caller 是ECMAScript规范的另外一个函数对象。这个属性保存着调用当前函数的函数的引用。
例如:
这段代码会在显示
为了实现更松散的耦合。我们也可以通过
需要注意的是
在ECMAScript5中定义了
函数包含的两个非继承的方法
下面的两个方法都是在特定的作用域中调用函数
上面两个函数的作用是可以扩充函数的作用域。不需要方法和对象之间进行耦合。
三种特殊的引用类型:
实际上,每当读取一个基本类型值得时候,后台就会自动创建一个对应的基本包装类型的对象,但是这个对象的生存期只存在在一行代码的执行瞬间,然后立即被销毁,这意味着我们不能对其添加属性和方法。
需要注意的是,直接调用转型函数和通过
字符方法
字符串操作方法
起始位置 第二个参数 最后一个字符后面
起始位置 第二个参数 字符数
起始位置 第二个参数 最后一个字符后面
具体区别主要是对于负数的处理不同,详情可以查询API
字符串位置的方法
上述两种方法都可接受第二个方法,表示开始搜索的位置,因此可以不断的增加index的位置来迭代搜索
模式匹配
字符串大小比较
内置对象的定义:有ECMAScript实现提供的,不依赖于宿主环境的对象,这些对象在程序执行之前已经存在。
URI编码
上述二者的主要区别是
window对象
Web浏览器都是将全局对象作为window对象的一部分来实现的。
Math对象的常见属性
Math方法
例如我们要在整个整数范围内随机选择一个数
值 = 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/
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',''] |
Array中length的用法
length不是只读的,可以通过设置这个属性来添加新的项目或者删除项目12345 | var array=new Array();array[0]=1;array[1]=2;array["index"]=3;alert(array.length);//2 |
检测数组的方式
ECMAScript312 | if(value instanceof Array){} |
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); |
所具有的实例属性:
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);} |
1234567 | function createCompareFunction(property){ return function(object1, object2){ var value1=object[property]; var value2=object[property]; return value1-value2; }} |
函数的内部属性
在函数内部有两个特殊的对象:argument和thisargument是一个类数组对象,包含着传入函数的所有参数,其中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/
相关文章推荐
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展->addRange 函数
- javascript 基本类型和引用类型的值【javascript高级程序设计】
- Javascript高级程序设计第二版第五章--引用类型--笔记
- JavaScript中值类型与引用类型实例说明
- 深入Atlas系列:Web Sevices Access in Atlas示例(7) - 编写JavaScriptConverter处理含有循环引用的类型
- javascript 高程二 第五章(引用类型)-上
- 值类型与引用类型 in JavaScript
- JavaScript之引用类型介绍
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展->clear 函数
- JavaScript中的值类型和引用类型
- JAVASCRIPT基础学习篇(6)--ECMAScript Basic2(EcmaScript 引用类型)
- JavaScript高级程序设计(第2版) 之 引用类型
- Javascript高级程序设计第二版第五章--引用类型--笔记
- ASP.NET AJAX 说明文档->客户端引用->全局命名空间->JavaScript 基础类型扩展->Array 类型扩展->add 函数
- Javascript 权威指南第五版 手记(1) 引用类型
- javascript高级程序第三版学习笔记【基本类型和引用类型】
- 每天进步一点点-JavaScript之ECMAScript(继JavaScript标准) 引用类型
- JavaScript中的值类型和引用类型
- javascript最常用的继承模式-寄生组合式继承——引用类型最理想的继承范式