有人说过,很多弯路到最后都成了直路,所有的坑到最后也都成了坦途;所谓的直路和坦途并不是摆在眼前的,都是不断的的绕弯过程中掰正捋直的,都是摔得鼻青脸肿之后填平的。从离开学校到北京工作也算有一年的时间了,只感觉这一年过的不算充实,也不算空虚,有所进步,但幅度不大,绕了些弯也踩了些坑,但还需继续前行才能看清自己的路。
在确确实实工作过一年之后,才认清了自己的不足,才发现前端这份工作也并没有开始时想的那么简单,也隐约知道了自己下一步该怎么去走才能不掉队,所以才有了这篇笔记。就像人们常说的“任何事都没有捷径可走”,所以觉得要想继续踏踏实实在前端这条路上奋力向前,就必须要不断充实自己,查缺补漏。
写了这么多其实是想说经过年后这段时间的面试,发现了好多问题,最主要的还是觉得自己基础知识掌握的不够扎实,有的时候只是着重于实现,确实也忽视了原理性的东西,正好也趁此机会,翻看一下去年买了但没看的js高程这本书,巩固一下基础,也去掌握一些“为什么”,不仅局限于“怎么做”。
这系列的笔记本着自己的初衷是每看完五章做一篇这样的总结笔记,不言而喻这篇便是前五章内容的一个总结,毕竟自己道行尚浅,没能力去做什么总结和知识梳理,只是对看过的知识点的一个去繁化简,可以让自己以后在忘却前边知识点的时候翻看一下,可以有一个快速整理回忆的作用,也希望不幸看到这篇笔记且觉得这是篇什么鬼东西的能给指点一二,若实在看不下去的,那就赶快点击右上角x关掉,以免影响接下来的心情,假若不小心帮助了其它比我还菜的人,那你也不用道谢,因为我的名字叫“雷锋”,我做好事不留名,只记笔记。
扯了这么多回到正题,往下便是对前五章知识点的一个简要归纳陈列:
第1章 JavaScript简介
主要讲述了JavaScript的起源:因何而生,如何发展,现状如何。涉及的概念:JavaScript与ECMAScript的关系,DOM(文档对象模型),BOM(浏览器对象模型)以及ECMA(欧洲计算机制造协会)和W3C(万维网)的一些相关标准。
1.1 JavaScript简史
1995年由布兰登.艾奇进行开发(LiveScript),同时支持浏览器和服务器使用,搭载在Netscape Navigator2浏览器上;1996年,Netscape借着1.0版本的成功之势,随即在其Netscape Navigator3中发布了1.1版本,同年微软也进入Web浏览器市场,在IE3中加入了名为JScript的JavaScript实现;1997年,ECMA为避免两大厂商所实现的不同版本JavaScript所暴露出的问题,将JavaScript 1.1作为蓝本制定了这门语言的实现标准,也就是ECMA-262(ECMAScript)标准,98年ISO/IEC也采用了这一标准。
1.2 JavaScript实现
一个完整的ECMAScript通常包括三个部分:ECMAScript(核心),DOM(文档对象模型),BOM(浏览器对象模型)。
1.2.1 ECMAscript
第一版与javascript1.1本质上相同,删除了针对浏览器的部分并进行了小的改动;第二版是对第一版的处理和加工为用作ISO标准;第三版(ES3)才是对标准的真正修改,涉及字符串处理、错误定义和数值输出,新增了对正则表达式、新控制语句、try-catch异常处理的支持,真正意义上成为了一门编程语言;第四版对标准进行了全面的修改,但因为变动太大 并没有被采用,而是采用了改动较小的一 版,也就是现在的ECMAscript5;就在2006年第六版ES6也正式颁布 ;ES7正在修改制定中。
ECMAscript兼容:要想成为ECMAscript的实现“必须支持ECMA描述的所有的“类型 值 对象 属性 函数以及程序语法和语义”;支持Unicode字符标准”。
还可以进行下列扩展:添加标准没有描述的“更多类型 值 对象 属性 函数”;支持标准没有定义的程序和正则表达式语法
浏览器对ECMAscript标准的支持:javascript1.1版本是标准的蓝本 所以navigator3对标准支持比较好 但是navigator4搭载的1.2版本在标准还没出来之前便已发布但是与标准有所不同所以兼容性有问题 4.06版本搭载 1.3版本实现了对标准的兼容,微软的IE4搭载Jscript模仿javascript开发的但是有很大差别所 以对标准支持也不好;08年五大浏览器都做到了对ECMAscript-262的兼容 IE8开始兼容ES5 IE9完全兼容ES5 firefox4也做到了兼容
1.2.2 文档对象模型(DOM)
是针对XML经过扩展用于HTML的应用程序编程接口(API),DOM把整个页面映射为一个多层节点结构 HTML或XML的页面的每个组成部份都是不同的类型节点,包含着不同类型的数据开发人员因此获得控制页面内容和结构的主动权,通过提供的API 可以任意删除、添加、替换、修改节点。
标准化原因:随着发展微软和网景公司两家各持己见 造成了浏览器互不兼容的局面 为了控制这样的局面负责制定web通信标准的w3c开始着手规划DOM标准
DOM标准:1998年DOM1级称为w3c推荐标准,主要有两个模块组装成:DOM核心 和 DOM HTML,DOM核心规定的是如何映射基于XML的文档结构,以便简化对文档中任意部分访问和操作DOM HTML在DOM核心基础上加以扩展 增加了针对HTML的对象和方法;DOM2级在原先基础上增加了鼠标和用户界面事件、范围、遍历 、通过对象接口 增加了对css的支持;DOM3级则进一步扩展了DOM
其他DOM标准:svg(可伸缩矢量图)、MathML(数学标记语言)、SMIL(同步媒体集成语言)
浏览器对DOM的支持:微软IE5支持DOM1级 ,但是IE67都不支持DOM,在随后的IE8中修复了这一问题;Netspace6中才支持DOM(mozilla 0.6.0)firefox3完全支持DOM1级几乎完全支持DOM2级
1.2.3 浏览器对象模(BOM)
没有相关标准每个浏览器都有自己的实现标准,随着HTML5发展正在制定这方面的标准
本质上讲 BOM只处理浏览器窗口和框架 但人们习惯上把针对浏览器的javascript扩展算作BOM的一部分:
1.弹出新浏览器窗口的功能
2.移动 缩放 关闭浏览器的功能
3.提供浏览器详细信息的navigator对象
4.提供浏览器所加载页面详细信息的location对象
5.提供用户浏览器分辨率详细信息的screen对象
6.对cookies的支持
7.像XMLHttpRequest 和 IE的ActiveXObject这样的自定义对象
1.3 JavaScript版本(只有firefox还遵循最初的版本编号)
第2章 在HTML中使用JavaScript
主要介绍了如何在HTML中使用JavaScript创建动态网页。涉及内容:在HTML中嵌入JavaScript的方式,JavaScript的内容类型及其与<script>的关系。
分两种:嵌入脚本和外部脚本(可维护性好 可缓存 适应未来)
2.1 <script>标签元素
html4.01定义了六个属性:
src:包含要执行的外部文件,如果设置了该属性,便不会读取器包含的代码
async: 立即下载脚本,不影响其他资源加载
charset: 表示通过src设置的代码字符集,浏览器会忽略它 很少使用
defer: 脚本可以延迟到文档解析完显示之后再执行
language:已废弃
type:text/javascript
标签的位置:一般是放在head标签中 旨在把所有外部文件放在一起集中加载 但是意味着要加载完所有文件 才开始解析页面 会影响页面加载速度 所以尽量将script放在body标签中 页面内容后边
延迟脚本:defer表示在页面加载解析完成后再执行脚本 页面一加载遍加载 但是延迟执行 有先后顺序 根据属性出现先后执行
异步脚本:async告诉浏览器立即下载 但不影响页面构造 但是执行没有先后顺序 不确定那个先执行
在XHTML中的用法:有些符号不能用 比如>或者<号不能被解析需要用相应的HTML实体(<)来代替或者另外一种解决方案是:来包裹需要执行的代码
文档模式:标准模式 准标准模式 混杂模式
<noscript>元素:在不支持javascript或者说禁用javascript的浏览器中显示提示
第3章 基本概念
讨论了JavaScript语言的基本概念,包括语法和流控制语句。介绍了与其它语言语法的相同与不同之处以及与内置操作符有关的类型转换问题。
3.1 语法:大量借鉴C及其他类C(java和perl)语言
3.1.1 区分大小写 :javascript一切(变量 函数名 操作符)区分大小写
3.1.2 标识符: 变量、函数、属性的名字或者函数的参数(第一个字符必须是字母 下划线 或者一个💲符号;其他字符可以是字母 下划线 数字或美元符号;标识符中的字母也可以是ASCII或者Unicode 但是不推荐使用)
推荐写法:驼峰命名法,不能把关键字、保留词 true、false、null 用作标识符
3.1.3 注释: // 单行注释 /* 多行注释 */
3.1.4 严格模式:ES5中引入了严格模式 为javascript定义了一种不同的解析和执行模式,对ES3中不确定的行为将得到处理 ,不安全的行为抛出错误 在顶部书写’use strict’可开启严格模式 ,也可以指定函数在严格模式下执行,在函数题顶部添加’use strict’(支持严格模式的的浏览器IE10、Firefox 4+、Safari 5.1+、Opera 12+、Chrome)
3.1.5 语句:ES中语句以分号结尾,没有分号,解析器会自动判断结尾,但是推荐使用分号有利于后期对代码压缩
3.2 关键字、保留字:es中描述了一组具有特殊意义的关键字 ,还描述了另外一组还没定义的但将来可能会被用作关键字的保留字
3.3 变量:ECMAscript中的变量是松散类型的 也就是说变量只是内存中保存值的占位符而已通过var来声明变量 ,若没有声明直接复制,则会创建一个全局变量(可一次定义或初始化多个变量,用“ ,”来分隔)
3.4 数据类型:Number、String、Boolean、undefined、null(基本类型)和引用类型
3.4.1 typeof操作符:判断给定变量属于那种数据类型,该操作符无法判断对象具体属于什么引用类型,可使用instanceof来判断
undefined 这个变量值未被定义
string 字符类型
number 数字类型
boolean 布尔类型
object 对象或者null
function 函数
3.4.2 undefined类型:值被声明但没赋值,这个变量的值就是undefined
3.4.3 null 类型:空的对象指针 ,实际上undefined值派生自null ,所以在普通比较时undefined == null返回true,但是两者是不同的,null代表需要保存对象的变量还没有保存对象,而undefined却没有必要显示的设置,全等操作时返回false
3.4.4 boolean类型:布尔类型 只有true和false两个值 ,虽只有两个值,但是所有类型的值都有与其等价的值,所有类型的值都可以调用Boolean()转型函数,转换成对应布尔值:只有数字0、NaN、空字符串、null、undefined转换成false
3.4.5 number类型:用IEEE754来表示整数和浮点数 ,ES中定义了不同的数值字面量格式正常使用的十进制、以0开头的八进制、以0x开头的十六进制表示,javascript中可以保存+0和-0但其实是相等的
<1> 浮点类型:ES会不失时机地将浮点型转换成整数(若小数点后没有跟任何数值)在进行算数计算的时候,会丢失精度(舍入误差)
<2> 数值范围:ES中能保存的最大()最小值(5e- 324)保存在Number.MAX_VALUE和 Number.MIN_VALUE中;如果某次计算返回(+/-)Infinity(正负无穷大)则不能进行下一次计算 ,可以通过isFinite()函数判断一个值是不是无穷大,可以通过Number.NEGATIVE_INFINITY和Number.POSITIVE_INFINITY获取其值
<3> NaN:不是数值,可以通过isNaN()函数来判断一个值是否不是数值 ,NaN不等于不小于不大于任何值
<4>数值转换:Number()、parseInt()、parseFloat()
Number()转型函数,默认调用该函数
1.boolean值 true转换为1,false转换为0
2.null转换为0,undefined转换为NaN
3.字符串遵循以下规则:
空字符串转换为0
纯数字字符串转换为对应数字,忽略前置0
有效的浮点字符串,转换为对应浮点值或略前置0
包含有效十六进制字符 ,转换为相等的十进制数值 ,除此之外转换为NaN
4.对象:调用valueOf()方法 按上述规则转换 ,若转换为NaN ,则调用toString()方法按上述规则转换
parseInt():可以识别各种整数格式 ,可以是别第一个值为数字的字符串,可接受两个个参数 第一个为要转换的值、第二个为进制格式
parseFloat():也可以识别第一个字符为数值的字符串,直到无效的小数点为止
3.4.6 String类型:由16位Unicode字符组成的字符序列,字符串一旦创建便不可改变,若想改变,是先销毁原先保存的值重新赋值
转型:toString()方法 数值、布尔、字符串、对象都有该方法,数值调用该方法可接受一个参数(进制),可返回输入进制格式的字符串,null和undefined没有该方法,默认转型方法String()
3.4.7 Object类型:ES中对象其实是一组数据和功能的集合, 是其他实例的基础,它具有的属性和方法更具体的实例中都继承了
创建方式(两种):var o = new Object();(new操作符) var o = {};(对象字面量)
Object的每个实例都具有以下属性:
Constructor :保存着创建该对象的函数,对于上边实例的构造函数是Object
hasOwnProperty(propertyName):用于检测给定的属性是否属于当前实例对象(不是实例原型中),属性必须以字符串形式传入
isPropertyOf(Object):检测传入的对象是否是另一个对象的原型
propertyIsEnumberable(propertyName):检测传入的属性是否能够用for-in枚举 ,需要以字符串形式传入
toLocaleString():返回对象字符串表示
toString():返回对象字符串表示
valueOf():返回对象数值、字符串或布尔表示
3.5 操作符:一组用于操作数据值的操作符
3.5.1 一元操作符:递增和递减(前置和后置)、一元加和减
前置(++n/--n):n值加一,返回值n+1/n-1; 后置(n++/n--):n值加一,返回n
一元加(+): 数值无变化,非数值相当于调用Number()转型函数
一元减(-): 数值变为负数,非数值相当于调用Number()转型函数
3.5.2 位操作符
用于最基本层次上,按内存中表示数值的位来操作数值。先将64位数值转换为32位执行操作再转成64位。对于有符号整数32位中前31位表示整数最后一位表示符号,0代表正数,1代表负数。负数同样以二进制存储,使用的是二进制补码,求二进制补码(取反加1)。
1.按位非(~):执行按位非返回数值的反码。
2.按位与(&):将两个数值按位对齐比较(两值都为1得1,否则得0)。
3.按位或(|):将两个数值按位对齐比较(两值都为0得0,否则得1)。
4.按位异或(^):将两个数值按位对齐比较(相同得0,不同得1)。
5.左移和右移(<<、>>):左移增大(num*2(n)),右移减小(num/2(n))
5.无符号右移(>>>):正数与右移无区别,负数无符号右移用0来填充空位不是用符号位的值填充。
3.5.3 布尔操作符
布尔操作符共有三个:逻辑非(!):先将操作数转换为布尔型再取反,逻辑与(&&):短路操作、如果第一个操作数能决定结果就不会再对第二个操作数求值,逻辑或(||):和逻辑与思路相同。
3.5.4 乘性操作符
1.乘法(*):操作结果超出范围Infinity或者-Infinity;一个操作数是NaN,返回NaN;Infinity与0相乘返回NaN;与非0输相乘返回Infinity或-Infinity;若操作数不是数值调用Number()转换后操作。
2.除法(/):如果0/0返回NaN;如果非零有限数被零除返回Infinity;Infinity被Infinity除返回NaN;Infinity被任何非零数除返回Infinity。
3.取模(%):被除数无穷大除数有限大的值,返回NaN;被除数有限大除数0,返回NaN;Infinity除Infinity返回NaN。
3.5.5 加性操作符
1.加法(+):如果Infinity加-Infinity,返回NaN;如果两个操作数都是字符串,则将其拼接;如果一个是字符串一个是非字符串,先转换成字符串然后拼接。
2.减法(-):如果Infinity减Infinity,返回NaN;如果-Infinity减-Infinity,返回NaN。
3.5.6 关系操作符
关系操作符:大于(>)、小于(<)、大于等于(>=)、小于等于(<=)、相等(==)、不等(!=)、全等(===)、
不全等(!==)
比较时的转换规则:
*两个操作数都是数值,执行数值比较。
*两个数值都是字符串,比较两个字符串相应的字符编码值。
*如果一个操作数是数值,将另一个转换为数值比较。
*如果一个操作数是对象,调用valueOf()方法,用得到的结果按照前边规则比较,没有valueOf()方法,则调用toString()方法。
*如果一个数是布尔值,则先将其转换为数值比较。
相等和不相等是先转换再比较,全等和不全等不转换直接比较(值和类型都相等则为全等)。null和undefined相等但是不全等。
3.5.8 条件操作符(三目)
var max = (num1 > num2)?num1 : num2;可代替简单的if(){}else{}
3.5.9 赋值操作符
加等(+=)、减等(-=)、乘等(*=)、除等(/=)、模等(%=)、左移/赋值(<<=)、有符号右移/赋值(>>=)、无符号右移/赋值(>>>=)
3.5.10 逗号操作符:一条语句中执行多个操作
3.6 语句
ECMAscript规定了一组语句(流控制语句),语句定义了ECMAscript中主要的语法,通常使用一或多个关键词来完成给定的任务。
3.6.1 if语句
if(codition){ //自动调用Boolean()函数转换为布尔值
alert(1);
}else{
alert(2)
}
3.6.2 do-while语句
do{
alert(1); //代码至少执行一次
}while(codition);
3.6.3 while语句
while(codition){ //满足条件执行
alert(1)
}
3.6.4 for语句
for(var i = 0; i < arr.length; i++){ //遍历数组
alert(arr[i]);
}
3.6.5 for-in语句
for-in语句是精准的迭代语句,可以用来枚举对象的属性。
for(var proName in window){
alert(proName);
}
3.6.6 lable语句
使用lable语句可以在代码中添加标签,将来用于被break或是continue引用,一般要和for等循环语句配合使用。
例: start:for(var i = 0;i < 5; i++){
alert(i)
}
3.6.7 break和continue语句
break和continue用于循环中精确控制代码的执行。break会强制退出循环执行循环后边的语句,continue会立即退出本次循环,执行下一次循环。
break和continue可以lable语句联合使用,从而返回代码中特定的位置。多出现在循环嵌套中。
var num = 0;
start:
for(var i = 0; i < 10; i++){
for(var j = 0; j < 10; j++){
if(i == 5 && j == 5){
break start;
}
num++;
}
} //num = 55;
3.6.8 with语句
with语句将代码作用域设置到一个特定的对象中。
格式: with(experssion)statement;
例:var qs = location.search.substring(1);
var hostName = location.hostname;
var url = location.href;
with(location){ //简化多次编写同一个对象
var qs = search.substring(1);
var hostName = hostname;
var url = href;
}
严格模式下不允许使用with语句,会导致性能下降,增加调试难度,不建议使用
3.6.9 switch语句
与if语句类似,流控制语句。
格式:switch(expression){
case value:
statement;
break; //执行完break跳出,若省略break;顺序往下执行下一个case的代码块
case value:
statement;
break;
default:
statement;
}
3.7 函数
对任何语言来说函数都是核心的概念。封装一项专门任务的步骤清单的代码段。
function funcName(arg0,arg1){
statement;
return ;
}
3.7.1 理解参数
ECMAscript中函数参数与其他语言中函数参数有所不同,ECMAscript不介意传进几个参数和什么类型。参数内部是用一个数组来表示,在函数体内通过arguments对象来访问参数数组。
arguments对象与数组类似但不是Array实例,具有length属性,可以通过方括号语法访问每个元素。函数参数传递的都是值不是引用。
3.7.2 没有重载
ECMAscript没有函数重载的概念,两个同名函数只会保留最后声明的。可以通过函数内条件控制来实现。
第4章 变量、作用域和内存问题
探讨了JavaScript如何处理松散类型的变量,原始值与引用值之间的差别,与变量执行环境相关的内容以及垃圾(内存清理)回收机制。
JavaScript变量与其他语言的变量有和大区别,变量松散类型的本质,决定了它是在特定时间保存特定值的一个名字而已,变量的值和类型可以在生命周期中改变。
4.1基本类型和引用类型的值
ECMAscript变量包含两种不同数据类型的值,基本类型和引用类型。基本类型就是简单的数据段,五种基本类型,引用类型就是多个值构成的对象。JavaScript中不允许直接访问内存中的位置,也不能直接操作对象的内存空间。实际上操作对象是操作的对象的引用
4.1.1 动态的属性
定义基本类型和引用类型类似,创建一个变量为其赋值。但当值保存到变量中后,不同类型的值操作大不相同,引用类型可以定义属性和方法,而基本类型不可以。
4.1.2 复制变量值
基本类型:
引用类型:
4.1.3 传递参数
ECMAscript中函数的参数是按值传递的。
function setName(obj){
obj.name = "tom";
obj = new Object();
obj.name = "jhon";
};
var pers = {name : "name"};
setName(pres);
console.log(pers.name); //tom 如果不是按值传递,那么pers.name应该是jhon
4.1.4 检测类型
检测数据是不是基本类型 typeof
引用类型判断具体是什么类型的对象 instanceof
4.2 执行环境及作用域
执行环境:定义了变量和函数有权访问的其他数据,决定他们各自的行为。每个执行环境对应有一个与之关联的变量对象,环境中定义的所有变量和函数都保存在变量对象中。
全局执行环境是最外层的执行环境,宿主环境不同,表示执行环境的对象也不同,浏览器中全局环境被认为是window对象,所有全局变量和函数都是作为window对象那个的属性和方法创建的。某个执行环境中所有代码执行完毕后,环境销毁,其变量和函数也随之销毁,全局环境则在浏览器关闭后销毁。
每个函数都有自己的执行环境,执行流进入一个函数,函数环境被推入环境栈中,执行完后弹出栈。
代码在环境中执行时,会创建变量对象的一个作用域链。用途:保证对执行环境有权访问的所有变量和函数有序访问。作用域链前端,是当前执行代码所在环境的变量对象。若环境是函数,其活动对象作为变量对象。 活动对象最开始只包含arguments一个变量。作用域中另一个变量对象来自(外部)环境,下一个变量对象来自包含环境,这样一直延续到全局。
4.2.1 延长作用域链
延长作用域链的两种方式:
try-catch语句的catch块
with语句
4.2.2 没有块级作用域
JavaScript没有块级作用域。
1.声明变量:在全局声明的变量任何地方都可用,局部环境中定义的变量只能在局部环境中访问,未声明直接赋值会创建一个全局变量。
2.查询标识符:在某个环境中读取或写入引用某个标识符时,会从作用域链前端开始查找,向上逐级查询,如果找到变量就绪,未找到会抛出错误。
4.3 垃圾收集
JavaScript具有自动垃圾收集机制,执行环境会负责管理代码执行过程中使用的内存。
4.3.1 标记清除
JavaScript中最常用的垃圾收集方式就是标记清除,当变量进入环境就标记为进入环境,离开环境再标记为离开环境,最后垃圾收集器会把不再被环境中变量引用的变量的标记清除。
4.3.2 引用计数
不太常见的一种回收机制是引用计数,跟踪每个值被引用的次数。当声明一个变量并将引用类型的值赋给该变量时,引用次数为1,同一个值又赋给另一个变量时,引用次数加1,若包含该值的变量又引用了其他值时,引用次数减1,当引用次数为0时回收,问题:循环引用无法回收。
4.3.3 性能问题
垃圾收集器是周期性运行的
4.3.4 管理内存
不再使用的对象尽量用null来清空引用,以便回收内存
第5章 引用类型
详尽的介绍了JavaScript中所有的引用类型及相应方法,以及从浏览器角度给了介绍。
引用类型的值(对象)是引用类型的一个实例。引用类型是一种数据结构,用于将数据和功能组织在一起,通常被称作类(不恰当),JavaScript没有类和接口这种结构。
5.1 Object类型
大多数引用类型都是Object类型的实例。两种创建方式:new操作符后跟Object构造函数,另一种是字面量方式(字面量方式实际上不会调用Object构造函数)。Object也是ECMAscript中使用最多的一个类型。
5.2 Array类型
Array类型(数据的有序列表)是除Object类型最常出现的类型,与其他语言有所不同,每一项可放任何类型的值,数组大小是可以动态调整的。
两种创建方法:用new操作符 var arr = new Array(); 字面量:var arr = [1,2,3]; length属性代表数组长度。
5.2.1 检测数组
1. instanceof 但是如果不是唯一的全局执行环境,存在两个以上不同版本的Array构造函数,如果从一个框架向另一个传递数组,传入的数组与第二个框架中原生数组分别具有各自不同的构造函数。
2. Array.isArray(value) 确定某个值到底是不是数组,不管它在哪个全局环境中创建的。
5.2.2 转换方法
所有对象都有valueOf()、toString()和toLocaleString()方法。调用数组的toString()方法返回有数组中每个值字符串形式拼接而成的以逗号分隔的字符串;调用valueOf()方法返回还是数组。
join()方法接受一个参数,返回包含所有数组项的字符串,分隔符是接受的参数。
5.2.3 栈方法(修改原数组)
ECMAscript提供了一种让数组类似于其它数据结构的方法。栈是一种LIFO(后进先出)的数据结构。push()和pop()方法可以实现类似栈的行为。
push()方法接受任意数量的参数,把它们逐个添加到末尾。
pop()方法从数组末尾移除最后一项,减少数组length值,返回移除项。
5.2.4 队列方法(修改原数组)
队列数据结构的访问方式是FIFO(先进先出),结合shitf()和push()方法可模拟队列结构。同时还有一个unshift()方法是从数组开始添加任意项,可与pop()方法结合使用从反方向模拟队列。
5.2.5 重排序方法(修改原数组)
重排序方法:reverse()和sort()方法
reverse()方法反转数组顺序,sort()方法是按照Unicode方式排序,可接受一个函数参数,进行自定义排序。
5.2.6 操作方法
操作方法:
concat():拼接数组,参数可接受任意值或者数组。 //未修改原数组,返回新数组
slice():截取数组,接受两个参数,起始和结束位置下标。如果只传一个参数则截取到结束为止,可传负数。 //同上
splice(): //修改原数组
删除:接受两个参数,要删除的第一项的位置,删除的项数
插入:只指定三个参数,起始位置,0(要删除的项数),要插入的项(任意项)
替换:只指定三个参数,起始位置,2(要替换的项数),替换的项(任意项)
5.2.7 位置方法
ECMAscript5添加了两个位置方法:indexOf()从前往后查找,找到返回位置索引;从后往前查找lastIndexOf(),找到返回位置索引;查找不到返回-1,这两个方法(全等查找)都接受两个参数:要查找的项和查找起始位置索引。
5.2.8 迭代方法
ECMAscript5位数组定义了五个迭代的方法。每个方法都接受两个参数:要在每一项上运行的函数和(可选的)运行该函数的作用域对象-----影响this值。传入这些方法中的函数接受三个参数:数组项的值,该项在数组中位置,数组对象本身。
*every():对数组中每一项运行给定函数,若该函数对每一项都返回true,则返回true
*filter():对数组中每一项运行给定函数,返回该函数返回true的项的数组
*forEach():对数组中每一项运行给定函数,没有返回值
*map():对数组中每一项运行给定函数,返回每次函数调用的结果组成的数组
*some():对数组中每一项运行给定函数,该函数对任一项返回true则返回true
5.2.9 归并方法
ECMAscript5中两个缩小数组方法:reduce()从前往后;reduceRight()从后往前,都会迭代数组所有项,构建一个返回值。
这两方法接受两个参数:一个是在每一项上调用的函数和(可选)作为缩小基础的初始值。函数可接受四个值:前一个值、当前值、项的索引、数组对象。
例:var arr = [1,2,3,4];
var sum = arr.reduce(function(prev,cur,index,array){ //10
return prev + cur;
});
5.3 Date类型
ECMAscript中Date类型是在Java中java.util.Date基础上构建的。使用UTC类型(1970年1月1日零时经过的毫秒数)
操作方法:
Date.parse():接收一个表示日期的字符串参数(月/日/年 英文月名 日,年 英文星期几 月 日 年 时:分:秒 时区 YYYY-MM-DDTHH:mm:ss:sssZ)。例:var time = new Date(Date.parse("May 25,2004"));
Date.UTC():返回表示日期的毫秒数,var time = new Date(Date.UTC(2000, 4, 5, 17, 55, 55));
5.3.1 继承的方法
与其他引用类型一样Date类型重写了toString()、toLocaleString()和valueOf()方法。toLocaleString()方法会按照与浏览器设置的地区相适应的格式返回日期和时间;toString()方法返回带有时区信息的日期和时间。不同浏览器有差异。valueOf()方法返回日期的毫秒数。
5.3.2 日期格式化方法
日期格式化方法:
toDateString():以特定于实现的格式显示星期几、月、日和年
toTimeString():显示时、分、秒和时区
toLocaleDateString():以特定于地区的格式显示星期几、月、日和年
toLocaleTimeString():以特定于实现的格式显示时、分、秒
toUTCString():以特定于实现的格式显示完整UTC日期(toGMTString()类似,保证向后兼容)
5.3.3 日期时间组件方法
获取方法 设置方法
getTime()返回毫秒数 setTime(毫秒)以毫秒数设置日期
getFullYear()取得四位数年份 setFullYear()设置日期年份
getMonth()返回日期中月份 从0开始算起 setMonth()设置日期月份
getDate()返回日期月份中天数 setDate()设置日期月份中天数
getDay()返回日期中星期几 setDay()设置日期中星期几
getHours()返回小时,从0开始算起 setHours设置小时
getMinutes()返回分钟数 setMinutes()设置分钟数
getSeconds()返回秒 setSeconds()设置秒
getMiliseconds()返回毫秒数 setMiliseconds()设置毫秒
5.4 RegExp类型(暂时没看)
ECMAscript通过RegExp类型支持正则表达式。var reg = /pattren/flags;
pattren:正则表达式 g:全局匹配模式 i:不区分大小写 m:多行模式
5.5 Function类型
每个函数都是Function类型的实例,与其它引用类型一样有属性和方法,由于函数是对象,函数名实际上是指向函数对象的一个指针。不推荐用new操作符来定义函数,因为会解析两次影响性能。(第一次常规解析,第二次解析传入构造函数的字符串)
5.5.1 没有重载
将函数名想象成指针就很好理解。
5.5.2 函数声明与函数表达式
解析器在向执行环境中加载数据时,对函数声明和函数表达式并非一视同仁,而是先读取函数声明(声明提前),待解析器执行到它所在代码行时才解析表达式。
5.5.3 作为值的函数
ECMAscript中函数本身就是变量,所以函数可以作为值来说使用。既可以向参数那样传递又可以作为另一个函数的结果返回。
5.5.4 函数内部属性
函数内部有两个特殊的对象:arguments和this。arguments类数组对象保存着传入函数的所有参数,虽然主要用途是保存函数参数,但它还有一个属性callee,该属性是一个指针 ,指向拥有这个arguments对象的函数。
例:经典阶乘函数
function factorial(num){
if(num <= 1){
return 1;
}else{
return num * factorial(num - 1);
}
}
定义阶乘一般用到递归算法,如上所示。在函数有名字且名字不变的情况下,上边这样写没问题,但问题是这个函数的执行与函数名紧紧耦合在一起。
function factorial(num){
if(num <= 1){
return 1;
}else{
return num * arguments.callee(num - 1);
}
}
如上这样写,没有再引用函数名,无论引用函数时使用什么名字,都能正常完成递归调用。
函数内部另一个特殊对象就是this,this引用的是函数据以执行的环境对象(若当在网页全局作用域中调用函数,this对象引用的就是window)。
ECMAscript5也规范了另一个函数对象的属性:caller,保存着调用当前函数的函数的引用。若果是在全局作用域中调用,则是null。
function outer(){
inter();
}
function inter(){
alert(inter.caller) //显示outer函数源代码
}
重写之后:
function outer(){
inter();
}
function inter(){
alert(interarguments.callee.caller) //实现了更松散的耦合
}
5.5.5 函数属性和方法
ECMAscript中函数是对象,每个函数都包含两个属性:length和prototype。length表示函数希望接受命名参数个数;对于引用类型来说,prototype是保存着它们所有实例方法的真正所在。比如说toString()和valueOf()方法就是保存在prototype中,只不过是通过各自的实例对象访问罢了。prototype属性不可枚举,所以使用for-in无法发现。
每个函数包含两个非继承来的方法:apply()和call()。用途都是在特定的作用域中调用函数,实际上相当于设置函数体内this对象的值。
apply():接受两个参数,一个是在其中运行函数的作用域,另一个是参数数组(可以是Array实例也可以是arguments对象)。
例:function sum(num1,num2){
return num1 + num2;
}
function callSum1(num1,num2){
return sun.apply(this,arguments); //传入arguments对象
}
function callSum1(num1,num2){
return sun.apply(this,[num1, num2]); //传入数组
}
callSum1(10,10); //20callSum2(10,10); //20
call():和apply用法相同只是接受参数方式不同,参数this一样,其余参数都是一个个直接传递给函数。call(this,num1,num2)
用途:可以扩充函数赖以运行的作用域 好处:对象与方法不需要有任何的耦合关系
window.color = "red";
var o = {color: "blue"};
function sayColor(){
alert(this.color);
};
sayColor.apply(this); //red
sayColor.apply(window); //red
sayColor.apply(o); //blue
ECMAscript5中还定义了一个方法:bind(),该方法会创建一个函数的实例,其this值会被绑定到传给bind()函数的值。
window.color = "red";
var o = {color: "blue"};
function sayColor(){
alert(this.color);
};
var newFun = sayColor.bind(o);
newFun(); //blue
5.6 基本包装类型
为了便于操作基本类型的值,ECMAscript还提供了三个特殊的引用类型:Boolean、Number和String,与其它引用类型相似,但又具有各自基本类型的特殊行为。每当读取一个基本类型时,后台会创建一个对应的包装类型对象,方便我们调用一些方法处理数据。
引用类型与基本包装类型主要区别是对象的生存期,new操作符创建的引用类型实例,在执行流离开当前作用域之前一直保存在内存中,自动创建的包装类型,只存在一行代码执行的瞬间。
5.6.1 Boolean类型
var falseObj = new Boolean(false);
var result = falseObj && true;
alert(result); //true 布尔表达式中所有对象都转为true typeof falseObj 返回 object
5.6.2 Number类型
与Boolean类型一样,也重写了valueOf()、toString()和toLacaleString()方法。
将数值转换为字符串方法:n.toFixed(2)返回保留小数点后两位的字符串
格式化数值方法:n.toExponential(1)返回指数表示法(e表示法)
数值最合适的格式:n.toPrecision(2)返回合适格式的表示法
5.6.3 String类型
String类型是字符串的对象包装类型。String类型实例都有一个length属性。
String类型操作方法:
1.字符方法:str.charAt(i) 返回指定位置字符 str.charCodeAt(i) 返回指定位置字符Unicode码
2.字符串操作方法:
concat():拼接字符串,返回拼接后的字符串
创建新字符串方法:
slice():返回被操作字符串的子字符串,含头不含尾
substr():返回被操作字符串的子字符串,第一个参数起始位置,第二个是返回个数
substring():返回被操作字符串的子字符串,含头不含尾
3.字符串位置方法:
indexOf()和lastIndexOf():接受两个参数,要搜索的字符串,开始位置;返回与之匹配的字符串位置,无匹配返回-1
4.trim()方法:
创建一个字符串副本,删除前置和后缀空格
5.字符串大小写转换方法:
toLowerCase():转小写
toUpperCase():转大写
6.字符串模式匹配方法:
match():与调用RegExp的exec()方法本质相同,接受一个参数,要不是正则表达式,要不是RegExp对象
var text = "bat cat kat gat";
var pattern = /.at/;
var mat = text.match(pattern);
console.log(mat);
//["bat", index: 0, input: "bat cat kat gat"]
search():唯一参数与match()一样,返回字符串中第一个匹配项的索引,未找到返回-1
replace():接受两个参数,第一个可以是正则表达式或者字符串,第二个可以是字符串或者函数
split():基于指定分隔符将字符串分隔成多个子字符串,放到一个数组中,可接受第二个参数,指定数组大小
7.localeCompare()方法:
比较两个字符串,如果字符串在字母表应该排在字符串参数之前,返回一个负数;如果等于字符串参数返回0;如果排在字符串 参数之后,返回一个正数
8.fromCharCode()方法:
接受一个或多个字符编码,转换成字符串,与charCodeAt()方法执行相反的操作。
9.HTML方法:建议不要使用
5.7 单体内置对象
内置对象:不依赖宿主环境,在ECMAscript程序执行之前即已经存在,共有11个内置对象,其中包含两个单体内置对象:Global和Math。
5.7.1 global对象
不属于任何其他对象的属性和方法,最终都是它的属性和方法。所有在全局作用域中定义的变量和方法都属于global对象。
1.URI编码方法
encodeURI()和encodeURIComponent()方法对URI编码,以便发送给浏览器。encodeURI()不会对本身属于URI的特殊字符编码;而encodeURIComponent()则会对它发现的所有非标准字符进行编码。
decodeURI()和decodeURIComponent()对应的解码方法。
2.eval()方法
eval()方法想一个完整的ECMAscript解析器,将传入的代码解析,把结果插入到原位置。
3.global对象的属性
4.window对象
ECMAscript没指出如何直接访问global对象,但web浏览器将这个全局对象作为window对象的一部分加以实现。
取得global对象的方法:
var global = function(){
return this;
}
5.7.2 Math对象
1.Math对象属性:
2.min()和max()方法:
确定一组数值中的最大值或最小值。
Math.max.apply(Math,arr)可以获得一个数组中的最大值。
3.舍入方法:
Math.ceil():向上舍入
Math.floor():向下舍入
Math.round():标准四舍五入
4.Math.random()方法:
返回0至1之间的随机数,不包含0和1。
Math.floor(Math.random()*可能的数值+第一个可能的值):
Math.floor(Math.random()*10+1)返回1倒10之间随机数,第一个可能值1
5.其他方法: