码迷,mamicode.com
首页 > Web开发 > 详细

JS高级程序设置笔记(一)

时间:2016-03-29 23:57:52      阅读:375      评论:0      收藏:0      [点我收藏+]

标签:

第一章

 
1.1 
ECMA:欧洲计算机制造商会
ISO/IEC:国标标准话组织和国际电工委员会
1.2JavaScript实现
一个完整的JavaScript实现应该由以下三个不同的部分组成
(1)核心(ECMAScript)
(2)文档对象模型(DOM)
(3)浏览器对象模型(BOM
1.2.1 ECMAScript
组成部分:语法、类型、语句、关键字、保留字、操作符、对象。
1.2.2 文档对象模型(DOM)
文档对象模型是针对XML但经过拓展用于HTML的应用程序编程接口(API Application Programming Interface)。
DOM把整个页面映射为一个多层节点结构。
DOM级别:
DOM1级由两个模块组成DOM核心(DOM Core)和DOM HTML。其中Dom核心规定的是如何映射基于XML的文档结构,以便对文档汇总任一部分的访问和操作。DOM HTML模块则在DOM核心的基础上加以拓展,添加了针对HTML的对象和方法。
DOM2级:在原先DOM的基础上拓充了鼠标和用户界面事件、范围、和遍历等细分模块。而且通过对象接口增加了对CSS的的支持。
DOM2级引入的下列新模块,也给出了众多新类型和新街口的定义:
DOM视图:定义了跟踪不同文档视图的接口。
DOM事件:定义了事件和事件处理的接口。
DOM样式:定义了基于CSS为元素应用样式的接口。
DOM遍历和范围:定义了遍历和操作文档树的接口。
3 :其他DOM标准
除了DOM核心和DOM HTML接口以外,另几种语言还发布了只正对自己的DOM标准,新定义和新接口
SVG(可伸缩矢量图)
MathML(数学标记语言)
SMIL(同步多媒体集成语言)
1.2.3浏览器对象BOM
BOM只处理浏览器窗口和框架;但人们习惯也把所有针对浏览器的JavaScript拓展算作BOM的一部分以下就是一些这样的拓展
弹出新浏览器窗口的功能
移动。缩放、和关闭浏览器窗口的功能;
提供浏览器详细信息的Navigator对象
提供浏览器所加载页面的详细信息的location对象
提供用户显示器分辨率详细信息的screen对象
对cookies的支持
 
第二章
2.1<script>元素
<script>元素定义了下列6个属性
async:可选。表示应该立即下载脚本文件。只对外部文件起作用
charset:可选。表示通过src属性指定的代码子集
defer:可选。便是脚本可以延迟到文档完全被解析和显示之后再执行
language:已废弃
src:可选。表示要执行的外部代码文件
type:可选。看作是language的代替品;表示编码代码使用的脚本语言的内容类型
 
使用<script>元素的方式有两种:直接在页面中嵌入Javascript代码和包括外部javaScript文件
使用<script>元素嵌入JavaScript时,只需要指定type属性。然后想下面吧javascript代码直接放在内部就可以
2.1.1标签的位置
按照传统的方法,所有的<script>标签都应该放在<head>标签里:目的是把所有外部文件的引用都放在相同的地方。
缺点就是,必须等所有的JS文件加载完成之后才能开始呈现页面,会导致在拥有很多js文件的情况下,会出现很严重的延迟问题。会让浏览器页面在很长一段时间里都是空白的状态。为了解决这个问题,闲杂都把<script>标签放在<body>元素中页面内容的后面。
<body>
<!--这里放内容-->
<script type="text/javascript" src="#"></script>
<script type="text/javascript" src="#"></script>
.....
</body>
 
2.1.2延迟脚本
<script>元素里有一个属性defer。这个属性的用途是表明脚本在执行的时候不会影响页面的构造。也就是说js文件会在所有页面都加载完成之后再运行。
<script type="text/javascript" src="#" defer="defer"></script>
<script type="text/javascript" src="#" defer="defer"></script>
2.1.3
异步脚本
HTML5为<script>元素定义了async属性。这个属性与defer属性相似,都是来改变脚本行为,和defer类似,都只对外部JS文件起作用
js的运行顺序,从上到下,执行顺序也是这样
 
<script type="text/javascript" async src="#">
function compare(a,b){
if(a>b){
alert("a is more than b");
}
else{
alter("a is less than b");
}
}
</script>
2.1.4 在HTML中的用法
<script type="text/javascript" async src="#">
function compare(a,b){
if(a>b){
alert("a is more than b");
}
else{
alter("a is less than b");
}
}
</script>
2.2 嵌入代码与外部文件
虽然HTML支持把js文件直接写在head元素中,但是还是建议使用外部js文件。有点有
1:可维护性强
2:可缓存
3:适应未来
第三章 基本概念
3.1语法
和C还有类似C的语言很接近如java,perl的语法
3.1.2区分大小写
js脚本语言是区分大小写的
3.1.2标识符
所谓表示符,就是指变量、函数、属性的名字。
表示符需要按照以下规则执行
1:第一个字符必须是字母,下划线,或者美元符号。
2:其他字符可以是字母,下划线,美元符号
按照规则:ECMAScript标识符采用驼峰大小写格式,也就是第一个字母小写,剩下的每个单词的第一个字母大写
3.1.3注释
ECMAScript使用C风格的注释,包括单行注释和块级注释:
//单行注释
/**/块级注释
3.1.4严格模式
要在整个脚本内启用严格模式,可以在顶部添加如下代码:
"use strict"
例如
function compare(a,b){
"use strict"
if(a>b){
alert("a is more than b");
}
else{
alter("a is less than b");
}
}
3.1.5:语句
和java的语句定义相似
每句在结束的时候使用";"号隔开,使用if的时候虽然只有一句的情况下是可以不用加"{}"号的但是为了规范,还是要加上中括号,使结构看起来清晰。
3.2关键字和保留字
关键字用来控制语句的开始或者结束,或者执行某些特定的用途,一下就是ECMA脚本的全部关键字(带*号的是5新增的关键字)
                       
break
 do 
instanceof
typeof
case 
else
 new
 var
catch
finally 
return
void
continue
 for
switch
while 
debugger*
function
this 
 with
dafault
if 
throw
 
 delete
in
try
 
 
 
 
 
     
3.3变量
ECMA的变量是松散类型的,所谓松散类型就是可以用来保存任何类型的数据。换句话来书每个变量只是用来保存值的占位符而已,定义变量要使用var操作符:
var message="h1";
用var定义的变量术语局部变量,函数结束时,这个变量也会随着销毁的。
如果没有加var 例如
message="h1";
可以用宇哥语句定义多个变量,只需要中间用逗号隔开极即可
 
3.4数据类型:
ECMAScript中有五种简单的数据类型(基本数据类型):undefined、null、Boolean、Number和String
还有一种复杂类型——object,object本质上是由一组无序的名值组成的。
3.4.1typeof操作符:
鉴于ECMAScript是一种松散类型,因此需要一种手段来检测给定变量的数据类型——typeof就是负责提供这方面信息的操作符。对一个使用typeof操作符可能返回下列某个字符串:
"undefined"——如果这个值未定义
"boolean"——如果这个值是布尔值
"string"——如果这个值是字符串
"number"——如果这个值是数值
"object"——如果这个值是对象或者null
"function"——如果这个对象是函数
var message="some string";
alert(typeof message);//string
alert(typeof (message));//string
alert(typeof 95);//number
3.4.2undefined类型
undefined类型只有一个值,及特殊的undefined。在使用var声明变量但是没有对其加以初始化时,这个变量的值就是undefined,例如
var one;
alert(one==undefined);//true
3.4.3null类型
null是第二个只有一个值得数据类型,这个特殊的值是null。从逻辑上来看,null表示空,当定义的一个变量等null时,他与undefined==返回值是ture。
3.4.4 boolean类型
boolean是用的最多的一种类型,他有两个值,ture和false。这两个值与数字值不是一回事,所以ture不一定等于1,false也不一定等于0;
3.4.5Number类型
number类型是让人最关注的数据类型,用来表示整数和浮点数值(float类型)
整数类型10进制 8进制 16进制
var intNum=55;
8进制(数字值0~7)第一位必须是0 ,8进制在严格模式下是无效的,会导致js报错
var intNum = 070;//8进制的56
16进制:面前两个值必须是0x后面任意十六进制数字(0~9 a~f)
javas中的保存数值的方式,可以保存正值负值和0。
 
1:浮点数值
对于极大或者极小的值可以使用e表示法
var floatName = 3.125e7;//31250000
2:数据范围;
ECMA能表示的最小数值保存在Number.MIN_VALUE中——在大多数浏览器中,这个值是5e-324。
能够表示最大的值放在Number.MAX_VALUE中——在大多数浏览器中,这个值是1.7976931348623157e+308;
3:NaN
非数值(Not a Number )
4:数值转换
有单个函数可以吧非数值转换为数值:Number()、parseInt()、parseFloat();
Number()函数转换规则
如果是boolean值:ture和false将会分别被转换为1和0
如果是数字值:只是简单的传入传出
如果是null值:返回值是0
如果是undefined值:返回Nan
如果是字符串,遵循下列规则
   如果字符串中只包含数字,就转换成十进制数
   如果字符串中有效的浮点格式,就会转换成对应的浮点格式
   如果字符串中包含十六进制数,就会自动转换成10进制数
   如果字符串是空的,则转换成0;
   如果字符串中包含上述格式之外的值,则转换成NaN
 
一般处理整数的时候会使用parseInt(),他会忽略空格或者不是字符的数,会直接找到数字来进行解析。
可以指定输出结果
parseInt("10" 进制数);//按照XX进制来进行解析
小数就用parseFloat()来进行转换
 
3.4.6 String类型
字符串类型例:
var StringInt="string"或者‘string‘;
2字符的特点,ECMAScript中的字符出是不可变的,也就是说,字符串一旦创建,他们的值就不能改变。要改变某个变量的保存的字符串,首先要销毁原来的字符串,然后在用另一个包含新字符串的字符填充该变量;例如
var lang="java";
lang="java"+"script";
3字符串转换
要把一个值转换成另一个值可以利用tostring()方法 (null undefined 没有tostring()方法)
var num=10;
alert(num.tostring(可以填写需要的进制数值));
alert(num.tostring(2));//输出2进制的字符串
 
在不知道要转换的值是不是null或undefined的情况下,还可以使用转型函数string(),这个函数能够将任何类型的值转换为字符串。String()函数遵循以下几条转换规则
1:如果值有tostring()方法,则调用该方法(没有参数)并返回相同的参数
2:如果返回值是null,则返回"null"
3:如果值是undefined 则返回undefined。
例子
var value1=10;
var value2=true;
var value3=null;
var values;//声明了但是没有初始化
 
alert(String(value1));//"10"
alert(String(value2));//"true"
alert(String(value3));//"null"
alert(String(values));//"undefined"
 
3.4.7object类型(对象)
和java中的创建对象大同小异
把一个函数赋值给一个变量
创建一个对象的方法
var o = new object();//新创建一个object对象,把它赋值给一个变量o o可以使用这个对象里的所有函数和方法
object的每个实例都具有下列属性和方法
1:constructor 保存着用于创建当前对象的函数
2:hasOwnPropery(properyName)同于检查给定属性在当前对象实例中是否存在
3:isprototypeof(object)用于检查传入对象是否是传入对象的原型
4:propertyIsEnumerable(propertyName)用于检测是否能用for-in语句来枚举
5:toLocaleString()返回对象的字符串表示
6:  tostring()返回对象的字符串表示
7:  valueOf()返回对象的字符串,数值或布尔值表示
 
3.5操作符
3.5.1 一元操作符:只能操作一个值得操作符叫做医院操作符
1递增和递减:
自加和自减放在前后的区别
在前 例:
var num1=2;
var num2=20; 
var num3=--num1+num2;//21
var num4=num1+num2;//21
 
例2:
var num1=2;
var num2=20; 
var num3=num1--+num2;//22
var num4=num1+num2;//21
区别就显而易见了
 
2:一元加和减操作符
一元加操作符在数值面前,对数值不会产生任何影响,如下列例子:
var num=25;
num=+num;//25
但是一元操作符用在非数值上就会像Number()一样对这个值执行转换。换句话说就是,布尔值False和true转换成0,1;字符串值会按照一组特殊的规则进行解析。而对象是先调用他们的valuesof()和tostirng()方法,然后再转换得到值。
例子:
var s1 ="01";
var s2="1.1";
var s3="z";
var b=false;
var f=1.1
var o={ valueOf:function(){
                      return -1;
}};
 
s1=+s1;//1
s2=+s2;//1.1
s3=+s3;//NaN
b=+b;//0
f=+f;//1.1
o=+o;//-1
 
3.5.2位操作符 
计算一个数的二进制补码:需要经过下列3个步骤
1:求这个数的二进制码;
2:求二进制的反码;0替换1;1替换0;
得到的二进制反码加1;
 
ECMAscript会尽力向我们影藏这些信息。换句话说,再以二进制字符串形式输出一个负数时,我们看到的只是这个负数绝对值得二进制码前面加上了一个符号,如下面的例子
var num=-18;
alert(num.tostring(2));//-10010
 
1.按位非(NOT)
按位非操作符由一个波浪线~表示,执行按位非的结果就是返回数值的反码。
var num1=25;//8个0 00011001
var num2=~num1;//8个1 1110 0110 -26
这里,对25执行按位非操作,结果得到了-26.这也验证了按位非操作的本质:操作数的负值减一。
 
2.按位与(AND)
按位与用&表示,他有两个操作符。本质上讲,按位与操作就是将两个数值的每一位对齐,然后根据下表的规则来执行
第一个数值得位            第二个数值的位            结果
1                                           1                     1
1                                           0                     0
0                                           1                     0
0                                           0                     0
就是要同时两个都位都为1或者都为0的时候结果才会是相同的。
25&3
25:0000 0000 0000 0000 0000 0000 0001 1001
3:  0000 0000 0000 0000 0000 0000 0000 0011
or: 0000 0000 0000 0000 0000 0000 0000 0001 //1
 
3.按位或(OR)
按位或用一个竖线表示(|),同时也有两个操作数。遵循下面的正值表
第一个数值得位            第二个数值的位            结果
1                                        1                        1
1                                        0                        1
0                                        1                        1
0                                        0                        0
看上列的表可以发现,只要有一个位是1返回的就是1,否则就返回0;
25|3:
25:0000 0000 0000 0000 0000 0000 0001 1001
3:  0000 0000 0000 0000 0000 0000 0000 0011
or: 0000 0000 0000 0000 0000 0000 0001 1011 //27
 
4.按位异或
按位异或(XOR)
按位异或操作符由一个插入符号(^)表示,也有两个操作数。一下是按位异或的真值表。
第一个数值得位            第二个数值的位            结果
1                                        1                        0
1                                        0                        1
0                                        1                        1
0                                        0                        0
规则:两个位上只能有一个为1时才能返回1;如果两个都是1 或者两个都是的话,都返回0;
25^3
25:0000 0000 0000 0000 0000 0000 0001 1001
3:  0000 0000 0000 0000 0000 0000 0000 0011
or: 0000 0000 0000 0000 0000 0000 0001 1010
 
5左移:
位数向左移动X,空白的位置用0补上;
例:2 10
var oldValue=2;
var newValus=oldValus<<5
10>>1000000//64
左移不会影响符号位,换句话说,如果将-2左移5位,得到的值就是-64,而不是64.
 
6,有符号的右移:
和左移放好相反,
var oldValue=64;
var newValus=oldValus>>5//2
1000000>>5=10;
7:无符号的右移
负数的无符号右移会变成一个比较大的数;
 
3.5.3 布尔值的操作
布尔值操作符一共有三个 与(and) 或(or)    非(not)
1:逻辑非:!
2:逻辑于:&& 同时为真才能返回true
3:逻辑或:|| 有一个为真就能返回ture
 
3.5.4
ECMAScript定义了三个乘性操作符 乘法 除法 和求模
1乘法:
在处理特殊值的情况下,乘法遵循的规则:
1如果操作符都是数值,执行常规的乘法;如果成绩超过了最大表示范围,则显示Infinity或者-Infinity
2如果有一个数十NAN,则返回值是NAN
3如果是一个Infinity与0相乘结果是NAN
4如果是Infinity与非0相乘 结果是Infinity或者-Infinity 取决一所乘的数有没有带单位
5如果有一个数不是数值,则在后台调用Number()方法然后再进项上面的过程
6 如果是Infinity与Infinity相乘 得到的数十Infinity;
 
2除法
除法的规则和乘法相似
 
3求模:
取余 就是相除然后取最后一个剩下来的值
比如25%5 余1 得出的数就是1;
 
3.5.5加性操作符
1加法
如果两个数都是数值,执行常规的加法计算,然后根据下列规则返回结果:
1:如果有一个数十NAN,则结果就是NAN
2:如果Infinity加Infinity 结果就是Infinity
3:如果是-Infinity加-Infinity 结果就是-Infinity
4:如果是Infinity加-Infinity 结果就是NAN
5:如果是+0加+0,结果就是+0;
6:如果-0+-0结果就是-0;
7:+0+-0则结果就是+0;
8:如果两个数都是字符串,结果就是将两个字符串进行拼接
9:如果有一个数是字符串,则另一个数转换成字符串再与第二个数拼接;
 
2:减法:
和加法的规则相似
规则有了相反的地方,如果有一个是字符串,就先使用valueof()方法,再计算;
 
 
3.5.6关系操作符
关系操作符遵循以下规则:
1:如果两个操作数都是数值,则执行数值比较。
2:如果两个操作数都是字符串,则比较两个字符串的字符编码值
3:如果两个操作数一个是数值,另一个转化为数值,然后执行数值比较
4:如果是对象,就先用valueof方法,如果没有就调用tostring方法
5:如果一个操作数是布尔值类型,就先转换为数值
 
3.5.7 相等操作符
1:相等和不相等
在转换不同的数据类型的时候,想等和不相等操作符遵循下列基本规则:
1:如果一个数十boolean值类型,先转化,true是1;false是0;
2:如果一个操作数是字符串,另一个操作数是数值,在比较相等之前现将字符串转换为数值
3:如果一个操作数是对象,一个不是,先用valuesof方法,用得到的基本类型去按照前面的规则进行比较
这两个操作在进行比较的时候要遵循下列规则
4:null和undefin是想等的
5:要比较相等性之前,不能将null和undefined转换成任何值。
6:如果有一个操作数是NAN,相等返回false 不相等返回true 重要提示:及时两个数都是NAN也会返回false  因为按照规则NAN 不等与NAN
7:如果两个数都是对象,则比较它们是不是同一个对象。如果两个操作数都指向同一个对象,则返回true,否则返回false。
2全等:
必须数值和数据类型完全一样的时候才会返回true 否则就是返回false。
 
3.5.8条件操作符:
var max =(num1>num2)?num1:num2;
判断num1是不是比num2大,如果打就返回第一个值,如果否就返回冒号后面的值。
 
3.5.9赋值操作符
用=号来进行
作用就是将左边的值付给右边!
从左向右!
例:
var num1=10+12;将10+12的和赋值给num1;
可以合并来写如:
var num=10;
num=num+10;
合起来写就是
num+=10;
 
3.5.10
逗号操作符
使用逗号可以在一条语句中执行多个操作;如以下的例子:
var num=1,num2=2,num3=3;
如果一次性给一个变量同时服了很多的值,那么最后变量的值等于最后一个付给的值
 
3.6语句
 
1if语句
语法:
if(判断体){
如果满足判断就执行结构体里面的内容
}else{
不满足的时候就执行else里面的函数
}
 
3.6.2do-while语句
do-while是一中后测试循环语句;特点就是先执行循环体里面的内容再执行while里面的判断
这种循环体最少会执行一次
语法:do{循环体被容}while(判断条件experssion);
 
3.6.3 while语句
while语句属于前测试语句。也就是说,在执行循环体之前,先回对出口条件进行判断。因此while里的循环体有可能永远不会被执行
语法:while(expression){
statement;
}
 
3.6.4 for语句
for语句也是一种前测试语句,先判断后循环
语法for{变量值;结束条件;修改}{var i=0;i<5;i++}{expression}
 
3.6.5for-in语句
for-in语句是一种精准的迭代语句,可以用来枚举对象的属性
语法for(property in expression)statement
例子:
for(var propName in window){
document.write(propName);
}
 
3.6.6lable语句
使用lable语句可以在代码中添加标签,以便将来使用。一下是lable语句的语法
lable:statement
例子:
start:for(var i=0;i<count;i++){
alert(i);
}
这个例子中定义的start标签可以在将来由break或continue语句引用。加标签的语句一般都要与for语句等循环语句配合使用。
 
3.6.7break和continue
相同的地方,都可以使循环的执行,区别是,break会让强制跳出循环,而continue之会跳出本次循环,后面的循环会继续执行。
 
 
3.6.8with语句
with语句是将代码的作用域设置到一个特定的对象中去;语法
with(expression)statement;
定义with语句的主要目的是为了简化多次编写同一个对象的工作,如下面的例子所示
var qs=location.search.substring();
var hostName=location.hostName;
var url=location.href;
以上几个代码都包含了location对象,用with语句如下
with(location){
var qs=search.substring();
var hostName=hostName;
var url=href;
}
严格模式下不允许使用with语句,否则会报错
 
3.6.9switch语句:
switch语句和if语句的关系相当密切,switch语句是一种控制流语句;语法:
switch(expression){
case value:statement;
break;
case value:statement;
break;
case value:statement;
break;
default:statement;
}
例子:
switch(i){
case 25:
    alert(25);
break;
case 26:
    alert(26);
break;
case 27:
    alert(27);
break;
default:
alert("other");
}
还可以合并
switch(i){
case 25:
case 35:
    alert(25or35);
break;
case 26:
    alert(26);
break;
case 27:
    alert(27);
break;
default:
alert("other");
}
3.7函数
函数对于任何一个语言来说都是核心的概念,通过函数可以封装任意多条语句,在任何地方,任何时候调用。
ECMA中的函数使用function关键字来声明。
function functionName(arg0,arg1......argn){
     statement;
}
例子:
function sayHi(name,message){
    alert("Hello"+name+","+message);
}
注意,如果函数包含返回值,那么在返回值之后的语句永远不会执行,因为在函数检测到return之后就会结束。
严格模式对函数有一定的限制:
1:不能把函数命名为eval或arguments;
2:不能把参数命名为参数同名的情况
3:不能出现两个命名同名的情况
如果发生上面几种情况,就会导致语法错误,代码无法执行。
 
3.7.1 理解参数
在函数体内可以通过argument对象来访问这个参数数组,从而获取传递给函数的每一个参数。
arguments对象只是与数组类相似(但是他并不是array的实例),他可以使用方括号的语法访问他的每一个元素,当然也可以使用.length属性来确定传递进来多少个参数.
function sayHi(){
   alert(arguments.length);
   alert("Hello"+arguments[0]+","+arguments[1]);
}
 
3.7.2没有重载
ECMAScript函数不能像传统意义上的重载。
 
4:变量、作用域和内存问题
4.1.1动态属性:
对于引用变量的值,我们可以为其添加属性的方法,也可以改变和删除其属性的方法。
var person=new object();
person.name="java";
alert(person.name);//java
但是我们不能给基本属性添加属性,虽然不会报错,但是返回值是undefined。
 
4.1.2复制变量的值:
如果从一个变量向另一个变量复制基本的值,会在变量的对象上创建一个新值,然后把该复制到为新变量分配的位置上。
 
4.1.4检测类型:
要检测一个变量是不是基本数据类型,可以用typeof操作符是最佳的工具但是检测引用类的值时,这个操作符的用处不大。通常我们并不是想知道某个值是对象,而是想知道他是很慢类型的对象,为此ECMAScript提供了instanceof操作符,去语法如下:result=variable instanceof constructor
如果变量是给定的引用类型那么instanceof操作符始终会返回true ,如果检测到的是基本类型的值,则该操作符始终会返回false
 
4.2 执行环境及作用域
执行环境 是js中最为重要的一个概念。执行环境定义了变量或函数有权访问的其他数据,决定了他们各自的行为。每个执行环境中都有一个与之关联的变量对象,
全局执行环境是最外围的一个执行环境。当这个环境里的内容执行完毕时,这个环境就会毁灭。
 
每个函数都有自己的执行环境。
 
4.2.1 延长作用域链
虽然执行环境的类型总共有两种——全局和局部(函数),但是还是有其他方法来延长作用域。具体来说就是,就是当执行流进入下一列任何一个语句是,作用域链就会得到加长:
try-catch语句的catch快
with块
 
 
 
 
第五章:
5.1object类型
创建object实例的方式有两种。第一种是使用new操作符后跟object构造函数如
var person = new object();创建对象
另一种方式是使用对象字面量表示法 对象字面量是对象定义的一种简写方法,目的在于简化创建包含大量属性的对象过程。例:
var person ={
    name :"java";
    age : 29;
}
在使用对象字面量语法时,属性名也可以使用字符串
例子:
   var person = {
        "name":"java";
         "age" :26;
 }
在创建对象的时候如果花括号里没有填写内容,那么就和第一种创建方法是一样的。
 一般来说,访问对象属性时都是使用点表示发,这也是很多面向对象语言中通用的语法,不过在js中可以用方括号表示法来访问对象的属性,在使用方括号法时,应该将要访问的属性以字符串的形式放在方括号里,如下面所示:
alert(person["name"]);
alert(person.name);
方括号表示法主要的优点是可以通过变量来访问属性 如:
var propertyName = "name";
alert(person[property]);
如果属性名中有一个空格,就不能通过点表示法来获取属性的值了,这时候就可以通过方括号表示法来取得属性的值
person[frist name]="java";//通常除非非要使用变量来访问属性,一般我们都建议使用点表示法。
 
5.2Array类型
Array类型就是我们通常说的数组类型
创建数组的基本方法一般有两个:
第一种:使用array的构造函数:
var color=new Array();如果你知道数组内要保存的元素个数,你就可以里面设置,该数量会自动变成length属性的值。例如下面创建length为20的数组:
 var color = new Array(20);
也可以直接向数组内传递需要保存的项:如下
var color = new Array("red","green","black");
构造函数的时候也可以省略new操作符:例子:
var color= Array(3);
var name = Array("java");
创建数组的第二种方式是使用数组字面量表现法。数组字面量由一对包含数组项的方括号表示,多个数组之间以逗号隔开,如下所示:
var colors=["red","blue","green"];//创建了一个包含三个字符串的数组
var names= []//创建了一个空数组
var values=[1,2,3];//创建了一个有3项的数组
读取数组是的索引都是从0开始的!!!
数组的length属性永远比索引大1!!
我们可以用这个属性将数组末尾移除或者向数组内添加新项:例子:
var color = ["red","green","black"];
color.length=2;
alert(color[2]);//undedfind
数组中的length属性很有特点它不是只读的!!
同样也可以使用这个方法给数组内添加新的元素:例子:
var colors=["red","green"];
colors[colors.length]="black";
colors[colors.length]="pink";
解释,刚开始数组内有两个元素,length值为2,但是索引值只有0 和 1,所以当我们取值取length的位置的时候,其实是一个空的位置(undefined),所以我们就能给他添加新的属性。
 
5.2.1 检测数组
自从ECMAScript出现之后,就出现了确定某个对象是不是数组的经典问题
。对于一个网页,或者一个全局作用域而言,使用instanof操作符就能得到满意的答案
if(value instanceof Array){
   //对数组内执行某些操作
}
新增了Array.isArray()方法。这个方法的目的最终确定某个值到低是不是数组,而不管他在那个全局环境执行环境中创建的。这个方法的使用方法如下:
if(Array.isArray(value)){
    //对数组执行某些操作
}
5.2.2转换方法
所有对象都具有tolocaleString(),toString(),valueOf()方法,其中调用数组的toString()方法会返回有数组内所有元素由逗号分割的一个字符串。
有时候toLocaleString()方法经常也会返回与toString()和valuesOf()方法相同的值,但是也不总是如此,。而前面两个值得唯一不同之处在于这一次为了取得每一项的值,调用的是每一项的toLocaleString()方法,而不是toString()方法。
如果你想用不同的分隔符去分割返回的字符床串的值可以使用join()方法:例如:
var color=["green","black","white"];
alert("color.join("&")");//green&black&white;
 
5.2.3 栈方法
栈是一种LIFO(last-in-first-out)后进先出的数据结构,也就是说最新添加的数被最早的溢出了。而栈中项的插入(叫做推入)和移除(叫做弹出),只发生在一个位置,栈的顶部。ECMAScript为数组专门提供了push()和pop(),方法,以便实现类似栈的行为。
push()方法可以接受任意数量的参数,把他们逐个添加到数组的尾部,并返回修改后数组的长度。而pop()方法则从数组末尾移除最后一项。减少length值,然后返回移除的项:
例子:
var colors = new  Array();//创建一个数组
var count = colors.push("red","green");//推入两项
alert(count);//2
 
count=colors.push("black");
alert(count);//3
 
var item=colors.pop;//取得最后一项
alert(item);//black
alert(colors.length);//2
 
push()方法负责往数组里添加新的值,会改变length属性的值。
pop()方法会取得数组内最后一位的数,并且将它移除。后进先出
 
5.2.4 队列方法
堆栈是后进先出,而队列刚好和他相反,FIFO(first-in-first-out)先进先出
可以用push()方法给数组内添加元素:push("red","black");
然后可以用shift()方法移除数组内第一个元素;
例子:
var colors=new Array();
vat cont=colors.push("red","black");
alert(count.length);//2
 
var item = colors.shift();
alert(item);//red
alert(colors.length);//1
 
5.2.5 重排序方法
数组内已有的数可以用reverse()和sort()方法来进行重新排序,区别是:reverse()是将数组内的元素从大到小排序,而sort()方法是按照升序来排序,就是从小到大来排序。
var nums=[1,2,5,9,7];
nums.sort();
alert(nums);//1,2,5,7,9
 
5.2.6操作方法
concat()方法可以基于当前数组中的所有项创建一个新的数组。
slice()方法,他能够基于当前数组中的一个或者多个项创建一个新的数组;
slice()方法里面的可以有两个参数值,当只有一个值得时候,新的数组会拥有从这个值开始,之后所有的值,如果有两个值得话,新数组就会有这两个数字之间的所有元素;例子:
var nums = [1,2,3,4,5,6,7];
var newInt = nums.slice(2);//从位置2开始复制 3,4,5,6,7
var newTwo = nums.slice(3,5);//从位置3开始复制到位置5结束 4,5
 
接下来我们来介绍splice()方法,这个方法算是数组里最强大的方法了,他有很多种用法。splice()的主要用途是向数组的中部插入项,但是使用这种方法的方式则有如下3三种。
删除 splice()方法可以删除任意数量的项,只需指定2个参数;要删除的第一项的位置和要删除的项数,例如:splice(0,2)会删除数组内的前两项;
插入:可以向指定位置插入任意数量的项,可以再传入第四,第五一致任意多的项,传递三个参数,起始位置,要删除的项,和要插入的值。例如:splice(2,0(要删除的项),"red","green");
替换:可以向指定位置插入任意数量的项,且同时删除任意数量的项,只需指定3个参数,起始位置,要删除的项数和要插入的项数。插入的项数不必与删除的项数相等。例如:splice(2,1."red","green")//会删除当前数组位置2的项,然后再从位置2开始插入字符串"red","green"
 
5.2.7位置方法
indexof()和lastIndexOf()位置方法;这两个方法都接受两个参数:要查找的项和(可选的)表示查找起点位置的索引。其中indexof()方法从数组的开头开始查找(位置0),向后。lastIndexOf()方法则从数组的末尾开始寻找。
这两个方法都会返回查找项在数组内的位置,或者在没有查找的情况下返回-1;在比较第一个参数与数组中的每一项时,会使用全等操作符;也就是说必须严格相等;
例子:var number = [1,2,3,4,5];
alert(number.indexof(4));//返回位置3
alert(number.lastIndexOf(4));//返回1
5.2.8 迭代方法
定义了5个迭代方法,每个方法都接受两个参数:要在每一项上运行的函数和(可选的)运行该函数的作用域对象-影响this的值。传入这些方法的函数会接受三个参数:数组的值,该项在数组中的位置和数组对象本身。
以下是5个迭代方法的作用
every()对数组中的每一项给定函数,如果该函数对每一项都返回true,则返回true;
filter()对数组中的每一项给定函数。返回该函数会返回true的项组成的数组。
foreach()对数组中的每一项给定函数。没有返回值
map()对数组中的每一项给定函数。返回每次函数调用的结果组成的数组
some()对数组中的每一项给定函数。如果该函数对任一项返回true,则返回true
以上的函数都不会修改数组中函数的值。
 
5.2.9归并方法
新增了两个归并数组的方法:reduce()和reduceRight(),这两个方法都会迭代数组的所有项,然后够键一个最终返回的值,其中reduce()方法从数组的第一项开始,逐个遍历到最后。而reduceRight()则从数组的最后一项开始,向前遍历到第一项。
这两个方法都接收两个参数:一个在每一项上调用的函数和(可选的)作为归并函数基础的初始值。传递给这两个函数接收四个参数:前一个值,当前值,项的索引和数组对象。
遍历数组内的所有项,来执行函数,最后返回一个总值
 
 
5.3Date类型
 
创建一个date对象
 var now = new Date();对象获得当前的日期和时间;
Date.parse()和Date.UTC();
parse()方法接收一个表示日期的字符串参数,接收以下格式
1:"月/日/年"如 6/13/2004
2:“英文月名 日 年” 如January 12,2004
3:“英文星期几 英文月名 日 年 时 :分 :秒:时区” 如 TUE May 25 2004 00:00:00 GMT-0700
4:ISO 8601扩展格式 YYYY-MM-DDTHH:mm:ss:ssz(例如 2004-05-25T00:00:00);
如要创建一个如期对象 2004 5 25 
var someDate=new Date(Date.prase("May 25,2004"))
 
5.3.2日期格式化方法
Date类型还有一些专门用于将日期格式化为字符串的方法,方法如下
1:toDateString()
2:toTimeString()
3:toLocaleDateString()
4:toLocaleTimeString()
5:toUTCString()
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

JS高级程序设置笔记(一)

标签:

原文地址:http://www.cnblogs.com/gavinzzh-firstday/p/5335266.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!