简介
JavaScript 是互联网上最流行的脚本语言,这门语言可用于 HTML 和 web,更可广泛用于服务器、PC、笔记本电脑、平板电脑和智能手机等设备。
引入方式
HTML 中的 Javascript 脚本代码必须位于 <script> 与 </script> 标签之间。
Javascript 脚本代码可被放置在 HTML 页面的 <body> 和 <head> 部分中。
Javascript也可以写在外部文件中,扩展名为.js,引入时使用<script> 标签的 "src" 属性中设置该 .js 文件
例如:
<script src="myScript.js"></script>
可以放在<body> 标签中,也可以放在<head>标签中
输出方式
javaScript 可以通过不同的方式来输出数据:
- 使用 window.alert() 弹出警告框。
- 使用 document.write() 方法将内容写到 HTML 文档中。
- 使用 innerHTML 写入到 HTML 元素。
- 使用 console.log() 写入到浏览器的控制台。
字面量
在JavaScript中,一般固定的值称为字面量,通常字面量有:
- 数字(Number)字面量 ,可以是整数或者是小数,或者是科学计数(e)
- 字符串(String)字面量 可以使用单引号或双引号:
- 表达式字面量 用于计算
- 数组(Array)字面量 定义一个数组
- 对象(Object)字面量 定义一个对象
- 函数(Function)字面量 定义一个函数
变量
一般用来存储数据,相当于一个容器,JavaScript 使用关键字 var 来定义变量, 使用等号来为变量赋值。
变量是一个名称,字面量是一个值。
- 变量必须以字母开头
- 变量也能以 $ 和 _ 符号开头(不过我们不推荐这么做)
- 变量名称对大小写敏感(y 和 Y 是不同的变量)
变量声明与赋值
在 JavaScript 中创建变量通常称为"声明"变量。我们使用 var 关键词来声明变量:例如:var a
声明之后变量是没有值得,如需向变量赋值,请使用等号,例如:a = 10
当然我们可以在声明的时候同时赋值,例如:var a=10
可以在一条语句中声明很多变量。该语句以 var 开头,并使用逗号分隔变量即可。
例如:
var lastname="Doe", age=30, job="carpenter";
一条语句中声明的多个变量不可以同时赋同一个值:
var x,y,z=1;
x,y 为 undefined, z 为 1。
JavaScript 对大小写是敏感的。
关键字
JavaScript 关键字用于标识要执行的操作,保留关键字不能用,保留关键字如下
abstract | else | instanceof | super |
boolean | enum | int | switch |
break | export | interface | synchronized |
byte | extends | let | this |
case | false | long | throw |
catch | final | native | throws |
char | finally | new | transient |
class | float | null | true |
const | for | package | try |
continue | function | private | typeof |
debugger | goto | protected | var |
default | if | public | void |
delete | implements | return | volatile |
do | import | short | while |
double | in | static | with |
注释
单行注释用双斜杠(//)来注释,双斜杠后面的语句不会被执行
多行注释以 /* 开始,以 */ 结尾。
语句
JavaScript每行语句写完之后,用分号(;)隔开,一行也可以写多个语句。
语句标识符
JavaScript 语句通常以一个 语句标识符 为开始,并执行该语句。
语句标识符是保留关键字不能作为变量名使用。
下表列出了 JavaScript 语句标识符 (关键字);
语句 | 描述 |
---|---|
break | 用于跳出循环。 |
catch | 语句块,在 try 语句块执行出错时执行 catch 语句块。 |
continue | 跳过循环中的一个迭代。 |
do ... while | 执行一个语句块,在条件语句为 true 时继续执行该语句块。 |
for | 在条件语句为 true 时,可以将代码块执行指定的次数。 |
for ... in | 用于遍历数组或者对象的属性(对数组或者对象的属性进行循环操作)。 |
function | 定义一个函数 |
if ... else | 用于基于不同的条件来执行不同的动作。 |
return | 退出函数 |
switch | 用于基于不同的条件来执行不同的动作。 |
throw | 抛出(生成)错误 。 |
try | 实现错误处理,与 catch 一同使用。 |
var | 声明一个变量。 |
while | 当条件语句为 true 时,执行语句块。 |
数据类型
值类型(基本类型):字符串(String)、数字(Number)、布尔(Boolean)、空(Null)、未定义(Undefined)、Symbol。
引用数据类型(对象类型):对象(Object)、数组(Array)、函数(Function),还有两个特殊的对象:正则(RegExp)和日期(Date)。
注:Symbol 是 ES6 引入了一种新的原始数据类型,表示独一无二的值。
字符串
字符串可以是引号中的任意文本,可以用单引号,也可以用双引号
例如:
var x="hello world ";
var y='hello world ';
可以使用内置属性 length 来计算字符串的长度
var s = x.length;
反斜杠是一个转义字符。 转义字符将特殊字符转换为字符串字符:
转义字符 (\) 可以用于转义撇号,换行,引号,等其他特殊字符。
下表中列举了在字符串中可以使用转义字符转义的特殊字符:
代码 | 输出 |
---|---|
\' | 单引号 |
\" | 双引号 |
\\ | 反斜杠 |
\n | 换行 |
\r | 回车 |
\t | tab(制表符) |
\b | 退格符 |
\f | 换页符 |
字符串属性
属性 | 描述 |
---|---|
constructor | 返回创建字符串属性的函数 |
length | 返回字符串的长度 |
prototype | 允许您向对象添加属性和方法 |
字符串方法
方法 | 描述 |
---|---|
charAt() | 返回指定索引位置的字符 |
charCodeAt() | 返回指定索引位置字符的 Unicode 值 |
concat() | 连接两个或多个字符串,返回连接后的字符串 |
fromCharCode() | 将 Unicode 转换为字符串 |
indexOf() | 返回字符串中检索指定字符第一次出现的位置 |
lastIndexOf() | 返回字符串中检索指定字符最后一次出现的位置 |
localeCompare() | 用本地特定的顺序来比较两个字符串 |
match() | 找到一个或多个正则表达式的匹配 |
replace() | 替换与正则表达式匹配的子串 |
search() | 检索与正则表达式相匹配的值 |
slice() | 提取字符串的片断,并在新的字符串中返回被提取的部分 |
split() | 把字符串分割为子字符串数组 |
substr() | 从起始索引号提取字符串中指定数目的字符 |
substring() | 提取字符串中两个指定的索引号之间的字符 |
toLocaleLowerCase() | 根据主机的语言环境把字符串转换为小写,只有几种语言(如土耳其语)具有地方特有的大小写映射 |
toLocaleUpperCase() | 根据主机的语言环境把字符串转换为大写,只有几种语言(如土耳其语)具有地方特有的大小写映射 |
toLowerCase() | 把字符串转换为小写 |
toString() | 返回字符串对象值 |
toUpperCase() | 把字符串转换为大写 |
trim() | 移除字符串首尾空白 |
valueOf() | 返回某个字符串对象的原始值 |
数字
可以是整数,小数,科学计数法
var x=34.00; //使用小数点来写
var y=34; //不使用小数点来
var z=123e-5; // 0.00123
布尔
只能有两个值,ture或者false
数组
数组下标以0开始,依次增加
var cars=["Saab","Volvo","BMW"];
对象
对象由花括号分隔。
在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。
属性由逗号分隔:
对象这种键值对的写法类似于python中的字典。
var person={name:"John", age:25 , sex:"man"};
对象的寻址方式有两种
name=person.name;
name=person["name"];
Undefined 和 Null
undefined表示"缺少值",就是此处应该有一个值,但是还没有定义。
null表示"没有对象",即该处不应该有值。
函数
使用关键字function来声明,而且由于JavaScript对大小写敏感,所以function必须都要用小写。
格式:
function functionname()
{
// 执行代码
}
带有参数的函数
声明格式:
function myFunction(var1,var2)
{
//代码
}
调用格式:
myFunction(var1,var2)
调用时参数传入的顺序要和声明时的顺序一致。
带有返回值的函数
使用 return 语句来完成。return语句也可以使函数停止,但并不会停止整个JavaScript代码。
例如:
function myFunction()
{
var x=5;
return x;
}
有返回值时,就要用一个变量或者别的来接。例如:
var c = myFunction()
作用域
作用域是在运行时代码中的某些特定部分中变量,函数和对象的可访问性。
在函数内部声明的变量为局部变量,只能在函数内部访问,也就是说它的作用域是整个函数,在函数外面就不能用它了。
全局变量的作用域是全局, 网页中所有脚本和函数均可使用。
事件
HTML 事件是发生在 HTML 元素上的事情。
当在 HTML 页面中使用 JavaScript 时, JavaScript 可以触发这些事件。
常见的HTML事件:
事件 | 描述 |
---|---|
onchange | HTML 元素改变 |
onclick | 用户点击 HTML 元素 |
onmouseover | 鼠标指针移动到指定的元素上时发生 |
onmouseout | 用户从一个 HTML 元素上移开鼠标时发生 |
onkeydown | 用户按下键盘按键 |
onload | 浏览器已完成页面的加载 |
运算符
算术运算符
运算符 | 描述 | 例子 | 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 |
赋值运算符
运算符 | 例子 | 等同于 | 运算结果 |
---|---|---|---|
= | 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 |
比较运算符
运算符 | 描述 | 比较 | 返回值 |
---|---|---|---|
== | 等于 | x==8 | false |
x==5 | true | ||
=== | 绝对等于(值和类型均相等) | x==="5" | 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 |
逻辑运算符
运算符 | 描述 | 例子 |
---|---|---|
&& | and | (x < 10 && y > 1) 为 true |
|| | or | (x==5 || y==5) 为 false |
! | not | !(x==y) 为 true |
条件运算符
类似c语言中的三目运算符
variablename=(condition)?value1:value2
若condition为真则执行value1,否则执行value2