一、JavaScript的作用域
1、变量在函数内声明,变量为局部变量,具有局部的作用域。
局部变量:只能在函数内部访问
示例:
// 此处不能调用 carName 变量
function myFunction() {
var carName = "Volvo";
// 函数内可调用 carName 变量
}
注:因为局部变量只作用于函数内,所以不同的函数中可以使用相同的名称作为变量名。
局部变量在函数开始执行时创建,函数执行完毕后局部变量会自动销毁。
2、变量在函数外定义,即为全局变量。
示例:
var carName = " Volvo";
// 此处可调用 carName 变量
function myFunction() {
// 函数内可调用 carName 变量
}
注:全局变量有 全局作用域 ,网页中所有脚本和函数均可使用。
3、JavaScript变量生命周期
JavaScript变量的生命周期在它声明时初始化。
局部变量在函数执行完毕后销毁。
全局变量在页面关闭后销毁。
注:
函数的参数只有在函数内起作用,故它是局部变量。
三、JavaScript事件
常见的HTMML事件表:
事件 | 描述 |
onChange | HTML元素改变 |
onClick | 用户点击HTML元素 |
onmouseover | 鼠标指针移动到指定元素上时发生 |
onmouseout | 鼠标指针从指定元素上移开时发生 |
onKeyDown | 用户按下键盘按键 |
onLoad | 浏览器已完成页面的加载 |
字符串 - 转义字符:
四、JavaScript运算符
1、算术运算符
与/或值之间的算术运算。
y=5,下面的表格解释了这些算术运算符:
运算符 | 描述 | 例子 | x运算结果 | y运算结果 |
+ | 加法 | x=y+2 | 7 | 5 |
- | 减法 | x=y-2 | 3 | 5 |
* | 乘法 | x=y*2 | 10 | 5 |
/ | 除法 | x=y/2 | 2.5 | 5 |
% | 余数 | x=y%2 | 1 | 5 |
++ | 自增 | x=++y | 6 | 6 |
x=y++ | 5 | 6 | ||
-- | 自减 | x=--y | 4 | 4 |
x=y-- | 5 | 4 |
2、赋值运算符
赋值运算符用于给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 |
3、用于字符串的 + 运算符
+ 运算符用于把文本值或字符串变量连接起来。
如果将两个或多个字符串变量连接起来,请使用 + 运算符
例如:
text01 = “Hello”;
text02 = “ World”;
test03 = text01+ text02;
运算结果:Hello World
4、对字符串和数字进行加法运算
两个数字相加,返回数字相加的和。如果数字与字符串相加,返回字符串:
示例1:
age1 = 12;
age2 = 8;
age3 = age1 + age2;
运算结果:
age3 = 20;
示例2:
age1 = 12;
text2= “23”;
age3 = age1 + text2;
运算结果:
age3 = 1223;(字符串)
5、比较运算符
比较运算符在逻辑语句中使用,以测定变量或值是否相等。
给定x=5,下面的表格解释了比较运算符:
运算符 | 描述 | 比较 | 返回值 |
== | 等于 | x==8 | false |
== | 等于 | x==5 | true |
=== | 绝对等于(值和类型均相等) | x===“8” | false |
=== | 绝对等于(值和类型均相等) | x===5 | true |
!= | 不等于 | x!=“8” | true |
!== | 不绝对等于(值和类型有一个不相等,或两个都不相等) | x!=="5" | true |
!== | 不绝对等于(值和类型有一个不相等,或两个都不相等) | x!==5 | false |
> | 大于 | x>8 | false |
< | 小于 | x<8 | true |
>= | 大于或等于 | x>=8 | false |
<= | 小于或等于 | x<=8 | true |
一般如何使用呢?
可以在条件语句中,进行运算值进行比较,进而采取不同的结果:
如:
If(age < 18) {
x = “Too Young”;
}
6、逻辑运算符
逻辑运算符用于测定变量或者值之间的逻辑。
给定 x=8 以及 y=4,下表解释了逻辑运算符:
运算符 | 描述 | 例子 |
&& | and | (x < 10 && y > 1) 为 true |
|| | or | (x==5 || y==5) 为 false |
! | not | !(x==y) 为 true |
说明:
&&:运算符左右两边条件都为true时,该结果才为true。
||: 运算符左右两边条件只要有一条为true,该结果就为true。反之,只有当该运算符左右两边都是false时,结果才为false。
!:取反,当x==y是true时,!(x==y)就是false。
7、条件运算符
JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符。
语法
variablename=(condition)?value1:value2
即:condition是true时,variablename = value1;
condition是false时,variablename = value2;
如果变量 age 中的值小于 18,则向变量 voteable 赋值 "年龄太小",否则赋值 "年龄已达到"。
voteable=(age<18)?"年龄太小":"年龄已达到";