您现在的位置是：首页 > 前端

当前栏目

javascript高级程序设计

JavaScript 高级程序设计

2023-09-11 14:13:56 时间

第一章 Javascript简介

一。javascript 是由三个不同部分组成

1.核心ECMAscript

2.文档对象模型DOM

3.浏览器对象模型BOM

二.ECMAscript大致来说规定下列组成部分

语法

类型

语句

关键字

保留字

操作符

对象

历史：ECMAscript开始与web没有依赖关系，web浏览器是ECMA实现可能的宿主环境之一，其他宿主环境还有Node(服务端的javascript实现平台)，和Adobe Flash

三。文档对象模型DOM

四。浏览器对象模型BOM

第二章在HTML中使用Javascript

一。使用<script>的方法有两种

1.直接页面嵌入

包含在<script>的元素会自上而下的依次解释，在解释器对<script>元素内部的代码求值完毕以前，页中的其余内容不会被浏览器显示。

注意，不要再代码上写</script>，否则浏览器认为是结束标志，如

function a(){

alert("</script>");

}

解决办法可以使用转义字符\，如

function a(){

alert("<\/script>");

}

2.包含外部javascript

在解释器对<script>元素内部的代码求值完毕以前，页中的其余内容不会被浏览器显示。

如果在XHTML中可以省略</script>，如

src元素可以包含来自外部域的javascript，让<script>和<img>元素非常相似，这一点有好处又坏处，在访问不能自己控制的其他服务器上面，假如遇到恶意程序员，改了里面文件的代码。。。

注意：无论怎样包含代码，只要不存在defer和async属性，浏览器会根据出现的不同顺序解释，第一个解释完才第二个。然后第三个。。。

二。<script>的位置

<! DOCTYPE html>

<html>

</head>

<body>

</body>

<html>

这样放意味着必须等到所有javascript代码都下载，解释，完成后，才能开始呈现页面的内容(浏览器遇到body标签才开始呈现内容)，如果很多javascript代码，会导致浏览器呈现页面时候明显延迟

，这段时间会一片空白，要避免则第二种方法

<! DOCTYPE html>

<html>

</head>

<body>

</body>

<html>

这样在解释javascript之前就会把页面呈现给用户

三，延迟脚步，异步脚本

1.defer

html4.01定义了defer属性，意思是脚本会被延迟到页面都解释完再运行

<! DOCTYPE html>

<html>

</head>

<body>

</body>

<html>

虽然放在head标签里面，但是浏览器会遇到</html>后才解释，一般来说第二个延迟脚本会在第一个执行后再执行，但是有时并不一定，所以最好就一个延迟脚本

defer至适合于外部src的脚本文件（HTML5已经明确规定），但是还有些浏览器并不支持，所以最好办法还是把<script>放在页面底部最佳选择

2.async

1.和defer类似都只适用于外部脚本

2.不同时标志async的脚本不保证他们先后顺序执行，defer一般来说还按顺序，这个肯定不按顺序

三。在XHTML的语法

四。嵌入代码与外部文件

使用外部文件有以下优点

1.可维护

2.可缓存浏览器根据具体的设置缓存链接的所有外部文件，也就是说，两个页面使用同一个文件，那么该文件只需要下载一次

3.适应未来因为通过外部文件无需使用上面的XHTML或注视hack，XHTML包含外部文件语法是相同的

五。文档模式

开始（混杂模式、标准模式）

后来（混杂模式、（标准模式。准标准模式））准标准模式与标准模式非常类似，差异可以忽略不计

如果文档开始没有使用任何文档声明，则所有浏览器使用开启混杂模式

1.开启标准模式

2.开启准标准模式，可以使用过渡型和框架集型

六。<NOSCRIPT>元素

1.浏览器不支持javascript

2.支持但是脚本被禁止

<html>

</head>

<body>

<p>本页面需要开启javascript</p>

</noscript>

</body>

<html>

假如禁止了javascript，p里面的文字会显示，假如允许，p里面的文字永远不会显示

第三章基本概念

本章内容语法数据类型流控制语句函数

目前 ECMA-262定义的第三版是各个浏览器实现最多的一个版本，第五版是接下来的实现。到2011年底还没完全实现，本文以第三版为基础，并以第五版变化作出说明

一。语法

1.区分大小写

2.标示符-变量，函数，属性，参数的名字

@首字母是字母、下划线或者美元符号$

@其他可以使字母、数字、下划线、和$

@不能用关键字、保留字、true，false、和null做标示符

3.注释

// 单行注释

*/ 块注释

4.严格模式

ECMAscript 5引入，是一种定义不同的解释和执行模式，把ECMAscript 3不确定的行为处理掉，而且某些不安全的操作也抛出错误，启用办法是顶部添加

"use strict"

在函数内部也可以，如

function aa(){

"use strict"

//函数体

}

5.语句

@ ;结尾

@ 代码块，如

if(true){

}

6.关键字和保留字

7.变量

ECMAscript的变量是松散类型(就是可以保存任何类型的数据)，用var来定义

@ var mes --mes为undefined

@ var mes=“hi”; mes=11； --可以，但是不推荐

@注意，用var操作符定义的变量将成为定义该变量的作用域中的局部变量

如在函数里面

function a(){

var mes="HI";//局部变量

}

alert(mes);//错误

function a(){

mes="HI";//全局变量

}

alert(mes);// "HI"

省略了var，默认成了全局变量，但是不推荐

@一条语句定义多个如

var mes="hi",

found=11,

age=false;

@严格模式下，不能为eval或者arguments定义变量

8.数据类型

@5种简单数据类型

Undefined

Null

Boolean

Number

String

@1种复杂类型

Object

@typeof操作符---对于一个值使用typeof操作符可能使用下面字符串

"undefined"-------该值未定义

"boolean" -------布尔

"string" -------字符串

"number" -------数字

"object" -------对象

"object" -------Null

"function" -------函数

例子

var mes="aaaaaa";

alert(typeof mes); ---"string"

alert(typeof(mes)); --"string"

alert(typeof 95); --"number"

@typeof操作符的对象可以使变量或者数值字面量

@typeof是操作符而不是函数，所以括号不是必须的

@@有时候typeof会返回一些疑惑但是技术上正确的值

@typeof null返回object，因为null被认为是一个空对象引用

@有些浏览器(Safai5-或Chrome7-)使用typeof 正则表达会返回function ，其他则object

@@技术角度上，函数在ECMA中script中时对象，不是一种数据类型，因此用typeof区分函数和其他对象

8.数据类型-Undefined

@只有一个值就是undefined

@使用var声明但是未加以初始化时就是undefined

var mes；

alert(mes==undefined) --true；

var mes=undefined；

alert(mes==undefined) --true；

var mes；

//下面变量为声明

// age

alert(mes) --“ undefined”

alert(age) -- 报错

注意未声明和为初始化的概念

@@困惑的是

var mes；

//下面变量为声明

// age

alert(typeof mes) --"undefined"；

alert(typeof age) --"undefined"；

对于未声明和为初始化都返回undefined

@@所以运用上面这点最好显示初始化变量是最好的明确选择，因为这样，当typeof就会返回undefined字符串，那么我们就知道该变量没有被声明而不是未初始化

如

var me==“”；

//下面变量未声明

// age

alert(typeof mes) --"String"；

alert(typeof age) --"undefined"；因为所有变量都初始化了，所以放回undefined肯定是未声明，而且这样不会报错

8.数据类型-Null

@也是只有一个值-null

@是一个空对象引用所以typeof Null是"object"

@实际上，undefined值是派生于null的，所以

alert(null==undefined); //true

@如果定义的是对象，最好先赋值为null，因为只需要检查null就知道已经是否保存一个对象的引用

var car=null;

if(car!=null){

}

@@无论在什么时候没必要把一个值显示设置为undefined，

@@null却相反，只要为明确保存什么对象时候，则设置为null

@@有助于区分null和undefined。

8.数据类型-Boolean

@只有两个值 true、false

@与数字值不是一回事，true不一定等于1，false不一定等于0

@区分大小写，True和False是标示符

@ECMA所有值都与Boolean有等价的值，可以使用Boolean()转换函数

如

var mes="hello";

var a= Boolean(mes);

规则

数据类型	转为true	转为false
Boolean	true	false
String	非空字符串	""(空字符串)
Number	非0，包括无穷大	0和nan
object	任何对象	null
Undefined	n/a	undefined

@if语句自动执行Boolean转换

var mes="DF"；

if(mes){

}

8.数据类型-Number

@整数和浮点型

@十进制，八进制，16进制

八进制第一位为0，后面为0到7，超过则前导0被忽略，后面为实际你只解释

var a=070 //八进制 56

var b=079 //八进制无效，解释为十进制 79

十六进制前面为0x，后面0到9，a到f(可以大写)

var a =0xA --十六进制的10

var b=0x1f ----、十六进制的31

在进行算术计算时，所有八进制十六进制的值都会转换成十进制数值

@浮点数

var a=1.1；

var b=.1; --有效但是不推荐

@由于浮点数需要的内存空间是整数值的两倍，所以ECMAscript有时会把浮点数转换为整数值

var a=1. 解释为1

var b =10.0; 解释为10

@科学计数法

var a=3.125e7 等于31250000

@@浮点数的精度为17位小数，进行算术计算时精确到远远不够整数

0.1+0.2不是0.3，而是 0.3000000000000004

所以

if(a+b==0.3){

alert("you got 0.3");

}

永远不会成立，不要这样做

@数据范围

1.Number.MIN_VALUE和Number.MIAX_VALUE，超出这两个范围则转换Infinity 正无穷 - Infinity 负无穷

2.Infinity 正无穷 - Infinity 负无穷，某次计算返回这两个数，则无法参数下次计算

判断处于最大和最小范围之间可以使用isFinite()函数

var a=Number.MIAX_VALUE+Number.MIAX_VALUE;

alert(isFinite(a));//false;

@NaN值-非数值

1。任务语言除以0都会报错，停止程序

2。ECMAscript中则返回NaN,而不会停止

3。NaN不等于NaN alert(NaN==NaN);--false

4。isNaN 判断这个数是否"不是数值"，

如

alert(ｉｓＮａＮ（ＮａＮ)　)　　　　　　　　//ｔｒｕｅ

alert(ｉｓＮａＮ（１０))　　　　　　　　　//ｆａｌｓｅ　１０是一个数值

alert(ｉｓＮａＮ（"１０")　)　　　　　　　//ｆａｌｓｅ　　可以转换成１０

alert(ｉｓＮａＮ（"ｂｌｕｅ")　)　　　　　//ｔｒｕｅ　　　这个字符不能转换成数值　

alert(ｉｓＮａＮ（ｔｒｕｅ)　)　　　　　　　//ｆａｌｓｅ　　可以转换成１

＠＠ isNaN也可以用于对象，首先调用对象的valueof()，确定是否能返回转换成数值，若不能，基于这个返回值再调用toString()方法，再测试返回值。

@转换函数

Number() 任何数值

ParseInt() 把字符串转换成数值

parseFloat() 把字符串转换成数值

@@Number() 转换规则

1.若Boolean 则转换成0和1

2.若数字值，不变

3.null 则0

4.undefined 则NaN

5.对象则首先调用对象的valueof()，确定是否能返回转换成数值，若不能，基于这个返回值再调用toString()方法，再测试返回值

5.字符串则如下

1.只包含数字(带正负)，则转换为十进制，1--1, 123--123, 011--11

2.浮点和上面一样

3.若十六进制，0xf 则转换成十进制

4.空字符串，则为0

5. 其余则NaN

如下

var a=Number("DFSDF" ) --NaN

var b=Number("" ) -- 0

var c=Number( "000011") -- 11

var d=Number( true) --1

@@ParseInt() 转换规则

1.忽略前面空格，找到第一个字符串，若不是数字或者正负号，则NaN

2.如果第一个是数字，则一直解释下去，直到解释完或者遇到非数字

如1234aaa则转换为1234

22.5则转换为22

3.八进制，十六进制也能识别(严格模式会有问题)所以增加参数ParseInt(a，b)，a为要转换的值，b为进数

var a=ParseInt("10",2) 10按二进制

var b=ParseInt("10",8) 10按八进制

var c=ParseInt("10",10) 10按十进制

var d=ParseInt("10",16) 10按十六进制

因为在严格模式ParseInt() 转换会造成混乱，所以最好加上参数

@@ParseFloat() 转换规则

1.和ParseInt一样，不过第一个小数点有效，第二个无效，如22.34.5转换为22.34

2.只解释10进制，所以没有第二个参数

3.如果字符窜包含一个可解释为整数的数(没有小数点或小数点后都是0)，ParseFloat() 会返回整数

var a=ParseFloat"1234aaa") //1234

var b=ParseFloat("0xA") // 0

var c=ParseFloat("22.5") //22.5

var d=ParseFloat(22.334.5) // 22.334

var e=ParseFloat("0987.4") //987.4

var f=ParseFloat("3.125e7") // 31250000

8.数据类型-String

@String类型用于表示0或多个 16位Unicode字符组成的字符序列------字符串

@""或''都一样，PHP则不同

@字符字面量--转义序列

字面量	含义
\n	换行
\t	制表
\b	空格
\r	回车
\f	进纸
\\	斜杠
\'	单引号，在用单引号表示的字符串中使用，如'He said，\'HEY.\''
\"	双引号，在用双引号表示的字符串中使用，如"He said，\"HEY.\""
\xnn	以十六制代码nn表示一个字符(n为0到F)。例如，\x41表示"A"
\unnnn	以十六制代码nnnn表示一个Unicode字符(n为0到F)。例如，\u03a3表示希腊字符"Σ"

＠任何字符串长度都可以用ｌｅｎｇｔｈ属性获取长度(如果字符串包含双字节字符，那么可能不会精确)

＠ECMAScript 中字符串是不变的。创建之后若改变则先销毁再填充

@转换为字符串

1.toString(),几乎每一个值都有该方法，但是 null，undefined 没有该方法

数字的时候可以加入参数指定二进制八进制十进制十六进制

var a=10

a.toString() --10

a.toString(2) -- 1010

a.toString(8) --12

a.toString(10) --10

a.toString(16) --a

2.String()，任何类型都可以包括null，undefined

1.如有有toString()，则调用

2.如果是null,则返回"null"

3.如果是undefined，则返回"undefined"

@最简单的转换时直接与字符串""相加

8.数据类型-Object

@一组数据和功能的集合--var 0=new Object();

@是所有它的实例的基础，其中包裹一下方法

1.constructor：保存用于创建当前对象的函数，var 0=new Object();构造函数就是Object();

2.hasOwnProperty(propertyName)：用于检查给定的属性在当前对象实例中(而不是在实例的原型中)是否存在。参数必须是字符串，如：o. hasOwnProperty("name");

3.isPrototypeOf(Object)：用于检查传入的对象是否是传入对象的原型

4.propertyIsEnumerable(propertyName):检查指定属性是否能用for-in语句，参数为字符串

5.toLocalString()

6.toString()

7.valueOf():返回对象的字符串、数值或布尔值表示

@@宿主对象可能继承也可能不继承Object，浏览器中的对象，如BOM和DOM中的对象都是宿主对象

5.操作符

5.1一元操作符

5.2位操作符

5.2布尔操作符

@一共有三个非、与、或

@逻辑非用！表示

1.与任何值都能返回一个布尔值，先转换为布尔值再求反

2。规则

&如果是对象，则false

&如果是空字符串，则true

&非空字符串，则false

&数值0，true

&非0包裹Infinity，则false

&null，true

&NaN,true

&undefined，true

如：

alert(!0) true

alert(!NaN) true

alert(!123) false

@逻辑与用&& 表示

1.可以应用任何类型的操作数，不仅仅是布尔值

2.在有一个操作数不是布尔值的情况下，逻辑与操作不一定返回布尔值，一下规则

&如果第一个操作数对象，则返回第二个操作数

&如果第二个操作数是对象，则只有第一个操作数为true的情况下才会返回该对象

&如果两个操作数都是对象，则返回第二个操作数

&如果有一个数为null，则返回null

&如果有一个数为NaN，则返回NaN

&如果有一个数为undefined，则返回undefined

3.逻辑与属于短路操作，如果第一个数能够决定结果，则不会对第二个求值

如

var a=true;

var b=(a&&bbbbbbbbbbbbb)；bbbbbbbbbbb未定义会发生错误

若

var a=false;

var b=(a&&bbbbbbbbbbbbb)；bbbbbbbbbbb未定义不会发生错误

@逻辑或用||表示

1.与逻辑与类似，如果有一个操作数不是布尔值，逻辑或也不一定返回布尔值

&如果第一个操作数对象，则返回第一个操作数

&如果第一个操作数求值为false，则返回第二个操作数

&如果两个操作数都是对象，则返回第一个操作数

&如果有两个数为null，则返回null

&如果有两个数为NaN，则返回NaN

&如果有两个数为undefined，则返回undefined

3.也是短路操作

5.4

1.乘性操作符-- *

&处理特殊值遵守下列规则

1.如果两个值都是数值则常规计算，若超过ECMA范围，则Infinity和-Infinity

2.如果有一个是NaN，则结果是NaN

3.如果Infinity与0相乘，则NaN

4.如果Infinity与非0相乘，则是Infinity或者-Infinity

5.如果是Infinity与Infinity则Infinity

6.如果一个数不是数值，则在后台调用number()转换其数值，再计算

除法操作符-- 斜杠/

求模--%

5.5

1.加法操作符---+

如果都是数值则按照常规加法，然后根据下列返回

&如果一个为NaN,则结果为NaN

&如果Infinity加Infinity，则Infinity

&如果-Infinity加-Infinity则-Infinity

&如果Infinity加-Infinity 则NaN

如果有一个是字符串，那么按照下面

&如果两个操作数都是字符串，则前后拼接

&如果有一个是对象、数值或布尔值，则调用它们的toString()方法取得相应字符串值，如果按照前面字符串规则

&对于undefined和null，则分别调用string()函数取得字符串"undefined" 和"null"

alert(5+5); //10

alert(5+"5"); //"55"

2.减法操作符--- -

如果都是数值则按照常规加法，然后根据下列返回

&如果一个为NaN,则结果为NaN

&如果Infinity加Infinity，则NaN

&如果-Infinity加-Infinity则NaN

&如果Infinity加-Infinity 则Infinity

&如果-Infinity加Infinity 则-Infinity

如果有一个是字符串、布尔值、null或undefined，则在后台调用Number()函数将其转换成数值，再根据前面做减法，如果转换成NaN，则结果为NaN

&如果有一个是对象,则调用对象的ValueOf()方法以取得表示对象的数值，如果是NaN，则结果是NaN,如果对象没有ValueOf()方法，则调用其toString()方法并将其得到的字符串转换为数值

5-trur==4 因为true转换为1

NaN-1=NaN

5-3=2

5-""=5 因为""转换成0

5-"2"=3 因为2转换成2

5-null=5 因为null转换成0

@@如果两个操作数都是字符串呢？

5.6 关系操作符

@小于<, 大于>, 小于等于<=, 大于等于>=,这几个关系操作符都返回一个布尔值

var result=5>3 //true

var result=5<3 //false

@与ECMAscript与其他操作符一样，当操作数使用非数值时候也要转换或完成某些奇怪的操作，规则：

&如果两个都是数值则数值比较

&如果两个都是字符串，则按照字符串对应的字符编码值

&如果一个数十操作数，则将另外一个操作数转换为一个数值，然后数值比较

&如果一个操作数十对象，则调用这个对象的valueof()用结果按照前面比较，如果没有ValueOf方法，则调用toString(),并用得到结果执行比较

&如果一个是布尔值，则先转换成数值再比较

&&比较字符串时候，大写字母的字符编码全部小于小写字母的字符编码

var result ="Black" < "alphabet" //true

&&如果比较两个数字字符串

var result="23"<"3" //true,2的编码是50,3的编码是51

var result="23"<3 //false，字符23会转成23，数值与字符串比较时，字符串都会转换成数值

var result="a"<3 //false，因为"a"被转换成了NaN

var result=NaN<3 //false,因为任何操作数与NaN比较，结果都是false

var result= NaN >=3 //false

5.7

1.相等操作符

@相等和不相等 ==和！=

1.都会先转换操作数(强制转换)，然后再比较相等性

在转换不同类型时候，要遵守下列

1.如果有一个操作数是布尔值，则比较前转换为数值----false转换成0，true转为1

2.如果有一个操作数是字符串，另外一个是数值，则先字符串转换成数值再比较

3.如果一个操作数是对象，另外一个操作数不是，则调用对象的ValueOf方法用得到的基本类型值再比较

另外

1.null和undefined是相等的

2.比较值钱不能将null和undefined转换成其他值

3.如果一个数是NaN,相等则返回false，不相等则返回true(两个操作数都是NaN，相等操作符也返回false，因为按规定NaN不等于NaN)

4.如果两个操作数都是对象，则比较他们是不是同一个对象，如果都是指向同一对象，则返回true，否则false

表达式	值
null ==undefined	true
"NaN"==NaN	false
5==NaN	false
NaN==NaN	false
NaN!=NaN	true
false==0	true
true==1	true
true==2	false
undefined==0	false
null==0	false
"5"==5	true

2.全等和不全等 === ！==

@除了比较之前不转换操作数之外，全等与不全等没有什么区别

var result=("55"==55); '//true 因为转换后相等

var result=("55"===55) //false 因为不同数据类型不相等

@null==undefined会返回true，但null===undefined 返回false ，因为不同类型的值

5.8条件操作符

variable=boolean_expression ?trueValue:falseValue

如：

var max=(num1>num2) ? num1: num2;

5.9赋值操作符

5.10逗号操作符

@声明变量

var num1=1,num2=2.num3=3;

赋值-在用于赋值时，逗号操作符总会返回表达式中的最后一项，如

var num=(5,1,4,8,0);//num的值为0

6.语句

6.1 if 语句

@ECMAScript会自动调用Boolean()转换函数表达式

6.2 do - while

6.3 while语句

6.4 for语句

var count =10;

for(var i=0;i<count;i++)

{

alert(i)；

}

由于ECMAScript中不存在块级域，因此在循环内部定义的变量可以再外部访问，如

var count =10;

for(var i=0;i<count;i++)

{

alert(i)；

}

alert(i)；//10

3.无限循环

for(; ;){

dosonmething()；

}

6.5 for-in 语句

for(var propName in window){

dociment.write(propName );

}

如果迭代的对象的变量值为null或undefined，for-in语句会抛出错误

ECMAScript 5 更正了，但是为了兼容，循环时候做好判断

6.5 label语句

6.6break和continue语句

@与label语句联合使用

6.7 with 语句--

@将代码块的作用域设置到一个特定对象中

@定义with语句的目的主要是为了简化多次编写同一个对象

var qs=location.search.substring(1);

var hostName= location.hostname;

var url= location.href;

上面那几行代码包含location对象，使用with语句可以写成

with(location){

var qs=search.substring(1);

var hostName=hostname;

var url=href;

}

严格模式会语法错误，大量使用with会性能下降，还是建议不要用

6.8 switch语句---全等操作符

switch(i){

case 25:

case 35: //25和35 合并了

alert(111);

break;

case 45:

break;

default:

alert("default");

}

@ECNAScript 相比其他语言，可以再switch语句中使用任何类型，无论是字符串还是对象都可以

@case的值不一定是常量，也可以是变量甚至表达式

var num=25;

switch(true){

case num <0:

alert(0);

break;

case num <=10 && num >0:

alert(1);

break;

default:

alert(2);

}

7.函数

function Name(arg0 ，arg1，.......argN){

statements

}

@ECMAScript 中的函数在定义时不必制定是否返回值

@ 另外return 语句也可以不带任何返回值，这种情况下，函数停止执行后将返回undefined值

function Name(arg0 ，arg1，.......argN){

retrun;

}

@推荐做法要么永远返回值，要么永远不返回，否则会混乱

严格模式下限制

1.不能把函数命名为eval或arguments；

2.不能把参数命名为eval或arguments；

3.不能出现两个命名参数同名的情况

2.参数

@即便你定义的函数只接收两个参数，调用函数的时候未必一定传2个函数，可以传1,个或者3个，4个

@ECMAScript 中的参数在内部是用一个数组来表示，函数接收这个数组，而不在乎有多少个元素

@实际上，在函数体内可以通过arguments对象来访问这个参数数组

@其实arguments对象只是与数组类似(并不是Array实例)，因为可以通过索引访问元素，arguments[0]第一个，arguments[1]第二个，因此

function sayHi(name,message){

alert("hello:"+name+","+ message);

}

可改为

function sayHi(name,message){

alert("hello:"+argument[0]+","+ argument[1]);

}

@ argument得length属性

function howManyArgs(){

alert(argument.length);

}

howManyArgs("123",45); //2

howManyArgs(); //0

howManyArgs(12); //1

@可以利用这点

function doAdd(){

if(argument.length==1){

//do

}else if(argument.length==2){

//do

}

@有趣的一点

function doAdd(num1,num2){

argument[1]=10;

alert(argument[0]+num2);

}

&每次执行这个doAdd函数都会重写第二个参数，将第二个值修改10.因为argument对象中的值会自动反映到对应的命名参数，所以修改argument[1]自动修改num2，结果值都相同，不过他们的内存空间是独立的，但是值就同步。

&如果只是传入一个参数，那么argument[1]设置的值不会反映到命名参数中，因为argument对象的长度是有传入参数决定，而不是定义函数时候决定

&没有传递的命名参数将自动赋予undefined值，像定义变量但是没初始化一样。

@@严格模式下，上面的赋值会无效，即使设argument[1]=10，num2还是undefined，其次重写argument还会报错

@@没有重载

综上所述，ECMAScript函数没有重载，如果定义多个，则名字只属于最后一个定义的函数

第四章变量、作用域和内存问题

javascript变量松散类型的本质，可以定义任何类型和数据的规则，变量的值及其数据类型可以在脚本的生命周期内改变。

1.基本类型和引用类型

@基本类型指的是简单的数据段，引用类型值指那些可能由多个值构成的对象，

@基本数据类型：Underfined、Null、Boolean、Number、和String，都是按值访问

@引用类型，与其他语言不同，javascript不允许直接访问内存中的位置，不能直接操作对象的内存空间，引用类型的值是按引用访问的

1.1动态的属性(基本类型与引用)

var persion=new Object();

persion.name="Nicholas";

alert(persion.name);//"Nicholas";

var name="Nicholas";

persion.age=27;

alert(persion.age);//undefined ，不报错，但不推荐

1.2复制变量值(基本类型与引用)

@基本类型复制变量值时

var num1=5;

var num2=num1;

num2中的5与num1中的5是完全独立的，该值只是num1中5的一个副本。这两个值参与操作互不影响

复制前

	Number类型

num15	5

复制后

	Number类型
num2	5
num1	5

@引用类型复制变量值时

var obj1=new Object();

var obj2=obj1;

obj1.name="aaa";

alert(obj2.name); //aaa

复制引用变量时候。实际上就是复制一个指针，复制变量结束后，两个变量上将引用同一个对象，改变一个对象则会影响另外一个对象

1.3传递参数

ECMAScript中的所有函数的参数都是按照值传递。就是说函数外部的值复制给函数内部的参数，就和吧一个值复制到另外一个值的变量一样。基本类型复制就像基本类型，引用类型复制就是引用类型

引用传递就是传递该引用，而不是复制多一份变量，值传递就是复制多一份变量。

@基本类型时候

functio addTen(num{

num +=10;

return num;

)

var count =20;

car result =addTen(count);

alert(count);//20,没有变化

alert(result );//30

@引用类型时候

function setNmae(obj){

obj.name="aaa";

}

var persion=new Object();

setName(persion);

alert(persion.name); //aaa

为了证明是复制多一个，而不是直接传递引用，再看下面例子

引用传递就是传递该引用，而不是复制多一份变量，值传递就是复制多一份变量。

function setNmae(obj){

obj.name="aaa";

obj=new Object();

obj.name="bbb";

}

var persion=new Object();

setName(persion);

alert(persion.name); //aaa

用引用的复制原理就能理解出来了，局部对象obj会在函数完毕后自动毁灭。

1.4 检测类型 instanceof

@用typeof操作符确定一个变量是字符串、数值、布尔值、还是undefined的最佳工具，如果是对象或者null。则返回object

@检测基本类型用typeof是得力助手，检测引用类型，很想知道什么类型对象所以用instanceof操作符

alert(person instanceof Object); /变量是Object吗

alert(person instanceof Array); /变量是Array吗

alert(person instanceof RegExp); /变量是RegExp吗

规定，所有应用类型的值都是Object的实力，所以检测一个引用是否Object类型时，instanceof都会返回true，检测基本类型就是返回false，因为基本类型不是对象

@@typeof的兼容性-对正则应用typeof会返回function，在ie和firefox则object

1.5 执行环境及作用域

@每个执行环境都有一个与之关联的变量对象，全局化解是最外围的一个执行环境，ECMAscript根据宿舍不同，执行环境的对象也不一样，web浏览器全局环境就认为是window对象，该环境被销毁，保存在其中的变量和函数就随之摧毁

@函数也有自己执行环境，执行流进入函数时，函数环境就会被推入环境栈中，函数执行完毕后，栈会将环境弹出，把控制权还给之前的执行环境

@当代码在一个环境执行时候，会创建变量对象的一个作用域链。母的是保证执行环境有权访问所有变量和函数的有序访问

@作用域最前端，始终是当前执行单面所在环境的变量对象，如果环境是函数最开始时候只包含一个变量，即是arguments对象（这个对象在全局环境是不存在的），下一个变量来自包含(外部)环境，而再下一个变量则来自下一个包含环境，这样一直延续到全局执行环境，全局执行环境始终是作用域中的最后一个对象

@标示符解释是沿着作用域一级一级搜索的，搜索过程从作用域最前端开始，然后聚集向后回溯，直接找到（找不到就报错）

var color="blue";

function changeColor(){

color="red";

}

changeColor();

alert(color);

这个例子中，changeColor作用域链包含两个对象：自己的变量arguments和全局变量对象，因为在作用域链向上搜索找到它

var color ="blue";

function changeColor(){

var anotherColor="red";

function swapColors(){

var tempColor= anotherColor;

anotherColor=color;

color= tempColor;

//这里可以访问color、anotherColor和tempColor

}

//这里可以访问color、anotherColor不能访问tempColor

swapColors（）；

}

这里有三个执行环境：全局环境，changeColor局部环境，swapColors局部环境。

1：全局环境有一个变量color，一个函数changeColor，

2：changeColor的局部环境有一个名为anotherColor变量和函数swapColors，它能向上搜索访问全局环境中的变量函数。

3：swapColors的局部环境有变量tempColor，这变量只能在这个环境环境中访问，因为其他环境向上不能搜索到。而在swapColors都可以访问两个环境中的所有变量，因为它们是是swapColors的符父执行环境

解释：内部环境可以通过作用链范文所有外部环境，外部环境则不能访问内部环境

1.6 延长作用链

在以下语句，作用链将会延长

1.try-catch中的catch语句

2.with语句

兼容问题，不推荐

1.7 没有块级作用域

@if和for

if(true){

var color="blue";

}

alert(color);//true

在其他语言if执行后所定义的变量最自动销毁，但在javascript中变量会添加到当前的执行环境(在这里是全局环境)，所以。

for也是一样

@声明变量

1。使用var声明的变量会自动添加到最接近的环境中，函数内部就是函数的局部环境，(在with语句，最最近就是函数环境,with兼容问题和性能不建议使用就不描叙)

2.如果初始化变量没有使用var声明，该变量就会自动添加到全局环境(注意在严格模式中初始化未经声明的变量会导致错误)

下面两个例子（不是严格模式）

function add(num1,num2){

var sum=sum1+sum2;

return sum;

}

var result=add(10,20); //30

alert(num); //会报错，因为函数里面为sum定义了var，那么sum就添加到函数的作用域

function add(num1,num2){

sum=sum1+sum2;

return sum;

}

var result=add(10,20); //30

alert(num); //30，因为sum初始化没有使用var关键字，于是调用完爱到底add()后，会添加到全局环境，所以可以执行不报错

注意：(注意在严格模式中初始化未经声明的变量会导致错误

@查询标识符

1.搜索会在作用链的最前端开始，向上一级一级搜索，知道匹配了该标示符，停止

var color="blue";

function getColor(){

var color="red";

return color;

}

alert(getColor()); //red

注意，如果不使用window.color都无法访问全局color对象

1.8垃圾回收

@标记清除

@引用计数

@性能问题

@管理内存

第五章引用类型(1)

1.object类型

1.1创建方法

@new

var person =new Object();

person .name="Nicholas";

person .age=29;

@对象字面量

var person={

name:"Nicholas",

age:29

};

对象字面量,属性也可以使用字符串如：

var person={

"name":"Nicholas",

"age":29

};

或

var person={}; //与new Object();相同

person.name="Nicholas";

person .age=29;

1.2访问对象属性

1.点表示法

person.name

2.方括号访问对象的属性

person[“name”]

方括号主要优点就是可以通过变量来访问属性

var a="name";

person[a]；正确

persion.a 错误

如果属性名包括会都导致语法错误的字符，也可以用方括号，如

person["first name"]="Nicholas" //因为包含空格，使用点表示法会错误

一般除了用变量访问属性，否则还是用点表示比较方便

2.Array类型

@创建方法有两个

1.构造函数

var colors=new Array();

var colors=new Array(10); //创建一个数量为10的

var colors=new Array("1","2"); 创建一个数量为2的内容是1,2的数组

2.数组字面量

var colors=["red","blue"];

var colors=[]; //空数组

var colors=["1","2",]; //不推荐，可能创建一个数量为2，或者3的数组

var colors=[,,,,,]; //不推荐，可能创建一个数量为4，或者5的数组

3，读取或设置数组值，使用方括号并使用基于0的索引

var colors=["red","blue","green"]; //定义一个数组

alert(colors[0]); //显示第一项

colors[2]="black"; //修改第三项

colors[3]="brown"; //新增第四项

4.length属性-不是只读的，可以从数组末尾一处项目或向数组增加项

var colors=["red","blue","green"];

color.length=2； //移除数量为2之后的所有项

alert(colors[2]) ; //undefined

var colors=["red","blue","green"];

color.length=4； //新增项，新增的项都会是undefined值

alert(colors[3]) ; //undefined

技巧：利用length属性很方便在数组末尾添加新项目

var colors=["red","blue","green"];

colors[colors.length]="black";

colors[colors.length]="brown";

这样每次都会在末尾添加值

5.当把一个值放在超过当前数值大小的位置时，会重新计算长度值

var colors=["red","blue","green"];

color[99]="black"；

alert（color[colors.length]） //100

alert(colors[3]); //undefined 位置3到98实际上不存在，访问会返回undefined

@检测数组

1.对于一个网页。或者一个全局作用域，使用instanceof操作符就能得到满意结果

if( value instanceof Array){

//dosomething

}

问题是成立的条件假定只有一个全局执行环境。如果网页包含多个框架，那么实际上存在两个以上不同的全局执行环境，从而有两个不同版本的Array构造函数。如果一个框架向两一个框架传入一个数组，那么传入数组在第二个框架中原生创建的分布不同构造方法。所以诞生出Array.isArray()，这个方法目的确定到底是不是数组，而不管在那个全局环境中创建

if(Array.isArray(valeu)){

//dosomething

}

@转换方法

1.所有对象都有toLocaleString、toString、valueOf方法

var color=["red","green","ye"];

alert(color.toString()); //red,blue,green

alert(color.valueof()); //red,blue,green

alert(color); //red,blue,green alert要接受字符串参数，所以在后头调用了toString方法

2.join()方法

var color=["red","green","ye"];

alert(color.join(",")); //red,blue,green

alert(color.join("||")); //red||blue||green

如果join()不加参数或者加入undefined，则用逗号作为分隔符

如果某一项值是null或者undefined，那么该值的toLocaleString、toString、valueOf方法返回都是空字符串方法

@栈方法--LIFO

1.push() 接受任意数量的参数，添加到末尾，并返回修改后的长度

2.pop() 从数组末尾移除最后一项，并减少数组的length，返回移除的项

var colors=new Array();

var count=colors.push("red","blue"); //推入两项

alert(count); //2

count=colors.push("black"); //推入另外一项

alert(count);//3

var item=colors.pop();//取得最后一项

alert(item); //black

alert(colors.length); //2

@队列方法--FIFO

1.shift() 移除数组的第一项，并返回该项，同时数组长度减1，用shift和push()模拟FIFO

var colors=new Array();

var count=colors.push("red","blue"); //推入两项

alert(count); //2

count=colors.push("black"); //推入另外一项

alert(count);//3

var item=colors.shift();//取得第一项

alert(item); //red

alert(colors.length); //2

2.unshift() 在数组前端添加任意个项，并返回长度，unshift和pop可以模拟反FIFO

var colors=new Array();

var count=colors.unshift("red","green"); //推入两项

alert(count); //2

var count=colors.unshift("black"); //推入另1项

alert(count); //3

var item=colors.pop();//取得最后一项

alert(item); //green

alert(colors.length); //2

@重排序方法

1.reverse 倒序

var values=[1,2,3,4,5];

values. reverse ();

alert(values); //5,4,3,2,1

2.sort() -默认没参数情况下按升序排列数组项，sort()会调用toString()转型方法，然后比较得到的字符串，即使数组每一项都是数字，但是比较的都是字符串。

var values=[0,1,5,10,15];

values. sort();

alert(values); //0,1,10,15,5

sort()可以接受一个比较函数作为参数，以决定排序方法

如

function compare(value1,value2){

if(value1<value2){

return -1;

}else if(value1>value2){

return 1;

}else{

return 0;

}

var values=[0,1,5,10,15];

values. sort(compare);

alert(values); //0,1,5,10,15

@操作方法

1.concat()，基于当前数组创建新数组，不加参数只是复制，加上则复制添加

var colors=["red","green","blue"];

var colors2= colors.concat("yellow",["black","brown"]);

alert(colors); //red,green,blue

alert(colors2); //red,green,blue, yellow, black, brown

2.slice(),基于当前数组的一个或多个项创建一个新数组

1个参数-指定位置到末尾

2个参数是起始之间，但是不包括最后一项

var colors=["red","green","blue","yellow","purple"];

var colors2= colors. slice(1);

var colors3= colors. slice(1,4);

alert(colors2); //green, blue, yellow, purple

alert(colors3); //green, blue, yellow

3.splice 主要用途向数组的中部插入项，始终返回一个数组，该数组包含从原始数组中删除的项

&第一个参数从该位置开始

&第二个参数删除多少项

&第三四五。。个参数要在该位置插入的项

var colors=["red","green","blue"];

var removed=colors. splice(0,1);

alert(colors); //green,blue

alert(removed); //red,移除的一项

removed= colors.splice (1,0，"yellow","orange")//从位置1开始插入两项

alert(colors); //green，yellow，orange，blue

alert(removed);//返回空数组，因为没有移除项

removed= colors.splice (1,1，"red","purple")//从位置1开始插入两项

alert(colors); //green, red，purple，orange，blue

alert(removed); //yellow,移除的一项

@位置方法

1.indexOf和lastIndexOf,不存在则返回-1

2.全等于

3.一个参数：查找的项

4.两个参数：起点位置和查找的项

var numbers=[1,2,3,4,5,4,3,2,1];

alert(numbers. indexOf(4)); //3

alert(numbers. lastIndexOf(4)); //5

alert(numbers. indexOf(4,4)); //5

alert(numbers. lastIndexOf(4,4)); //3

var person={name:"a"};

var people=[{name:"a"}]

var morePeople=[person];

alert(people.indexOf(person)); //-1 因为不全相等，尽管值相等

alert(morePeople.indexOf(person)); //0 因为是相同对象，全等于

@迭代方法

第一个参数：函数(数组项的值，该项的index，数组对象本身)--3个参数

第二个参数：this(可选)

1.every() ----对数组每一项运行给定的函数，如果该函数对每一项都返回true，则返回true

2.some() ----对数组每一项运行给定的函数，如果该函数对任一项返回true，则返回true

3.filter() ----对数组每一项运行给定的函数，返回函数返回true的项组成的数组

4.map() ----对数组每一项运行给定的函数，返回每次调用的结果组成的数组

5.forEach() ----对数组每一项运行给定的函数

&every()和some()

var numbers=[1,2,3,4,5,4,3,2,1];

var everyResult= numbers.every(function(item,index,array){

return (item>2);

});

alert(everyResult); //false

var everyResult= numbers.some(function(item,index,array){

return (item>2);

});

alert(everyResult); //true

&filter()

var numbers=[1,2,3,4,5,4,3,2,1];

var everyResult= numbers.filter(function(item,index,array){

return (item>2);

});

alert(everyResult); // [3,4,5,4,3]

&map

var numbers=[1,2,3,4,5,4,3,2,1];

var everyResult= numbers. map(function(item,index,array){

return (item * 2);

});

alert(everyResult); // [2,4,6,8,10,8,6,4,2]

&forEach

var numbers=[1,2,3,4,5,4,3,2,1];

var everyResult= numbers. forEach(function(item,index,array){

//执行某些操作

});

@归并方法

1.redure()，从第一项开始

2.reduceRight()，从最胡一项开始

两个参数，

第一个是函数（前一个值，当前值，项的索引，数组对象），函数的返回值会作为第一个参数传给下一项

第二个是基础的值(可选)

&求和

var values=[1,2,3,4,5];

var sum= values.reduce(function(prev,cur,index,array){

retrun prev+cur;

});

alert(sum); //15

3.Date类型

3.1基础

@创建一个日期对象 var now =new Date() ; //自动获得当前日期和时间

如果想指定特定的日期和时间创建日期对象，必须传入表示该日期的毫秒数，为简化，可用Date.pares和Date.UTC方法

。。。。

var someDate=new Date(Date.parse("May 25,2004"));

模仿构造函数=

var someDate=new Date("May 25,2004");

//GMT时间2000年1月1日午夜零时

var y2k=new Date(Date.UTC(2000,0));

//GMT时间2005年5月5日下午5:55：55

var allFives=new Date(Date.UTC(2005,4,5,17,55,55));

模仿构造函数，但是转换成本地时间

//本地时间2000年1月1日午夜

var y2k=new Date(2000,0)

//本地时间2005年5月5日下午5:55：55

var allFives=new Date(2000,4,5,17,55,55);

@Date.now() 返回调用这个方法时候的日期和时间的毫秒数

//取得开始时间

var start=Date.now();

//调用函数

dosomething();

//取得停止时间

var stop=Date.now();

result=stop-start;

用+操作符把Date对象转换成字符串

//取得开始时间

var start=+new Date();

//调用函数

dosomething();

//取得停止时间

var stop =+new Date();

result=stop-start;

3.2 继承的方法

1.toLocalString

2.toString

根据不同的浏览器会返回不同的字符串

3.valueOf --不返回字符串，而是返回日期的毫秒表示，可以用比较符(小于大于)来比较日期值，如

var date1=new Date(2007,0,1);

var date2=new Date(2007,1,1);

alert(date1< date2)；//true

alert(date1>date2)； //false

因为引用类型时object，比较会后台调用valueOf（）

3.3 日期格式化

Date 类型还有一些专门用于将日期格式化为字符串的方法。如下

1.toDateString --特定的格式实现星期几，月，日，年

2.toTimeString -- 特定的格式实现时、分、秒和时区

3.toLocaleDateString -- 特定的地区格式实现星期几，月，日，年

4.toLocaleTimeString -- 特定的格式实现时、分、秒

5.toUTCString --特定格式完整的UTC日期 toGMTString()和toUTCString一样，但已过期

3.4 日期/时间组件方法

注意的是：UTC日期指的是在没有时区偏差的情况下（将日期转换为GMT时间）的日期值

方法	描述	FF	IE
Date()	返回当日的日期和时间。	1	3
getDate()	从 Date 对象返回一个月中的某一天 (1 ~ 31)。	1	3
getDay()	从 Date 对象返回一周中的某一天 (0 ~ 6)。	1	3
getMonth()	从 Date 对象返回月份 (0 ~ 11)。	1	3
getFullYear()	从 Date 对象以四位数字返回年份。	1	4
getYear()	请使用 getFullYear() 方法代替。	1	3
getHours()	返回 Date 对象的小时 (0 ~ 23)。	1	3
getMinutes()	返回 Date 对象的分钟 (0 ~ 59)。	1	3
getSeconds()	返回 Date 对象的秒数 (0 ~ 59)。	1	3
getMilliseconds()	返回 Date 对象的毫秒(0 ~ 999)。	1	4
getTime()	返回 1970 年 1 月 1 日至今的毫秒数。	1	3
getTimezoneOffset()	返回本地时间与格林威治标准时间 (GMT) 的分钟差。	1	3
getUTCDate()	根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。	1	4
getUTCDay()	根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。	1	4
getUTCMonth()	根据世界时从 Date 对象返回月份 (0 ~ 11)。	1	4
getUTCFullYear()	根据世界时从 Date 对象返回四位数的年份。	1	4
getUTCHours()	根据世界时返回 Date 对象的小时 (0 ~ 23)。	1	4
getUTCMinutes()	根据世界时返回 Date 对象的分钟 (0 ~ 59)。	1	4
getUTCSeconds()	根据世界时返回 Date 对象的秒钟 (0 ~ 59)。	1	4
getUTCMilliseconds()	根据世界时返回 Date 对象的毫秒(0 ~ 999)。	1	4
parse()	返回1970年1月1日午夜到指定日期（字符串）的毫秒数。	1	3
setDate()	设置 Date 对象中月的某一天 (1 ~ 31)。	1	3
setMonth()	设置 Date 对象中月份 (0 ~ 11)。	1	3
setFullYear()	设置 Date 对象中的年份（四位数字）。	1	4
setYear()	请使用 setFullYear() 方法代替。	1	3
setHours()	设置 Date 对象中的小时 (0 ~ 23)。	1	3
setMinutes()	设置 Date 对象中的分钟 (0 ~ 59)。	1	3
setSeconds()	设置 Date 对象中的秒钟 (0 ~ 59)。	1	3
setMilliseconds()	设置 Date 对象中的毫秒 (0 ~ 999)。	1	4
setTime()	以毫秒设置 Date 对象。	1	3
setUTCDate()	根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。	1	4
setUTCMonth()	根据世界时设置 Date 对象中的月份 (0 ~ 11)。	1	4
setUTCFullYear()	根据世界时设置 Date 对象中的年份（四位数字）。	1	4
setUTCHours()	根据世界时设置 Date 对象中的小时 (0 ~ 23)。	1	4
setUTCMinutes()	根据世界时设置 Date 对象中的分钟 (0 ~ 59)。	1	4
setUTCSeconds()	根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。	1	4
setUTCMilliseconds()	根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。	1	4
toSource()	返回该对象的源代码。	1	-
toString()	把 Date 对象转换为字符串。	1	4
toTimeString()	把 Date 对象的时间部分转换为字符串。	1	4
toDateString()	把 Date 对象的日期部分转换为字符串。	1	4
toGMTString()	请使用 toUTCString() 方法代替。	1	3
toUTCString()	根据世界时，把 Date 对象转换为字符串。	1	4
toLocaleString()	根据本地时间格式，把 Date 对象转换为字符串。	1	3
toLocaleTimeString()	根据本地时间格式，把 Date 对象的时间部分转换为字符串。	1	3
toLocaleDateString()	根据本地时间格式，把 Date 对象的日期部分转换为字符串。	1	3
UTC()	根据世界时返回 1997 年 1 月 1 日到指定日期的毫秒数。	1	3
valueOf()	返回 Date 对象的原始值。来源： <http://www.jb51.net/article/40758.htm>

3.RegExp类型

1.基础

var expression = / pattern / flags ;

g 全局模式，应用于所有字符串，而非发现第一个匹配时立即停止

i 不区分大小写模式

m 多行模式

//匹配字符串中所有"at"实例

var pattern1=/at/g;

//匹配第一个"bat"或"cat",不区分大小写

var pattern2=/[bc]at/i;

//匹配所有以"at"结尾的3个字符的组合，不区分大小写

var pattern3=/.at/gi;

@所有元字符都必须转义

([{\^$|)?*+.]}

//匹配第一个"[bc]at",不区分大小写

var pattern=/\[bc\]at/i

1.字面量形式

var pattern1=/[bc]at/i

2.RegExp构造函数

var pattern2=new RegExp("[bc]at","i")

&RegExp构造函数两个参数必须是字符串，不能用字面量传递给RegExp构造函数

&由于是字符串，某些情况需要双重转义(所有元字符都必须双重转义)，例如\，字符串被转义为\\，正则表达式就会变成\\\\

如

/\[bc\]at/ -- "\\[bc\\]at"

@区别：使用字面量始终会共享一个RegExp实例，而构造函数创建每一个RegExp实例

var regExp=null;

for(var i=0;i<10;i++){

regExp=/cat/g;

regExp.test(catastrophe);

}

//只创建一个RegExp实例，所以在循环中再次调用test()会失败，因为第一次调用test后找到cat，第二次从索引3的字符开始，就找不到它了。

for(var i=0;i<10;i++){

regExp=new RegExp("cat","g");

regExp.test(catastrophe);

}

//第二个循环使用RegExp构造函数在循环中创建正则表达式，因为每次都会创建新的RegExp实例，所以每次调用test都会返回true

2.RegExp实例属性

2.1RegExp每个实例都具有下列属性

&global 布尔值，表示是否设置了g表示

&ignoreCase 布尔值，表示是否设置了i标志

&lastIndex 整数，表示开始搜索下一个匹配项的字符位置位置，从0算起

&multiline 布尔值，表示是否设置了m标志

&source 正则表达式的字符串表示，按照字面量形式而非传入构造函数中的字符串模式返回

var pattern=/\[bc\]at/i

pattern. global //false

pattern. ignoreCase //true

pattern. lastIndex //0

pattern. multiline //false

pattern. source //"\[bc\]at"

3.RegExp实例方法

3.1exec

参数(应用模式字符串)，然后返回第一个匹配信息的数组(Array实例)，没有匹配则返回null

1.包含两个属性：index（匹配项在字符串位置）和input（正则表达式的字符串）

2.第一项是匹配模式的字符串，其他项则是捕获组匹配的字符串(如果没有匹配组则只有第一项)

var text="mom and dad and bady"

var pattern=/mom(and dad(and bady)?)?/gi

var matches=pattern.exec(text);

alert(matches.index) //0

alert(matches.input) //mom and dad and bady

alert(matches[0]) //mom and dad and bady

alert(matches[1]) // and dad and bady

alert(matches[2]) //and bady

括号里面的是捕获组

@对于exec，不设置全局标志情况下，在调用一个字符串多次调用将始终返回第一个匹配项信息

设置了全局标志，则继续查找匹配项

var text="cat,bat,sat,fat";

var pattern1=/.at/;

var matches= pattern1.exec(text);

alert(matches.index); //0

alert(matches[0]); //cat

alert(pattern1.lastIndex); //0

matches= pattern1.exec(text);

alert(matches.index); //0

alert(matches[0]); //cat

alert(pattern1.lastIndex); //0

var pattern2=/.at/g;

var matches= pattern2.exec(text);

alert(matches.index); //0

alert(matches[0]); //cat

alert(pattern1.lastIndex); //3

matches= pattern2.exec(text);

alert(matches.index); //5

alert(matches[0]); //bat

alert(pattern1.lastIndex); //8

3.2 test

@接受一个参数，在匹配的情况下返回true，常与if一起用

if(pattern.test(text)){

//do

}

3.3

tolocaleString --返回正则表达式的字面量字符串

toString --返回正则表达式的字面量字符串

ValueOf --返回本身

3.4 RegExp构造函数的属性

3.5 模式的局限性

第五章引用类型(2)

1.Function类型

@函数实际是对象，每个函数都是Function类型的实例

@函数名实际也是一个指向函数对象的指针

@函数定义

1.1函数声明

function sum(num1，num2){

return num1+num2;

}

2.函数表达式

var sum=function(num1,num2){

return num1+num2;

};

&使用var定义

&有分号，像声明其他变量一样

@函数是对象，函数名是指针，如

function sum(num1，num2){

return num1+num2;

}

alert(sum(10,10)); //20

var another=sum;

alert(another(10,10));//20

sum=null;

alert(another(10,10));//20

&注意：使用不带圆括号的函数名是访问函数指针，而非调用函数

1.2.没有重载(用函数时对象，函数名是指针来理解)

function sum(num1){

return num1+100;

}

function sum(num1){

return num1+200;

}

alert(sum(100));//300

var sum=function(num1){

return num1+100;

};

sum=function(num1){

return num1+200;

};

alert(sum(100));//300

&&可看出，创建第二个函数时候，实际覆盖引用第一个函数的变量

1.3.函数声明与函数表达式

@在解释器向执行环境加载数据时，解释器会率先读取函数声明，并使在执行任何代码之前可用

@至于函数表达式，必须等到解释器执行到所执行的代码行

alert(sum(10,10)); //20

function sum(num1，num2){

return num1+num2;

}

正确

alert(sum(10,10)); //20

var sum=function(num1){

return num1+100;

};

错误，因为在执行到函数所在的语句之前，变量sum中不会保存有对函数的引用

1.4.作为值的函数

@因为函数本身是对象，指针，所以函数能作为参数，传递给另一个参数

function call(afunction,someArgument){

return afunction(someArgument);

}

function add10(num){

retrun num+10;

}

var result= call(add10,10);

alert(result); //20

&&一个参数做函数，把另外一个参数传递

1.5.函数的内部属性

函数内部有两个对象

@arguments对象

@this

@arguments对象，是一个类数组对象，其中还有一个叫callee对象属性

例子，阶乘

function a(num){

if(num<=1){

return 1;

}else{

return num * a(num-1);

}

函数的执行与内部函数名紧紧耦合在一起，可以写成

function a(num){

if(num<=1){

return 1;

}else{

return arguments.callee(num-1)

}

@this对象，是函数以执行对象的环境对象，（当在网页的全局作用域中调用函数时，this对象引用的就是window）

window.color="red";

var o={color:"blue"};

function sayColor(){

alert(this.color);

}

sayColor();//red;

o. sayColor= sayColor;

o. sayColor();//blue

&&函数的名字仅仅是一个包含指针的变量而已，因此，即使在不同的环境中执行，全局的sayColor与o. sayColor()指向的仍然是同一个函数

@ECMAScript中arguments另外一个caller属性。省略

1.6.函数的属性和方法

函数时对象，所以有属性和方法

1.6.1属性

@每个函数都有length和prototype

length:表示函数希望接收的命名参数的个数

function sayName(name){

alert(name);

}

function sum(num1,num2){

return num1+num2;

}

function sayHi(){

alert("hi");

}

alert(sayName.length) //1

alert(sum.length) //2

alert(sayHi.length) //0

prototype：

&是保存它们所有势力方法的真正所在，也就是toString，valueOf等方法实际都是保存在prototype名下，只不过通过各自对象的实例访问

&prototype属性石不可枚举的，因此无法for-in

1.6.2方法

@都包含两个非继承的方法apply和call()方法，用途在特定作用域中调用函数，实际等于函数体内this对象的值

1. apply，两个参数，第一个（运行函数的作用域），另一个（参数数组，可以使Array的实力，也可以是arguments对象）

function sum(num1,num2){

return num1+num2;

}

function callnum1(num1,num2){

return num.apply(this,arguments);

}

function callnum2(num1,num2){

return num.apply(this,[num1,num2]);

}

alert(callnum1(10,10)); //20

alert(callnum2(10,10)); //20

&传入this作为this值（因为在全局作用域调用，所以传入是window对象）

&&严格模式，未指定环境对象调用函数，则this不会转型window。除非明确把函数添加某个对象调用apply()和call()，否则this回事undefined

2. call，和apply区别是接收参数方式不同，第一个参数this没变化，第二个直接传递参数

function sum(num1,num2){

return num1+num2;

}

function callnum1(num1,num2){

return num.apply(this,num1,num2);

}

alert(callnum1(10,10)); //20

3.apply和call真正用武之地是能够扩充函数赖以运行的作用域，如

window.color="red";

var o={color:"blue"};

function sayColor(){

alert(this.color);

}

sayColor.call(this); //red

sayColor.call(window);//red

sayColor.call(o);//blue

&&执行函数不一样，函数体内this对象的指向都不一样了。

&&最大好处是对象不需要和方法有任何耦合了

1.6.3 ECMAScript还定义一个方法bind（）

2.基本包装类型

@3个特殊引用类型（基本包装类型）：Boolean、Number和String

@每当读取基本类型值的时候，后台就会穿件一个基本包装类型的对象

var s1="some text";

var s2=s1.substring(2);

过程

（1）创建String类型的一个实例

（2）在实例上调用指定的方法

（3）销毁这个实例

相等于

var s1=new String("some text");

var s2=s1.substring(2);

s1=null;

@引用类型和基本包装类型区别

1.对象的生存期，使用new操作符创建的引用类型实例，在执行流离开当前域之前一直保存内存中

2.自动创建的基本包装类型的对象，存在于代码的执行巡检，然后立即销毁（意味不能再运行时为基本类型添加属性和方法）

var s1="some text";

as.color="red";

alert(s1.color); //undefined

@可以显示调用Boolean、Number、String来创建基本包装类型的对象，但绝对不建议这样做（会让人分不清自己在处理基本类型还是引用类型）

@对基本包装类型的实例用typeof会返回object，而且基本包装类型对象都会装转换true

@Object构造函数也会像工厂方法，根据传入值类型返回相应基本包装类型实例

var obj=new object("some text");

alert(obj instanceof String); //true

@@使用new调用基本包装类型的构造函数，与直接调用同名的转型函数不一样

var value="25";

var number=Number(value); //转型函数

alert(typeof number); //"number"

var obj =new Number(value);

alert(type of obj); //"object"

对应@对基本包装类型的实例用typeof会返回object，而且基本包装类型对象都会装转换true

不建议显示创建基本包装类型，让它在后台自动处理好了

2.1Boolean

@创建Boolean类型 var booleanObject=new Boolean(true);

Boolean类型实例重写了valueof()方法，返回true或false

Boolean类型实例重写了toString()方法，返回"true"或"false"

Boolean对象在ECMAScript中用处不大，因为常误解

var falseObject=new Boolean(false);

var result= falseObject && true;

allert(result); //true

var falseValue=false;

var result= falseValue&& true;

allert(result); //false

1.因为前面讨论过，（基本包装类型对象都会装转换true），所以第一个var result= falseObject && true;结果是true

2.因为falseValue基本类型，所以。。

@@基本类型的布尔值和引用类型的布尔值还有两个区别

1.typeof操作基本类型会返回"boolean"，引用类型则返回"object"

2.Boolean对象是Boolean类型的实例，所以instanceof操作Boolean返回true，而基本类型用instanceof则false，如下

如下

alert(typeof falseObject); //object

alert(typeof falseValue); //boolean

alert(falseObject instanceof Boolean); //true

alert(falseValue instanceof Boolean); //false

区别基本类型的布尔值和Boolean对象之前区别非常重要--，最好就是永远不要用Boolean对象，不要显示创建

2.2Number

@创建 var numberObject=new Number(10)；

重写了valueof方法，返回对象表示的基本类型的值

重写了toString()，传递技术，返回几进制的字符串形式

var num=10；

alert(num.toString()); //10

alert(num.toString(2)); //1010

alert(num.toString(8)); //12

alert(num.toString(10)); //10

alert(num.toString(16)); //a

@toFixed方法 --按照指定的小数位返回数值的字符串表示,能够自动舍入的特性

var num=10;

alert(num.toFixed(2)); //"10.00"

var num=10.005;

alert(num.toFixed(2)); //"10.01"

@toExponential方法 --返回指数表示法

var num=10;

alert(num. toExponential(1)); //"1.0e+1"

@与Boolean对象类型，不建议显式创建对象

var numberObject=new Number(10);

var numberValue=10;

alert(typeof numberObject); //"object"

alert(typeof numberValue); //"number"

alert(numberObject instanceof Number); //true

alert(numberValue instanceof Number); //false

2.3 String类型

1.创建

var stringObject =new String("hello world");

valueOf,tolocale-String,toString方法都会返回对象所表示的基本字符值

2.属性-length

alert(stringObject.length);//"11"

&&注意的是，即使字符串中包含双字节的字符（不是占一个字节的ASCII字符，如汉字），每个字符也仍然算一个字符

3.方法

3.1字符方法-charAt，charCodeAt都接受一个参数（基于0的字符位置）

charAt-返回字符

var stringValue="hello world"

alert(stringValue. charAt(1)); //"e"

charCodeAt-返回字符编码

var stringValue="hello world"

alert(stringValue. charCodeAt(1)); //"101"，e的字符编码是101

&&ECMAScript5还可以方括号家数字索引来访问,大部分浏览器

var stringValue="hello world"

alert(stringValue[1]); //e

3.2字符串操作方法--concat, slice, substr, substring,都不会改变原来字符串

concat-字符串相加，就好比如直接用+""，任意个参数

var stringValue="hello:

var res= stringValue. concat("world","!");

alert(res); //hello world!

alert(stringValue) //hello

slice -- 两个参数，（字符串开始位置，字符串结束位置）

substring -- 两个参数，（字符串开始位置，字符串结束位置）

substr -- 两个参数，（字符串开始位置，要返回的字符个数）

var stringValue="hello world"；

stringValue.slice(3) --lo world

stringValue. substring(3) --lo world

stringValue.substr(3) --lo world

stringValue..slice(3,7) -- --lo w

stringValue.. substring(3,7) -- --lo w

stringValue..substr(3,7) -- --lo worl（要返回的个数）

&&一个参数情况下都是搜索到最后

&&参数也可以负值，比较混乱，不推荐

3.3字符串位置方法--indexOf， lansIndexOf，搜索字符串，返回其位置，没有则返回-1

indexOf从头开始，lastIndexOf从尾开始

var stringValue="hello world"；

stringValue. indexOf("o")--4

stringValue. lastIndexOf("o")--7

&&如果只有一个o，那么indexOf，lastIndexOf返回相同

&可选的第二个参数，表示从哪个位置开始

var stringValue="hello world"；

stringValue. indexOf("o"，6)--7

stringValue. lastIndexOf("o"，6)--4

&&可循环使用indexOf或lastIndexOf找到所有匹配的字符串

string stringValue="Lorem ipsum dolor sit amet, consectetur adipisicing elit"

var positong=new Array();

var pos= stringValue.indexOf("e");

while(pos>-1){

positong.push()pos;

pos== stringValue.indexOf("e",pos+1);

}

alert(positong) --3,24,32,35,52;

4.去两边空格--trim

ECMAScript5为所有字符串定义trim方法

var stringValue=" hello world "；

var res= stringValue.trim();

stringValue --" hello world "

res --"hello world"

5.字符串大小写转换--toLowerCase,toUpperCase,-toLocaleLowerCase,toLocaleUpperCase,

toLocaleLowerCase,toLocaleUpperCase是针对地区的

var stringValue="hello world"；

stringValue. toLowerCase(); --HELLO WORLD

stringValue. toUpperCase(); --HELLO WORLD

stringValue. toLocaleLowerCase(); --HELLO WORLD

stringValue. toLocaleUpperCase(); --HELLO WORLD

6.字符串模式的匹配方法--match,search,replace,split

6.1match--与调用RegExp的exec方法相同，一个参数（正则表达式或RegExp对象）

var text="cat,bat,sat,fat";

var pattern=/.at/;

var matches=text. match(pattern);; --与pattern.exec(text)相同

alert(matches[0]);//cat

alert(matches.index);//0

alert(matches.lastIndex);//0

6.2search-一个参数（正则表达式或RegExp对象）,返回字符串中第一个匹配的索引，没有则-1

var text="cat,bat,sat,fat";

var pos=text.search(/at/);

alert(pos);//1

6.3search-两个参数（RegExp对象或字符串【该字符串不会转成正则】，字符串或函数）

var text="cat,bat,sat,fat";

var result=text.replace("at","ond");

alert(result); //"cond,bat,sat,fat"

var result=text.replace(/at/g,"ond");

alert(); //"cond,bond,sond,fond"

如果第二个是字符参数，还可以使用（$$,$&,&',$n,$nn）,得到的值插入到结果字符串中

var text="cat,bat,sat,fat";

var result=text.replace(/(.at)/g,"word($1)");

alert(result); --word(cat),word(bat),word(sat),word(fat)

如果第二个是字符函数，

1.只有一个匹配性，三个参数（匹配性，匹配性在字符中位置，原始字符串）

2.多个捕获组情况，N个参数（（第一个捕获数组，第二个捕获数组。。。），匹配性在字符中位置，原始字符串）

function htmlEscape(text){

return text.replace(/[<>"&]/g,function(match,pos,origunalText){

switch(match)

case"<":

return "<";

case">":

return ">";

case"&":

return "&";

case"\"":

return """;

});'

}

&&该函数能够转移4个字符（小于号，大于号，和号，双引号）

htmlEscape("<p class=\"greeting\">hello world!</p>")

//<p class="greeting">hello world!</p>

7.split 基于一个字符串分割成多个字符串，结果放在数组中

参数（字符串或者RegExp对象，可选【指定返回数组的大小】）

var colorText="red,blue,green,yellow";

var color1= colorText.split(","); --["red","blue","green","yellow"]

var color2= colorText.split(",",2); --["red","blue"]

var color3= colorText.split(/[^\,]+/); --["",",",",",",",""]

8.localeCompare比较两个字符串

1.排在字符串参数之前，则负数（大多数是-1，但不一定）

2.排在字符串参数之后，则正数（大多数是1，但不一定）

3.相等，则0

建议不要使用1,-1,0，最好如下使用

function(value){

var res= "AAA".localeCompare(value)

if(res>0){}

else if (res<0){}

else{}

}

9.fromCharCode--String的静态方法，接受一段字符编码转换成String，如

String. fromCharCode(104,101,108,108,111);//hello

3.单体内置对象

3.1定义

&由ECMAScript提供，不依赖宿主环境的对象

&在执行程序已经存在，开发人员不需要实例化内置对象，因为已经实例化，比如前面那些Object,Array,String,Number等

&ECMAScript-262还定义两个内置对象，Global和Math

3.1.1 Global

&哪里看这个对象都是不存在的，不属于任何其他对象的属性和方法，最终都是它的属性和方法

&事实上，没有全局变量或者全局函数，因为所有全局作用上的函数都是它的属性和方法

&前面那些isNan，parseInt等事实上都是Global对象的方法，还有以下的

1.URI编码方法

@encodeURI--应用于整个URI，不会对身书属于URI的特殊字符进行编码，例如冒号，鞋行，问号和井号

@ encodeURIComponent--主要应用于URI中的某一段，会对它发现的非标准字符进行编码

var uri="http://www.wrox.com/illegal value.htm#start "

encodeURI(uri);//"http://www.wrox.com/illegal%20value.htm#start "

encodeURIComponent(uri);//"http%3A%2F%2Fwww.wrox.com%2Fillegal%20value.htm%23start "

上面中encodeURI只对空格进行编码，encodeURIComponent则对使用对应的编码替换所有非字母数字字符

相应的解码

@decodeURI

@ decodeURIComponent

&&实际上使用encodeURI和encodeURIComponent替代了已经废弃的escape和unescape

2 eval()方法

@就像ECMAScript的解释器，一个参数（要执行ECMAScript的字符串）

eval("alert('hi')");等同于alert('hi')

@通过eval调用的代码被认为是包含该次调用执行环境的一部分，具有与该执行环境相同的作用域链

如

var msg="hello world";

eval("alert(msg)");

或

eval("var msg='hello world';")

alert(msg);

但是严格模式下（use strict），外部不能访问eval内部定义的变量或者函数

使用eval时候注意安全性--代码注入

3 global对象的小户型

属性	说明	属性	说明
undefined	特殊值undefined	Date	构造函数Date
NaN	特殊值NaN	RegExp	构造函数RegExp
Infinity	特殊值Infinity	Error	构造函数Error
Object	构造函数Object	EvalError	构造函数EvalError
Array	构造函数Array	RangeError	构造函数RangeError
Function	构造函数Function	ReferenceError	构造函数ReferenceError
Boolean	构造函数Boolean	SyntaxError	构造函数SyntaxError
String	构造函数String	TypeError	构造函数TypeError
Unmber	构造函数Unmber	URIError	构造函数URIError

4 window对象

3.1.2 Math

1.属性

2.方法

@min和max方法

var max=Math.max(3,54,32,16)

alert(max);//54

var min=Math.max(3,54,32,16)

alert(min);//3

@舍入方法（将娴熟舍入为整数）

&Math.ceil() --向上舍入为最近的整数

&Math.floor() --向下舍入为最近的整数

&Math.round() --四舍五入为最近的整数

Math.ceil(25.9) --26

Math. ceil(25.5) --26

Math. ceil(25.1) --26

Math. floor(25.9) --25

Math.floor(25.5) --25

Math. floor(25.1) --25

Math. round(25.9) --26

Math. round(25.5) --26

Math.round(25.1) --25

@随即方法random（）方法，返回大于等于0小于1的一个随机数

套用下面公式就可以利用random从某个整数范围中随即选择一个值

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

1.如果1到10之间

var num=Math.floor(Math.random()*10+1)

2.如果2到10之间

var num=Math.floor(Math.random()*9+2)

3.其他方法

第七章函数表达式

1.匿名函数（拉姆达函数）

function (){

}

2.闭包

“官方”的解释是：闭包是一个拥有许多变量和绑定了这些变量的环境的表达式（通常是一个函数），因而这些变量也是该表达式的一部分。

相信很少有人能直接看懂这句话，因为他描述的太学术。其实这句话通俗的来说就是：JavaScript中所有的function都是一个闭包。不过一般来说，嵌套的function所产生的闭包更为强大，也是大部分时候我们所谓的“闭包”。看下面这段代码：

这段代码有两个特点：

1函数b嵌套在函数a内部；2函数a返回函数b。引用关系如图：

这样在执行完varc=a()后，变量c实际上是指向了函数b，b中用到了变量i，再执行c()后

就会弹出一个窗口显示i的值(第一次为1)。这段代码其实就创建了一个闭包，

为什么？因为函数a外的变量c引用了函数a内的函数b，就是说：

当函数a的内部函数b被函数a外的一个变量引用的时候，就创建了一个我们通常所谓的“闭包”。

3模拟块级作用域

javascript没有块级的概念

模拟一个块级作用域

(function(){

//这里是块级作用域

})();

4，私有变量

1.严格说javascript是没有私有成员，因为所有的对象属性都是公共的，但有一个私有变量的定义，就是函数中的变量，都可以认为是私有的。外部不能访问

2.特权方法-有权访问私有变量和私有函数的公共方法

function person(name){//name就是一个私有变量

this.getName=function(){

return name;

}

this.setName=function(value){

name=value;

}

var persion =new person("hahahah");

alert(persion . getName());//hahahah

persion . setName("bbb");

alert(persion . getName());//bbb

5，静态私有变量

6模块模式

第八章 BOM

1.window对象

@window是javascript访问浏览器窗口的一个接口，又是浏览器上ECMAScript规定的Global对象

@网页中定义的任何一个对象、变量都是以window作为Global对象

2.窗口关系及框架

1.页面包含框架，每个框架都拥有自己的window对象，并且保存在frames集合中

以下是一个框架

例子1

<frame src="frame.htm name="topFrame""></frame>

<frameset>

<frame src="anthorframe.htm name="leftFrame""></frame>

<frame src="yetanthorframe.htm name="rightFrame""></frame>

</frameset>

</frameset>
</html>

以上创建一个框架集，一个居上，两个居下

window.frames[0] window.frames["topFrame"] top.frames[0] top.frames["topFrame"] frames[0] frames["topFrame"]
window.frames[1] window.frames["leftFrame"] top.frames[1] top.frames["leftFrame"] frames[1] frames["leftFrame"]	window.frames[2] window.frames["rightFrame"] top.frames[2] top.frames["rightFrame"] frames[2] frames["rightFrame"]

top

@建议使用top来引用这些框架，因为top始终只想最高最外层，也就是浏览器窗口，可以确保在一个框架正确访问另外一个框架

@对于在一个框架中编写任何代码，其中window对象指向都是最高框架的实力，而非最高层框架

parent

parent对象始终指向当前框架的上层框架（有时等于top，在没有框架的情况下，parent=top=window）

如下

yetanthorframe.htm中

例子2

<html>
<head>yetanthorframe</head>
<frameset>

<frameset>

<frame src="red.htm name="redFrame""></frame>

<frame src="blue.htm name="blueFrame""></frame>

</frameset>

</frameset>
</html>

浏览器加载例子1后会加载例子2

@如果代码在例子2的redFrame或blueFrame中，parent指的就是rightFrame

@如果代码位于例子1的topFrame中，parent就是top

下图就是加载完之后，不同window的值

topFrame window.name=topFrame top.name= parent.name=
leftFrame window.name=leftFrame top.name= parent.name=	redFrame window.name=redFrame top.name= parent.name= rightFrame	blueFrame window.name=blueFrame top.name= parent.name=rightFrame

&&除非最高窗口时通过window.open（后面讨论）中打开，否则window对象的name属性不会包含任何值

self

实际上等同于window

3.窗口位置

1.位置属性

screenLeft screenTop --IE,Safari,Chrome

screenX screenY --Firefox

可以这样

var leftPos=(typeof window. screenLeft =="number")? window .screenLeft : window .screenX

var topPos=(typeof window. screenTop =="number")? window .screenTop : window . screenY

2.移动窗口位置

moveTo

moveBy

该方法不适用框架，只能对最外层window使用

4.窗口大小

浏览器

innerWidth,innerHeight

outerWidth,outerHeight

也可以用DOM

document. documentElement.clientWidth

document. documentElement.clientHeight

调整窗口大小

resizeTo

resizeBy

移动设备的窗口

5.导航和打开窗口

1.window.open--打开一个新的浏览器窗口，4个参数

参数1：要加载的URL

参数2：窗口目标

参数3：特性字符串

参数4：新页面是否取代浏览器历史中当前加载页的布尔值

@如果传递了参数2，该参数是已经有的窗口或框架，那么会在该名称的窗口或框架加载参数1的URL

window.open("http://www.wrox.com","topFrame")

调用该代码如同点击http://www.wrox.com中，target属性为topFrame的链接，如果有topFrame窗口或框架，则加载

，否则创建一个新窗口并且命名为topFrame

@如果传递了参数3，则按照其设置初始化窗口，否则按照默认值

设置	值	默认	说明
fullscreen	yes or no	仅限ie
height	数值
left	数值
location	yes or no	no
menubar	yes or no	no
resizeable	yes or no	no
scrollbars	yes or no	no
status	yes or no	no
toolbar	yes or no	no
top	数值
width	数值

打开一个新的可以调整大小的窗口，大小为400x400，离左边上边10像素

window.open("URL","demo","height=400,width=400,top=10,left=10, resizeable=yes")

@window.open会返回指向新窗口的引用，引用对象和window对象大致相似

如

var newWindow=window.open("URL","demo","height=400,width=400,top=10,left=10, resizeable=yes")

//调整大小

newWindow.resizeTo(500,500);

//移动位置

newWindow.moveTo(100,100);

//关闭窗口,尽可以是window.open打开的窗口，浏览器主窗口不能关闭

newWindow.close()

&&弹出的窗口还可以用top.close来关闭，窗口关闭后窗口引用还存在，该引用除了检测closed属性外，没其他用处

newWindow.close()；

alert(newWindow.closed); //true

@新建的窗口还有一个opener属性，保存打开的的院士窗口属性

var newWindow=window.open("URL","demo","height=400,width=400,top=10,left=10, resizeable=yes")

alert(newWindow. opener==window);//true

新打开的窗口可以指向打开它的窗口，但是原始窗口并不能跟踪它所打开的窗口

某浏览器（如ie，Chrome）会在独立的进程运行每个标签（所有标签在一个进程，所以可以彼此通信）

，若设opener=null，，即表示新标签页运行在独立的进程，不需要和打开的标签通信，一旦切断不可恢复

var newWindow=window.open("URL","demo","height=400,width=400,top=10,left=10, resizeable=yes")

newWindow。opener=null

@安全限制

广告---

@弹出窗口屏蔽程序

&大多数浏览器内置弹出窗口屏蔽程序

&如果弹出窗口屏蔽了，考虑两种情况

1.如果是浏览器内置弹出窗口屏蔽程序，那么window.open很可能返回null值，检测则可确定弹出窗口是否被屏蔽

var newWindow=window.open("URL","_blank"）

if(newWindow==null){

alert("block");

}

2.浏览器扩张或者其他程序阻止，则会抛出错误，可以这样检测

var block=false;

try{

var newWindow=window.open("URL","_blank"）

if(newWindow==null){

block==true;

}

}catch{

block==true;

}

if(block){

alert("block");

}

这个就是通用的了，包含两个情况的检测

6.间歇调用setInterval和超时调用（setTimeout）

1.超时调用setTimeout

参数1：要执行的代码（最好是函数）

参数2：毫秒

setTimeout(function(){

alert("hi");

},1000);

&参数2表明经过多少毫秒后把代码放进javascript任务队列，如果队列为空，则马上执行，若排队等候

setTimeout会返回一耳光数值ID，是计划执行代码的唯一标识符，可以通过它取消ijihua

var ID=setTimeout(function(){

alert("hi");

},1000);

clearTimeout(ID);

若计划已经执行后，在调用clearTimeout等同没调用一样

2.间歇调用setInterval

使用和setTimeout一样，也会返回一个ID

clearInterval（ID）

7.系统对话框

系统对话框的外观是有操作系统和浏览器决定的，与CSS没关

@alert

@confitm

if(confirm("Are You Sure")){

alert("y");

}else{

alert("n");

}

@prompt

参数1：显示的文本

参数2：默认显示

var res=prompt("what is your name","")

if(res!=null){

alert("welcome,"+ res);

}

8.location对象

@它既是window的对象，也是document的对象（window.location=document. location）

@属性

属性名	例子	说明
hash	#content	返回URL的hash，若没返回空字符串
host	www.wrox.com:80	服务器名称和端口号（如果有）
hostname	www.wrox.com	不带端口的服务器名称
href	http://www.wrox.com	返回当前页面完成的URL，location.toString()一样
pathname	/WileyCDA/	返回URL目录和文件名
port	8080	端口
protocol	http:	页面使用协议
search	?q=javascript&id=1	返回URL的查询字符串，一问号开头

@查询字符串参数

@位置操作

1.使用assign（）传递一个URL,打开一个URL，并保存在历史记录（即使按返回可以退回）

location.assign("http://www.wrox.com");

2.与assign一样

window. location="http://www.wrox.com";

location.href="http://www.wrox.com";

@replace()

一个参数，要接受的URL，位置改变，但是不会再历史记录中生成（后退无效）

@reload() 重新加载当前页

不带参数：location.reload()--会以最有效的方法重新加载（有可能从缓存在加载）

带参数：location.reload(true)--从服务器重新加载

&&reload()之后的代码可能执行一可能不执行，取决于网络延迟或系统资源等，所以最后把reload()放在代码最后一行

8.navigator对象

@是所有支持javascript浏览器所共有的

@与其他BOM一样，没个浏览器的navigator对象都有自己一套的属性

1.属性和方法

2.检测插件

3.注册处理程序

9.screen对象

10.history对象

@保存用户上网的历史记录

@go()

history.go(-1)

history.go(1)

history.go(2)

history.go("wrox.com")

@back()

@forward()

@length属性-保存历史记录数量

对于加载到窗口，标签页或者框架中的第一个页面而言，history.length=0

确定用户是否一开始就开你的页面

if(history.length==0){

//这应该是用户打开窗口后的第一个页面

}

&&当前页面的URL改变就会生成一条历史记录，在一些高版本浏览器中，URL改变还包括hash的变化（因此设置location.hash会在浏览器中生一套新的历史记录）

第十四章表单脚本

第二十章 JSON

1.语法

Json的语法可以表示以下三种类型的值

1.简单值

2.对象

3.数组

1.1简单之

1.2对象

3.数组

2.解释与序列化

2.1JSON对象

@stringify()

@parse()

@TOjSON()

第二十三离线应用与客户端存储

猜你喜欢

[HTML 5] Inserting DOM element
selenium-webdriver(python) (十四) -- webdriver原理
CGAL 三点确定一个平面
“前.NET Core时代”如何实现跨平台代码重用 ——程序集重用
list容器常用概念
简单实现ant design pro react typescript(ts) spring boot mybatis mysql前后端登录接口解决ant design pro登录成功无法跳转的问题
很久没来这里，今天的评测java怪东西，左右Date类和时间戳转换
Atitit 教育与培训学校的计划策划 v2
关于类型为numpy，TensorFlow.tensor，torch.tensor的shape变化以及相互转化
Python基于RCNN＆CTC的视频字幕识别系统（源码＆部署教程）
PySnooper – 永远不要使用print进行调试
促进新处理器的创新
[Node.js]27. Level 5: URL Building & Doing the Request
91. 解码方法 ——【Leetcode每日刷题】
程序人生：织梦dedecms后台/会员验证码关闭
cmake 学习笔记(一)
微服务 consul使用
【异常】java.lang.ArithmeticException: Non-terminating decimal expansion; no exact representable decimal result.
K8S 利用Rinetd实现Service负载均衡

相关主题

JavaScript语法二
javascript 递归
javascript - return
javascript模式
Javascript的事件
10 JavaScript对象
javascript之Map
javascript获取值

zl程序教程

当前栏目

javascript高级程序设计

相关文章