JavaScript变量
命名规则：变量必须以字母开头；
变量也能以$和_符号开头（不推荐）；
变量名称对大小写敏感。
数据类型
javascript变量有很多类型，向变量分配文本值时，应该用双引号或者单引号包围这个值。当向变量赋值数值时，不要使用引号，否则会被当做文本处理。
例子：
var pi=3.14;
var name="Bill Gates";
var answer='Yes I am!';
声明（创建）JavaScript变量
使用var关键字声明变量：
var carname；
变量声明之后是空的（没有值）。
使用等号赋值：
carname = "volvo";
声明的同时赋值：
var carname ="volvo";
也可以一条语句声明多个变量
var name='gates', age=56, job='ceo';
声明也可以跨多行
var name="Gates",
age=56,
job="CEO";
value = undefined
在计算机程序中，经常会声明没有值的变量。这种变量其值实际上是undefined。
重新声明JavaScript变量
如果重新声明javas变量，该变量的值不会丢失；以下两条语句执行后，变量carname的值依然是‘volvo’；
var carname="Volvo";
var carname;
JavaScript数据类型
字符串、数字、布尔、数组、对象、null、undefined
JavaScript拥有动态类型
这意味着相同的变量可用作不同的类型；
例子：
var x // x 为 undefined
var x = 6; // x 为数字
var x = "Bill"; // x 为字符串
JavaScript字符串
字符串可以是引号中的任意文本。可以使用单引号或双引号。
例子：
var carname="Bill Gates";
var carname='Bill Gates';
JavaScript数字
JavaScript只有一种数字类型。数字可以带小数点也可以不带；
例子：
var x1=34.00; //使用小数点来写
var x2=34; //不使用小数点来写
var y=123e5; // 12300000
var z=123e-5; // 0.00123
JavaScript布尔
布尔只能有两个值：true或false
例子：
var x=true
var y=false
JavaScript数组
var cars=new Array();
cars[0]="Audi";
cars[1]="BMW";
cars[2]="Volvo";
或
var cars=new Array("Audi","BMW","Volvo");
或
var cars=["Audi","BMW","Volvo"];
JavaScript对象
对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式（name：value）来定义。属性由逗号分隔：
var person={firstname:"Bill", lastname:"Gates", id:5566};
上面的例子中对象（person）有三个属性：firstname、lastname、id。
空格和折行无关紧要，声明可以恒跨多行：
var person={
firstname : "Bill",
lastname : "Gates",
id : 5566};
对象属性有两种寻址方式：
name=person.lastname;
name=person["lastname"];
Undefined和Null
Undefined这个值表示变量不含值。
可以通过将变量的值设置为null来清空变量。
cars=null;
person=null;
声明变量类型
当声明新变量时，可以使用关键字new来声明其类型：
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;
注：JavaScript变量均为对象。声明变量时就创建了一个对象。
JavaScript对象
JavaScript中的所有事物都是对象：字符串、数字、数组、日期、等等。
在JavaScript中，对象是拥有属性和方法的数据。
属性和方法
属性是与对象相关的值。
方法是能够在对象上执行的动作。
汽车的属性：
car.name=Fiat
car.model=500
car.weight=850kg
car.color=white
汽车的方法：
car.start()
car.drive()
car.brake()
JavaScript中的对象
在 JavaScript中，对象是数据（变量），拥有属性和方法。
当声明一个变量时：
var txt = "Hello";
实际上创建了JavaScript字符串变量。字符串对象拥有內建的属性length。对于上面的字符串来说，length值是5。字符串对象同时拥有若干个内建的方法。
属性：
txt.length=5
方法：
txt.indexOf()
txt.replace()
txt.search()
创建JavaScript对象
JavaScript中的几乎所有事务都是对象：字符串、数字、数组、日期、函数，等等。也可以创建自己的对象。
例子：
person=new Object();
person.firstname="Bill";
person.lastname="Gates";
person.age=56;
person.eyecolor="blue";
访问对象的属性
语法：objectName.propertyName
例子：
var message="Hello World!";
var x=message.length;
访问对象的方法
语法：objectName.methodName()
例子：
var message="Hello world!";
var x=message.toUpperCase();
JavaScript函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
例子：
<!DOCTYPE html>
<html>
<head>
<script>function myFunction(){alert("Hello World!");}</script>
</head>
<body>
<button οnclick="myFunction()">点击这里</button>
</body>
</html>
JavaScript函数语法
函数就是包裹在花括号中的代码块，前面使用了关键字function：
function functionname（）
{
这里是要执行的代码
}
当调用该函数时，会执行函数内的代码。
可以在某事件发生时直接调用函数（当用户点击按钮时）。
注：JavaScript对大小写敏感。关键字function必须是小写的，并且必须以与函数名称相同的大小写来调用函数。
调用带参数的函数
在调用函数时可以向其传递值，这些值被称为参数。这些参数可以在函数中使用。
可以发送任意多的参数，由逗号分隔：myFunction(argument1,argument2)
当声明函数时，需要把参数作为变量来声明：
function myFunction(var1,var2)
{
这里是要执行的代码
}
变量和参数必须以一致的顺序出现。第一个变量就是第一个被传递的参数的给定的值，以此类推。
例子：
<button οnclick="myFunction('Bill Gates','CEO')">点击这里</button>
<script>
function myFunction(name,job)
{
alert("Welcome " + name + ", the " + job);
}
</script>
上面的函数会当按钮被点击时提示：“Welcome Bill Gates，the CEO”。
函数很灵活，可以使用不同的参数来调用该函数，这样就会给出不同的消息：
例子：
<button οnclick="myFunction('Harry Potter','Wizard')">点击这里</button>
<button οnclick="myFunction('Bob','Builder')">点击这里</button>
带有返回值的函数
通过使用return语句就可以实现。在使用return语句时，函数会停止执行，并返回指定的值。
语法：
function myFunction()
{
var x=5;
return x;
}
注：整个JavaScript并不会停止执行，仅仅只是函数。JavaScript将继续执行代码，从调用函数的地方。
在仅仅希望退出函数时，也可以使用return语句。返回值是可选的：
function myFunction(a,b)
{
if (a>b)
{
return;
}
x=a+b
}
局部JavaScript变量
在JavaScript函数内部声明的变量（使用var）是局部变量，所有只能在函数内部访问它。（该变量的作用域是局部的）。可以在不同的函数中使用名称相同局部变量，因为只有声明过该变量的函数才能识别出该变量。只要函数执行完毕，本地变量就会被删除。
全局JavaScript变量
在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
JavaScript变量的生存期
JavaScript变量的生命周期从它们被声明的时间开始。
局部变量会在函数运行结束以后被删除。
全局变量会在页面关闭后被删除。
向未声明的JavaScript变量来分配值
如果把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。
例子：
carname="Volvo";
将声明一个全局变量carname，即使它在函数内执行。
JavaScript运算符
运算符=用于赋值
运算符+用于加值
JavaScript算数运算符
给定y=5，下面表格解释了这些运算符：
| 运算符 | 描述 | 例子 | 结果 |
|---|---|---|---|
| + | 加 | x=y+2 | x=7 |
| - | 减 | x=y-2 | x=3 |
| * | 乘 | x=y*2 | x=10 |
| / | 除 | x=y/2 | x=2.5 |
| % | 求余数 (保留整数) | x=y%2 | x=1 |
| ++ | 累加 | x=++y | x=6 |
| -- | 递减 | x=--y | x=4 |
JavaScript赋值运算符
给定x=10和y=5，下面的表格解释了赋值运算符：
| 运算符 | 例子 | 等价于 | 结果 |
|---|---|---|---|
| = | x=y | x=5 | |
| += | x+=y | x=x+y | x=15 |
| -= | x-=y | x=x-y | x=5 |
| *= | x*=y | x=x*y | x=50 |
| /= | x/=y | x=x/y | x=2 |
| %= | x%=y | x=x%y | x=0 |
用于字符串的+运算符
+ 运算符用于把文本值或字符串变量加起来（连接起来）。
对字符串和数字进行加法运算，其结果是字符串。
JavaScript比较和逻辑运算符
比较运算符 ：比较运算符在逻辑语句中使用，以测定变量或值是否相等。
给定x=5，下面的表格解释了比较运算符：
| 运算符 | 描述 | 例子 |
|---|---|---|
| == | 等于 | x==8 为 false |
| === | 全等（值和类型） | x===5 为 true；x==="5" 为 false |
| != | 不等于 | x!=8 为 true |
| > | 大于 | x>8 为 false |
| < | 小于 | x<8 为 true |
| >= | 大于或等于 | x>=8 为 false |
| <= | 小于或等于 | x<=8 为 true |
逻辑运算符：用于测定变量或值之间的逻辑。
给定x=6以及y=3，下面解释了逻辑运算符：
| 运算符 | 描述 | 例子 |
|---|---|---|
| && | and | (x < 10 && y > 1) 为 true |
| || | or | (x==5 || y==5) 为 false |
| ! | not | !(x==y) 为 true |
条件运算符
语法：variablename=(condition)?value1:value2
例子：greeting=(visitor=="PRES")?"Dear President ":"Dear ";
JavaScript if...else语句
用法：
if语句；
if...else语句；
if...else if...else语句；
switch语句；
JavaScript switch语句
语法：
switch（n）
{
case1：
执行代码块1 break；
case2：
执行代码块2 break；
default：
n与case1和case2不同时执行的代码
}
工作原理：首先设置表达式n（通常是一个变量）。随后表达式的值会与结构中的每一个case的值作比较。如果存在匹配，则与该case关联的代码块会被执行。请使用break来阻止代码自动向下一个case运行。
例子：
显示今日的周名称。请注意Sunday=0，monday=1，Tuesday=2，等等：
var day=new Date().getDay();
switch (day)
{
case 0: x="Today it's Sunday"; break;
case 1: x="Today it's Monday"; break;
case 2: x="Today it's Tuesday"; break;
case 3: x="Today it's Wednesday"; break;
case 4: x="Today it's Thursday"; break;
case 5: x="Today it's Friday"; break;
case 6: x="Today it's Saturday"; break;
}
JavaScript For循环
JavaScript支持不同类型的循环：
for-循环代码块一定的次数
for/in-循环遍历对象的属性
while-当指定的条件为true时循环制定的代码块
do/while-同样当指定的条件为true时循环制定的代码块
for循环
语法：
for（语句1,；语句2；语句3）
{
被执行的代码块
}
语句1 在循环开始前执行
语句2 定义运行循环的条件
语句3 在循环已被执行之后执行
例子：
for（var i = 0；i < 5; i ++）
{
x = x + "he number is " + i + "<br>";
}
for/in 循环
作用：循环遍历对象的属性：
例子:
var person = {fname:"john", lname:"Doe", age:25};
for(x in person)
{
txt = txt + person[x];
}
while循环
只要指定条件为true，循环就可以一直执行代码。
语法：
while（条件）
{
需要执行的代码
}
例子：
while（i < 5）
{
x = x + "The number is " + i + "<br>";
i++;
}
do/while 循环
语法:
do
{
需要执行的代码
}
while（条件）；
例子：
do
{
x = x + "The number is " + i + "<br>";
i ++;
}
while(i < 5);
JavaScript break和continue语句
break 语句用于跳出循环；
continue 用于跳出循环中的一个迭代。
JavaScript标签
如需标记JavaScript语句，请在语句之前加上冒号：
label：
语句
语法：
break labelname；
continue labelname；
continue 语句（带有或不带标签引用）只能用在循环中。
break 语句（不带标签引用），只能用在循环或 switch 中。
通过标签引用，break 语句可用于跳出任何 JavaScript 代码块：
例子：
cars=["BMW","Volvo","Saab","Ford"];
list:
{
document.write(cars[0] + "<br>");
document.write(cars[1] + "<br>");
document.write(cars[2] + "<br>");
break list;
document.write(cars[3] + "<br>");
document.write(cars[4] + "<br>");
document.write(cars[5] + "<br>");
}
JavaScript错误 throw 、try和catch
try 语句测试代码块的错误。
catch 语句处理错误。
throw 语句创建自定义错误。
语法：
try
{
//在这里运行代码
}
catch(err)
{
//在这里处理错误
}
例子：
<!DOCTYPE html>
<html>
<head>
<script>
var txt="";
function message()
{try
{
adddlert("Welcome guest!");
}
catch(err)
{
txt="There was an error on this page.\n\n";
txt+="Error description: " + err.message + "\n\n";
txt+="Click OK to continue.\n\n";
alert(txt);
}
}
</script>
</head>
<body>
<input type="button" value="View message" οnclick="message()">
</body>
</html>
throw语句：创建或抛出异常（exception）。
如果把throw与try和catch一起使用，那么可以控制程序流，并生成自定义的错误信息。
语法：
throw exception
例子：
<script>
function myFunction()
{
try
{
var x=document.getElementById("demo").value;
if(x=="") throw "empty";
if(isNaN(x)) throw "not a number";
if(x>10) throw "too high";
if(x<5) throw "too low";
}
catch(err)
{
var y=document.getElementById("mess");
y.innerHTML="Error: " + err + ".";
}
}
</script>
<h1>My First JavaScript</h1>
<p>Please input a number between 5 and 10:</p>
<input id="demo" type="text">
<button type="button" οnclick="myFunction()">Test Input</button>
<p id="mess"></p>
JavaScript表单验证
JavaScript可用来在数据被送往服务器前对HTML表单中的输入数据进行验证。
被JavaScript验证的典型的表单数据有：
用户是否已填写表单中的必填项目；
用户输入的邮件地址是否合法；
用户是否已输入合法的日期；
用户是否在数据域中输入了文本；
例子：
<html>
<head>
<script type="text/javascript">
function validate_required(field,alerttxt)
{
with (field)
{
if (value==null||value=="")
{
alert(alerttxt);return false
}
else {
return true
}
}
}
function validate_form(thisform)
{
with (thisform)
{
if (validate_required(email,"Email must be filled out!")==false)
{
email.focus();return false
}
}
}
</script>
</head>
<body>
<form action="submitpage.htm" οnsubmit="return validate_form(this)" method="post">
Email: <input type="text" name="email" size="30">
<input type="submit" value="Submit">
</form>
</body>
</html>
扫一扫
2488
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
