JavaScript基本语法
a. JavaScript 是一种轻量级的、基于对象和事件驱动的、跨平台的客户端脚本语言。
b. JavaScript 是用来制作web页面交互效果,提升用户体验(具有简单易用, 解释执行,基于对象等特点)
1.引入方式
序号 | 语法 | 功能 |
1 | < script type=”text/javascript” src=”main.js”>< /script> | 导入外部js文件 |
2 | < script type=”text/javascript”>< /script> | 写在body的最下方 |
2.输出方式
序号 | 语法 | 功能 |
1 | window.alert() | 弹出对话框提示 |
2 | document.write() | 将内容写入到 HTML 文档中 |
3 | console.log() | 从浏览器控制台输出 |
4 | document.getElementById(‘p1’).innerHTML = ‘innerHTML’; | 显示在指定的标签中 |
3.变量
语法格式:var 变量名 = 变量值
变量的命名规则:
a. 变量名可以包含字母、数字、下划线、美元符号$。
b. 变量名不能以数字开头,可以以字母或下划线开头。如:var _name;(正确) var 3abc;(语法错误)
c. 变量名不能是系统关键字,如:var、switch、try、case、else、while等。
d. JS中的变量名是区分大小写的。如:name和Name是两个变量。
e. JS中变量的名称一定要有意义,也就是常说的语义化。
f. 驼峰式命名。
g. 下划线式命名。
4.数据类型
typeof() : 查看数据类型
序号 | 类型 | 语义 |
1 | String | 字符串 |
2 | Number | 数字型 |
3 | Boolean | 布尔型 |
4 | Array | 数组型 |
5 | Object | 对象型 |
6 | Null | 空型 |
7 | Undefined | 未定义型 |
5.运算符
序号 | 功能 | 运算符 |
1 | 算术运算符 | +、 -、 *、 /、 %、 ++、 – |
2 | 赋值运算符 | =、 +=、 -=、 *=、 /=、 %= |
3 | 比较运算符 | >、 <、 >=、 <=、 !=、 !==、 ==、 === |
4 | 逻辑运算符 | && (and)、 || (or)、 ! (not) |
6.条件语句
序号 | 语法 | 功能 |
1 | if 语句 | 只有当指定条件为 true 时,使用该语句来执行代码 |
2 | if…else 语句 | 当条件为 true 时执行代码,当条件为 false 时执行其他代码 |
3 | if…else if….else 语句 | 使用该语句来选择多个代码块之一来执行 |
4 | switch 语句 | 使用该语句来选择多个代码块之一来执行 |
5 | 条件表达式?结果1:结果2 | 三元运算符 ( 三目运算符 ) |
基本结构形式如下:
(1). if单分支选择结构:
if条件判断----只判断true,不判断false。
语法结构:
if(条件判断,结果只要两个true或false)
{
条件为true,将执行该代码
}
(2). if...else双分支选择结构:
语法结构-----既判断true,又判断false。
if(条件判断:结果只有两个true或false)
{
条件为true,将执行该代码
}else
{
条件为false,将执行该代码
}
(3). if...else if...else多分支选择结构:
语法结构语句来选择多个代码块之一来执行
if (条件1)
{
当条件 1 为 true 时执行的代码
}
else if (条件2)
{
当条件 2 为 true 时执行的代码
}
else
{
当条件 1 和 条件 2 都不为 true 时执行的代码
}
(4)switch 语句是用来选择要执行的多个代码块之一
switch(n)
{
case 1:
执行代码块 1
break;
case 2:
执行代码块 2
break;
default:
与 case 1 和 case 2 不同时执行的代码
}
(5)三元运算符(三目运算符)
语法:条件表达式?结果1:结果2
语法:操作数!?操作数2:操作数3
含义:如果条件为true,则执行"结果1"的代码;如果条件为false,则执行"结果2"的代码。
其实:三元运算符,就是if else的变形形式
7.循环结构
序号 | 语法 | 功能 |
1 | for循环 | 循环代码块一定的次数 |
2 | for in循环 | 循环遍历对象的属性 |
3 | while循环 | 当指定的条件为 true 时循环指定的代码块 |
4 | do while循环 | 同样当指定的条件为 true 时循环指定的代码块 |
基本循环结构语法如下:
(1) for循环:
for (变量初始化; 条件判断; 变量更新)
{
循环体代码
}
(2)for in 循环:
var person={name:"hanbo", age:23};
for (x in person) // x 为属性名
{
txt=txt + person[x];
}
(3)while循环:
while(条件判断)
{
如果条件为true,则执行循环体代码
}
(4)do while循环: 先斩后奏,先执行一次
表达式1; //表达式1:从哪里开始
do
{
语句组; //当我们满足循环时要执行的语句
表达式3; //步长(步进)
}
while()表达式2: //到哪里结束(循环条件)
注意:循环体中,应有结束循环的条件,否则会造成死循环。
在循环中break是终止循环, continue是跳过本次循环继续循环
8.函数
语法:
function foo(形参1, 形参2, ...)
{
函数功能代码
return 参数(表达式);
}
foo(实参1, 实参2, ...); //调用函数
prototype:给类添加方法:
类名.prototype.方法名 = 函数
Number.prototype.sum = function(num)
{
// body...
// js中this就相当于python中的self;谁调用当前这个方法,this就指向谁
return this+num;
};
var a = 20
var b = a.sum(30);
console.log('b:',b); >>>b:50