<< Click to Display Table of Contents >> JavaScript简介 |
通过介绍 JavaScript 编程过程,来了解如何将 JavaScript 脚本嵌入到仪表盘中。
❖面向对象的概念
JavaScript 是面向对象的编程语言 (OOP),OOP 语言使我们有能力定义自己的对象和变量类型。它提供多种对象和方法,以及用户能够自定义方法。可以认为 JavaScript 里面所有东西几乎都是对象。
•对象。对象只是一种特殊的数据。对象拥有属性和方法。
•属性。属性是与对象有关的特征值,如名称,长度等。
•方法。方法指对象可以执行的行为(或者可以完成的功能)。
❖脚本语言的基础
JavaScript 语言与通常的 C++,Java 等面向对象语言的语法类似,先创建类,类包含方法,然后再实例化对象来创建对象。
在 JavaScript 中,当我们用 function 关键字来创建一个函数时,实际上在 JavaScript 中,是按照对象来进行管理的,且我们可以动态的设置该对象的属性及方法等。
以下是一个典型的例子:
// 定义构造函数,并设定一个属性
function Person(name){
this.name = name;
}
// new 关键字实例化一个对象
var Tom = new Person("Tom");
❖注释和命名
JavaScript 使用双斜线 "//" 开始单行注释 , 以 "/**/" 来添加一个多行注释。
// 单行注释
/* 多行
注释 */
分号 ";" 作为语句分隔符。
var a_1 = 0;
JavaScript 变量用于保存值或表达式。可以给变量起一个简短名称 , 比如 x, 或者更有描述性的名称 , 比如length。 JavaScript 变量也可以保存文本值 , 比如 carname="Volvo"。
JavaScript 变量名称的规则:
•变量对大小写敏感(y 和 Y 是两个不同的变量)
•变量必须以字母或下划线开始
•变量允许使用的字符包括:字母,数字,下划线
❖声明和赋值
Javascript 是一种弱类型的语言。这并不意味着它没有数据类型 , 只是变量或者 Javascript 对象属性不需要一个特定类型的值分配给它或者它始终使用相同的值 , 一个变量可以被分配任何值。该变量的类型是由当前赋值的类型来决定。因此 , 一个局部变量在使用之前 , 需要声明。使用关键字 "var" 来申明一个变量。
var a_1 = " 你好 ";
如果您所赋值的变量还未进行过声明 , 该变量会自动声明。
x=5;
carname="Volvo";
❖对象的类型和作用域
JavaScript 是基于对象的。这意味着在 JavaScript 中的每一个值都是一个对象。
// 下面的语句是等价的
var c = a.concat(b);
c = a + b;
一般来说 , 可以创建并使用的对象有三种:本地对象、内置对象和宿主对象。
JavaScript 把本地对象(native object)定义为 “ 独立于宿主环境的 ECMAScript 实现提供的对象 ”。简单来说,本地对象就是 JavaScript 定义的类(引用类型)。它们包括:Array, String, Number 等。
内置对象(built-in object)定义为 “ 由 ECMAScript 实现提供的、独立于宿主环境的所有对象,在 ECMAScript 程序开始执行时出现 ”。这意味着开发者不必明确实例化内置对象,它已被实例化了。
JavaScript 只定义了两个内置对象,即 Global 和 Math。
a = parseInt(1234);// parseInt 就是全局对象。
b = max(10, 12);// max 就是 Math 对象。
所有非本地对象都是宿主对象(host object),即由 ECMAScript 实现的宿主环境提供的对象。所有 BOM 和 DOM 对象都是宿主对象。
作用域指的是变量的适用范围。JavaScript 中只存在一种作用域 - 公用作用域。所有属性和方法默认都是公用的。
❖Number 对象
Number 对象是原始数值的包装对象。
var n = new Number(value);
var n = Number(value);
JavaScript 会自动地把原始数值转化成 Number 对象,调用 Number 方法的既可以是 Number 对象,也可以是原始数字值。
var n = 123;
数字可以是十进制,八进制,十六进制格式,默认是十进制。如果它以 "0x" 开头就是十六进制格式,如果以 "0" 开始,就是八进制格式。
var n1 = 80;// 默认为十进制格式
var n2 = 0xff;// 十六进制格式
var n3 = 012;// 八进制格式
数字类型可以使用四则运算符 +, *, /, -。也可以使用递增递减运算符 ++, --。
❖Boolean 对象
Boolean 对象表示两个值:"true" 或 "false"。当一个值用在条件语句中,为定义的值是被当做 "false" 的结果返回。如果要判断一个值是否定义过,就可以用如下语句:
if(value) {
// 执行语句
}
❖String 对象
String 对象用于处理文本(字符串)。字符串通常用单引号或双引号括起来。
var s1 = " 你好 ";
var s2 = " 你好 ";
可以用加运算符的把字符串串联起来:
var s3 = s1 + " 吗 ?";
字符串还有很多常见的方法,包括 substring(), toLowerCase(), toUpperCase(), indexOf() 等等。
var s1 = "abc";
s1 = s1.toUpperCase(); // 转成 ABC
var idx = s1.indexOf("B"); // 返回 1
s1 = s1.substring(1, 2); // 返回 "B"
字符串内置了对正则表达的支持。match() 方法可在字符串内检索指定的值,或找到一个或多个正则表达式的匹配。 search() 方法用于检索字符串中指定的子字符串,或检索与正则表达式相匹配的子字符串。
var s2 = "abcdefg";
var reg = /bc/; // 创建正则表达式
var idx = s2.search(reg); // 返回 "bc" 的位置
❖Date 对象
Date 对象用于处理日期和时间。 Date 对象会自动把当前日期和时间保存为其初始值。
var d1 = new Date();
采用全局函数 formatDate() 可以将一个日期对象转化为一个字符串:
var s1 = formatDate(d1, "yyyy-MM-dd"); // 2010-02-21
❖Array 对象
Array 对象用于在单个的变量中存储多个值。列表中的每个项目作为一个数组元素,并包含在方括号([])中。当创建一个数组时,它被初始化使用指定的值作为其数组元素。其长度被设置为指定的元素的数目。
var arr1 = ["beijing", "shanghai", "tianjin"];
多维数组是一个数组的数组。
var arr2 = [[1, 2], [3, 4], [5, 6]];
❖条件语句
JavaScript 中的条件语句用于完成不同条件下的行为。在您编写代码时,经常需要根据不同的条件完成不同的行为。可以在代码中使用条件语句来完成这个任务。
•If 语句
•If...else 语句
•If...else if...else 语句
if(x > 0) {
x = x + 1;
}
else {
x = x - 1;
}
❖for 循环语句
在编写代码时,你常常希望反复执行同一段代码。我们可以使用循环来完成这个功能,这样就用不着重复地写若干行相同的代码。 JavaScript 中的循环用来将同一段代码执行指定的次数(或者当指定的条件为 true 时)。在脚本的运行次数已确定的情况下使用 for 循环。
for ( 变量 = 开始值 ; 变量 <= 结束值 ; 变量 = 变量 + 步进值 ) {
需执行的代码
}
❖while 循环语句
JavaScript 中的循环用来将同一段代码执行指定的次数(或者当指定的条件为 true 时)。while 循环用于在指定条件为 true 时循环执行代码。
while ( 变量 <= 结束值 ) {
需执行的代码
}
有两种特殊的语句可用在循环内部:break 和 continue。break 命令可以终止循环的运行,然后继续执行循环之后的代码(如果循环之后有代码的话)。 continue 命令会终止当前的循环,然后从下一个值继续运行。
❖switch-case 语句
JavaScript 中的条件语句用于完成基于不同条件的行为。如果希望选择执行若干代码块中的一个,你可以使用 switch 语句:
var theDay = new Date().getDay();
switch (theDay) {
case 5:
s = "Finally Friday";
break
case 6:
s = "Super Saturday";
break
case 0:
s = "Sleepy Sunday";
break
default:
s = "Work day";
}
switch 后面的 (n) 可以是表达式,也可以(并通常)是变量。然后表达式中的值会与 case 中的数字作比较,如果与某个 case 相匹配,那么其后的代码就会被执行。 break 的作用是防止代码自动执行到下一行。
❖JavaScript 函数
函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。将脚本编写为函数,就可以避免页面载入时执行该脚本。
函数包含着一些代码,这些代码只能被事件激活,或者在函数被调用时才会执行。
你可以在页面中的任何位置调用脚本(如果函数嵌入一个外部的 .js 文件,那么甚至可以从其他的页面中调用)。
function prod(a,b) {
if(a > 0 && b > 0) {
var x = a * b;
return x;
}
else {
return 0;
}
}
❖JavaScript 变量的生存期
当您在函数内声明了一个变量后,就只能在该函数中访问该变量。当退出该函数后,这个变量会被撤销。这种变量称为本地变量。您可以在不同的函数中使用名称相同的本地变量,这是因为只有声明过变量的函数能够识别其中的每个变量。
如果您在函数之外声明了一个变量,则页面上的所有函数都可以访问该变量。这些变量的生存期从声明它们之后开始,在页面关闭时结束。