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