一,数据类型和值
1.基本认识
js丰富的,轻量级的,无类型的程序设计语言。js与JScript都相容ECMAScript,并包含超出的功能。
2.数据类型和值
基本:数字,字符串,布尔值
特殊:null,undefined。
复合数据类型:对象,数组,函数。
3.数字
js不区分整型和浮点,所有数字都为浮点型表示。
Infinity : 无穷大。 (专函数 isFinity() 来检测)
Number.NaN : 特殊的非数字值(当数值的运算产生了未定义的结果或发生错误后,专函数 isNaN() 来检测)
Number.MAX_VALUE : 最大值 1.7976931348623157e+308 ==1.7976931348623157x10的308次方
Number.MIN_VALUE : 最小值 5e-324 == 5x10的负324次方
Number.NEGATIVE_INFINITY : 负无穷大的特殊值 -Infinity
Number.POSITIVE_INFINITY : 正无穷大的特殊值。 Infinity
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> window.onload = function () { document.getElementById('txt1').value = Number.MAX_VALUE ; document.getElementById('txt2').value = Number.MIN_VALUE ; document.getElementById('int').innerHTML += Number.NEGATIVE_INFINITY+'<br/>'; document.getElementById('int').innerHTML += Number.POSITIVE_INFINITY; } </script> </head> <body> <div id="int"> <input id="txt1" type="text" style="222px"/><br /> <input id="txt2" type="text" style="127px"/><br /> </div> </body> </html>
4.字符串
单或双引号(注意配对:双中有单,单中有双,必要时用转义字符“\”,括起来的unicode字符序列。js没有char的单个字符数据类型。
序列 | 字符表示 |
\0 | NUL字符 |
\b | 退格符 |
\t | 水平制表符 |
\n | 换行 |
\v | 垂直制表符 |
\f | 换页 |
\r | 回车 |
\" | 双引号 |
\' | 单引号 |
\\ | 反斜杠 |
\xXX | 2位十六进制数XX指定的Latin-1字符 |
\uXXXX | 4位十六进制数XXXX的unicode字符 |
5.布尔值
true 或者 false "=="
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> window.onload = function () { var a,b; if (isNaN(a/b)) alert('Error!'); else alert('Yes!') } </script>
6.函数
function 函数名(arg1,arg2,...){
//code
}
js中函数是种数据类型。当做数据用。可以被保存在对象的属性中。
<head> <title></title> <script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> var person = new Object(); person.name = 'Bugs Bug';
//给对象person添加一个属性值
person.getName = function () { //给person添加一个getName方法; return this.name; } function go() { alert(person.getName()); } </script> </head> <body> <div id="int"> <input id="Button1" type="button" value="button" onclick="go()"/> </div> </body>
6.对象
已命名的数据的集合。通常被作为对象的属性来使用。名称是对象的属性名。值是对象的属性值。
<script type="text/javascript"> var person = new Object(); person.name = 'Bugs Bug'; //给对象person添加一个属性值 //或者 var person = { name: 'Bugs Bug' } </script>
对象还可以作为关联数组使用
var name = person.name; //或者 var name = person['name']; </script>
7.数组
js没有多维数组。但数组中的元素可以为其它数组,不需要有相同的类型。
数组参数:
一个整数->数组长度,
一个数(非整数)->发生错误。
非数字或者参数个数大于1-> 作为数组元素依次保存下来。
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> var array = new Array(); array[0] = 'Bugs'; array[1] = ' '; array[2] = 'Bug'; //或者 var array = ['Bugs', ' ', 'Bug']; //亦或 var array = new Array('Bugs', ' ', 'Bug'); </script>
8.null 特殊的值“没有值”,通常用于判断目标对象是否有意义。
9.undefined 特殊的值“未声明或声明了未定义的亦或使用并不存在的对象的属性、方法。” 注意undefined==null为true 要比较他们两个使用“===”
二,js的变量
1.类型
js无类型语言,可以存放任何类型的值。
<head> <title></title> <script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> window.onload = function str() { var a1 = 1; var a = 'Bugs'; var b1 = 2; var b = ' '; var c1 = 3; var c = 'Bug'; var str = a1 + a + b1 + b + c1 + c; document.getElementById("int").innerHTML = str; //1Bugs2 3Bug } </script> </head> <body> <div id="int"> </div> </body>
2.声明
var Bugs_Bug; //如果未初始化默认为undefined var Bugs_Bug = 'Bugs Bug'; } </script>
3.作用域
全局变量,局部变量
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> // var Bugs_Bug = 'Bugs Bug'; var a = 'Bugs Bug';//全局变量被隐藏 function str() { alert(a); //undefined var a = 'Bugs Bug'; alert(a); //Bugs Bug c = 'Bugs Bug'; var Bugs_Bug; // //alert(Bugs_Bug);//undefined 同名时优先级:局部 > 全局 } str(); //////// alert(a); //Error: 'a' is undefined //// // str();//隐式声明为全局变量 //// // alert(c);//Bugs Bug </script> </head> <body> <div id="int"> <input id="Button1" type="button" value="button" onclick="str()" /> </div> </body>
4.基本类型和引用类型
基本类型在内存中有固定的大小。引用类型没有固定的大小。基本类型变量储存的是值本身,引用变量储存值的引用(内存地址、指针)。
数字,布尔,是基本类型
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function str() { var a = 'Bugs'; var b = a; a += " Bug"; alert(a); //Bugs Bug alert(b); //Bugs } </script>
对象,数组,函数,字符串(长度可变)是引用类型,但是:字符串(长度可变)通常作为基本类型来理解使用
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function str() { var a =new Object(); var b = a;//b获得a的引用,a,b指向同一个地址(对象) a.name = "Bugs Bug"; alert(a); //[object object] alert(b.name); //Bugs Bug } </script>
三,表达式运算符
1.表达式:关键字,变量,常量,和运算符的组合,最简单的是一个变量名,或是直接量。
2.运算符 (注:第一个红色扩展未验证是否正确)
更加完全权威的参考:http://technet.microsoft.com/zh-cn/sysinternals/ce57k8d5(en-us,vs.85).aspx
符号 | 意思 | 解释 | 扩展 |
+ | 加法 | 数字:1+1=2 | 字符:Bugs+' '+Bug=Bugs Bug |
- | 减法 | 1-1=0 | |
* | 乘法 | 1*1=1 | |
/ | 除法 | 1/1=1 | |
% | 求余(取整) | 1%1=0 | |
++ | 递增 | ++1=2 | 1++=1 |
—— | 递减 | ——1=0 | 1——=1 |
== | 相等 |
1==2 false null==undefined true 'Bugs,Bug'==['Bugs','Bug'] true |
引用类型比较地址 数字和字符 将字符->数字 再比较 布尔和其它类型 先将布尔->数字 再比较 true=1(除了null,undefined,0都是1),false=0 对象与其它比较 ,将对象->为简单类型 再比较 对象->valueOf()->toString() Date->toString() 两个值类型不同时,也有可能相等 |
=== | 等同 | null===undefined false |
两个值类型不同时,不相等 |
!= | 不等 | 1!=2 true | |
!=== | 不等同 | null!===undefined true | |
> | 大于 | 1>2 f |
运算数可以是任意类型,运算限于数字和字符 (对象->数字 优先 ->字符串 次之 return false 否则) 数字和字符 将字符->数字 再比较(若字符串->数字失败会转换为NaN 返回 false) |
< | 小于 | 1<2 t | |
>= | 大于等于 | 1>=2 f | |
<= | 小于等于 | 1<=2 t | |
in |
第一个运算数是否为第二个运算数的属性名 var a = { 1:'Bugs', 2:'Bug'};
alert(1 in a);//true
alert(3 in a);//false
|
若:第二个运算数为数组,检查第一个运算数是否为数组包含的索引之一 var b = ['Bugs', 'Bug'];
alert('Bugs' in a);//false
alert(1 in a);//true
|
|
instanceof | 实例 | 检查第一个运算数是否为第二个运算数的实例 |
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function str() { var a = new Date(); alert(a instanceof Date);//true alert(a instanceof String);//false }</script> |
= | a+=1 | a=a+1 | |
a—=1 | a=a—1 | ||
a*=1 | a=a*1 | ||
a/=1 | a=a/1 | ||
a%=1 | a=a%1 | ||
<<= | 左移赋值 | 二进制左移补0 | |
expression1>>= | 有符号右移赋值 |
expression1的符号位被用来填充右移后左边空出的位 (The sign bit of expression1 is used to fill the digits from the left) |
|
>>>= | 无符号右移赋值 | 二进制右移补0 | |
&= | 按位“与”赋值 | 二进制,任何时候,只要两个表达式的某位都为 1,则结果中的该位为 1。 否则,结果中的该位为 0 | |
|= | 按位“或”赋值 | 二进制,任何时候,只要两个表达式中的一个表达式的某位为 1,则结果中的该位为 1。 否则,结果中的该位为 0。 | |
^= | 按位“异或”赋值 | 二进制,当且仅当只有一个表达式的某位为 1 时,结果中的该位才为 1。 否则,结果中的该位为 0。 | |
&& | 逻辑与 | ||
|| | 逻辑或 | ||
! | 逻辑非 |
3.语句
大括号“{}”将多个语句括起来,以“;”结束
4.声明变量
var 一个或多个用“,”隔开,
5. 语句
if(){} ,if(){}...else{},else if(){},switch中有default是可选的。break跳出整个switch(){case a: code;break;default:code;}。
while(){}, do{} while();for(){},
遍历:for(a in b){}对象的每一个属性
<head> <title></title> <script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function str() { var person = { name: 'Bugs Bug', sex: 'Man', age: 21, grow: function () { this.age++; } } for (var l in person) { document.write(l + '=' + person[l] + '</br>'); } } </script> </head> <body> <div id="int"> <input id="Button1" type="button" value="button" onclick="str()" /> </div> </body>
for /in 并不能列举出对象的所有属性,一些对象的属性被标记成了只读的,永久的,不可列举的,for/in语句不能列举出来,虽然用户自定义的属性都可以被列举,但是许多内部属性/方法都是不可列举的。
break;另一种用法,和标签搭配,js允许标示符和“:”标识语句, 语法:break 标签名;之间不能换行,
<head> <title></title> <script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function str() { var person = { 1: "Bugs", 2: ' ', 3: 'Bug' }; outloop: for (var i in person) { innerloop: for (var j in person) { if (person[i] == 'Bug') break outloop; if (person[j] == 'Bugs') break innerloop; } } document.writeln(person[j] + person[i]); //BugsBug } </script> </head> <body> <div id="int"> <input id="Button1" type="button" value="button" onclick="str()" /> </div> </body>
continue:跳出当前循环而进入下一次循环,只能用在while,do/while, for,for/in 语句中。和break一样,可以单独使用可以和标签搭配。
语法:continue 标签名;
<head> <title></title> <script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function str() { var person = { 1: "Bugs", 2: ' ', 3: 'Bug' }; outloop: for (var i in person) { innerloop: for (var j in person) { if (person[i] == 'Bug') continue outloop; if (person[j] == 'Bugs') continue innerloop; } } document.writeln(person[j] + person[i]); //BugBug } </script> </head> <body> <div id="int"> <input id="Button1" type="button" value="button" onclick="str()" /> </div> </body>
function ,return 指定当前函数的返回值,并跳出当前函数,也可以不带返回值单独使用,这时返回值为undefined。
throw :语法:throw 异常信息; 网页出现错误,不再正常运行!
throw new Error('无法定义Bugs Bug');
try{}catch(){}finally{}
finally可选(有,一定执行),若try出现异常会将异常赋值给catch执行catch,否则不执行catch。
<head> <title></title> <script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function checked(age) { if (age < 18) throw new Error('未成年!'); return age; } try { var age = checked(17); } catch (e) { document.writeln(e); //Error:未成年! document.writeln(e.Message);//undefined } finally { if (typeof age == 'undefined') age = 18; document.writeln(age); } </script> </head>
空语句。,在某些情况下很有作用。
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> var a = new Array(1, 2, 3, 4, 5, 6); for (var i = 0; i < a.length; a[i++] = 0); </script>
四,js函数
1.定义调用。
function 函数名(arg1,...){
//code;
}
var 函数名=function(arg1,...){
//code;
}
Function构造函数定义:
var 函数名 = new Function('arg1', 'arg2', '...', '函数体');
调用: 函数名(arg1,arg2,...);
<head> <title></title> <script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function go() { //var 函数名 = new Function('arg1', 'arg2', '...', '函数体'); var compare = new Function('x', 'y', 'if(x>y)return 1;else if(x==y)return 0;else return -1;'); document.writeln(compare(1, 2));//-1 } </script> </head> <body> <div id="int"> <input id="Button1" type="button" value="button" onclick="go()"/> </div> </body>
匿名函数的调用。
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> alert(function (a, b) { return (a + b); } (1, 2));
</script>
实际参数列表:arguments属性的使用。
arguments 对象:http://technet.microsoft.com/zh-cn/magazine/2b36h1wa(VS.90).aspx
虽然定义函数时有形参列表。但是传入参数十可以不与参数表一致。实际传入的参数会被储存到arguments属性中,他像一个数组
但不是真正的数组,有数组的length属性,arguments[1]为第一个参数,以此类推...
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function add() { for (var i = 0, sum = ''; i < arguments.length; i++) { sum += arguments[i]; } return sum; } document.writeln(add('Bugs', ' ', 'Bug')); //Bugs Bug // sum1=0 document.writeln(add(1, 2, 3, 4)); //10 </script>
arguments的callee属性(实现递归):保存当前函数的引用,该属性仅当相关函数正在执行时才可用,callee 属性的初始值是正被执行的 Function 对象。这将允许匿名函数成为递归的.
递归性将十进制转换为二进制
<script type="text/javascript" src="JS/JScript.js"></script> <script type="text/javascript"> function recursion(x) { if (typeof arguments[1] == 'undefined') var num = ''; else var num = arguments[1]; var y = parseInt(x / 2); num = x % 2 + num; if (y == 1) return '1' + num; else num = arguments.callee(y, num); //返回正被执行的 Function 对象,即指定的 Function 对象的正文(自身)。
return num; } document.writeln(recursion(10)); //10->1010 </script>
js大小写敏感。
注释单行:”//“或”/*多行*/“
js保留字:保留字不能作为变量,函数名,或标签名。
目前使用的保留字 | |||||
break | do | if | switch | typeof | case |
else | in | this | var | catch | false |
instanceof | throw | void | continue | finally | new |
true | while | default | for | null | try |
with | delete | function | return | ||
预留的保留字 | |||||
abstract | goto | package | extends | interface | volatile |
enum | double | synchronized | byte | short | |
import | implements | class | static | boolean | |
protected | private | float | long | export | |
transient | throws | native | final | int | |
debugger | const | super | char | public |