这里使用notepad++编写js的语句。浏览器使用chrome。
用javascript语句编写的代码必须通过HTML/XHTML文档才能执行。有两种方式可以做到这一点。
第一种方式是将js代码放到文档<head>标签中的<script>标签之间。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
js goes here
</script>
</head>
<body>
</body>
</html>
一种更好的方法是将js代码存放在一个扩展名为.js的独立文件中,然后使用<script>标签中的src属性指向该文件。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="file.js">
</script>
</head>
<body>
</body>
</html>
最好的做法是将js文件放到HTML文档的最后,这样能使浏览器更快的加载界面。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
...
<script src="file.js">
</script>
</body>
</html>
javascript语法
语句:建议每一条语句结束后都使用;来结尾。
注释:js语句使用//来表示注释内容
变量:可以直接使用变量名来赋值:
mood = "happy";
age = 33;
使用alert函数在浏览器上弹出提示框查看变量:
alert(mood);
alert(age);
但是变量最好使用var关键字在使用前进行变量申明。
var mood = "happy", age = 33;
alert(mood);
alert(age);
效果是完全一样的。
js语法不允许变量之间出现空格或标点符号。较长的变量名之间可以使用下划线连接:
var my_mood = "happy";
还可以使用驼峰式命名:
var myMood = "happy";
一般驼峰格式是函数名,方法名和对象属性名命名的首选格式。
数据类型:js是弱类型语句,即不需要进行类型声明。可以在任何阶段改变变量的数据类型。
1.字符串
字符串用一个或多个字符构成。字符串必须包裹在单引号或双引号里。
如果要使用双引号包裹已经存在双引号的字符串,要使用反斜线来进行字符转义:
var height = "about 5'10\" tall";
2.数值
js同样支持带小数点的数值,并且允许任意位数的小数,也就是浮点数。
3.布尔值
布尔数据具有两个可选值:true或false。
数组:在js中,如果想用一个变量来存储一组值,就需要使用数组。
数组使用Array关键字来声明,声明数组的同时还可以指定数组初始元素个数,也就是这个数组的长度:
var beatles = Array(4);
数组的个数在数组声明时是可选的,不填也能正确的声明一个数组。
向数组中添加元素的操作称为填充。在填充数组时,需要给出新元素的值,还需要给出新元素在数组中的存放位置,这个位置就是元素的下标。
beatles[0] = "John";
填充一个数组:
var beatles = Array(4);
beatles[0] = "John";
beatles[1] = "Paul";
beatles[2] = "George";
beatles[3] = "Ringo";
也可以:这条语句会给每个元素自动分配一个下标。
var beatles = Array("John", "Paul", "George", "Ringo");
在js中,也可以直接使用[ ]代替Array关键字,直接将元素初始值括起来就行了。
var beatles = ["John", "Paul", "George", "Ringo"];
实际上,数组元素可以是任意的数据类型。数组元素还可以是变量。
关联数组:
可以在填充数组时为每个新元素明确的给出下标来改变这种默认行为。在为新元素给出下标时,不必局限于使用整数数字。
var lennon = Array();
lennon["name"] = "John";
lennon["year"] = 1940;
lennon["living"] = false;
这样的数组叫关联数组。在js中,所有的变量实际上都是某种类型的对象。
对象:
对象也是使用一个名字表示一组值。对象的每个值都是对象的一个属性,使用点号来获取属性。
var lennon = Object();
lennon.name = "John";
lennon.year = 1940;
lennon.living = false;
var lennon = { name:"John", year:1940, living:false };
可以使用花括号来代替object关键字创建对象。
操作
算术操作符:js支持基本的加减乘除操作符,也支持++和--。可以使用+号来拼接字符串。
条件语句:只有在给定条件的求值结果是true的情况下才会执行。最常见的条件语句是if语句。
if (1>2) {
alert("The world has gone mad!");
} else {
alert("All is well with the world");
}
else子句给定条件为假的时候触发。
比较操作符:js支持>=,>,<,<=,==,等比较操作符。
var my_mood = "happy";
var your_mood = "sad";
if (my_mood == your_mood){
alert("We both feel the same.");
}
如果要进行严格比较元素是否相等,就要使用===三个等号的全等操作符,不仅仅比较值,而且会比较变量的类型。
严格比较不相等,则使用!==。
逻辑操作符:js支持逻辑与&&,逻辑或||还有逻辑非!操作符。
if (num >=5 && num <= 10) {
alert ("The number is in the right range.");
}
循环语句
while循环:只要给定条件的求值结果是true,花括号中的代码就会一直执行下去。
var count = 1;
while (count < 11) {
alert(count);
count++;
}
do...while循环:若要使包含在循环语句中的内部代码至少执行一次,就要使用do...while,因为do while的控制条件在循环语句之后。
var count = 1;
do {
alert(count);
count++;
} while (count < 1 );
for循环:
for (var count = 1; count < 11; count++) {
alert(count);
}
函数
使用关键字function来定义一个函数,可以给函数传递一个,0个或多个参数来使用这些传入的数据去完成预定的操作。
function converToCelsius(temp) {
var result = temp - 32;
result = result / 1.8;
return result;
}
还可以将函数做为一种数据类型来使用,可以把函数的调用结果赋给一个变量:
var temp_fahrenheit = 95;
var temp_celsius = couvertToCelsius(temp_fahrenheit);
alert(temp_celsius);
变量的作用域
全局变量:可以在脚本的任何位置被引用。
局部变量:只存在于声明它的那个函数的内部被引用,在外部无法使用。
function square(num) {
total = num * num;
return total;
}
var total = 50;
var number = square(20);
alert(total);
上面这个脚本仅定义了全局变量total,所以在函数中使用的也是全局变量,这样就会使全局变量的值发生改变。要解决这个问题需在函数中用var定义一个total的局部变量:
function square(num) {
var total = num * num;
return total;
}
总是在函数里使用var关键字来定义变量,就能避免任何形式的二义性隐患。
对象是一种非常重要的数据类型