春花秋月何时了,往事知多少。此付费专栏不要订阅,不要订阅,听人劝。
🌹作者主页:青花锁 🌹简介:Java领域优质创作者🏆、Java微服务架构公号作者😄
🌹简历模板、学习资料、面试题库、技术互助🌹文末获取联系方式 📝
系列专栏目录
[Java项目实战] 介绍Java组件安装、使用;手写框架等
[Aws服务器实战] Aws Linux服务器上操作nginx、git、JDK、Vue等
[Java微服务实战] Java 微服务实战,Spring Cloud Netflix套件、Spring Cloud Alibaba套件、Seata、gateway、shadingjdbc等实战操作
[Java基础篇] Java基础闲聊,已出HashMap、String、StringBuffer等源码分析,JVM分析,持续更新中
[Springboot篇] 从创建Springboot项目,到加载数据库、静态资源、输出RestFul接口、跨越问题解决到统一返回、全局异常处理、Swagger文档
[Spring MVC篇] 从创建Spring MVC项目,到加载数据库、静态资源、输出RestFul接口、跨越问题解决到统一返回
[华为云服务器实战] 华为云Linux服务器上操作nginx、git、JDK、Vue等,以及使用宝塔运维操作添加Html网页、部署Springboot项目/Vue项目等
[Java爬虫] 通过Java+Selenium+GoogleWebDriver 模拟真人网页操作爬取花瓣网图片、bing搜索图片等
[Vue实战] 讲解Vue3的安装、环境配置,基本语法、循环语句、生命周期、路由设置、组件、axios交互、Element-ui的使用等
[Spring] 讲解Spring(Bean)概念、IOC、AOP、集成jdbcTemplate/redis/事务等
前言
本章介绍JavaScript的语法,包括注释、变量命名规则、变量定义、JavaScript数据类型等。
1、注释
单行注释以双斜杠//开头
多行注释以/*开头,以/结尾
/**
* 登录方法
* @param name 用户名
* @param pwd
* @returns {*}
*/
2、变量
2.1、命名规则
在 JavaScript 中,变量名称并不能随便定义,需要遵循标识符的命名规则,如下所示:
- 变量名中可以包含数字、字母、下划线_、美元符号$;
- 变量名中不能出现汉字;
- 变量名中不能包含空格;
- 变量名不能是 JavaScript 中的关键字、保留字;
- 变量名不能以数字开头,即第一个字符不能为数字。
2.2、变量定义
2.2.1、var 变量名
var num =1;// 定义一个变量 num 并将其赋值为 1
var a =2, b =3, c =4;// 同时定义 a、b、c 三个变量并分别赋值为 2、3、4
2.2.2、变量提升
document.write(str); //显示undefined
str = "http://baidu.com/";
document.write(str);//显示 http://baidu.com/
var str;
2.2.3、let 和 const 关键字
使用 let 关键字声明的变量只在其所在的代码块中有效
const定义常量
const PI =3.1415// 声明一个常量 PI,并赋值为 3.1415
console.log(PI)// 在控制台打印 PI
3、JavaScript的数据类型
JavaScript 是一种动态类型的语言,在定义变量时不需要提前指定变量的类型,变量的类型是在程序运行过程中由 JavaScript 引擎动态决定的
3.1、基本数据类型(值类型)
字符串(String)、数字(Number)、布尔(Boolean)、空(Null)、未定义(Undefined)、Symbol( Symbol表示独一无二的值)
var str ="123";
var sym1 =Symbol(str);
var sym2 =Symbol(str);
console.log(sym1);// 输出 Symbol(123)
console.log(sym2);
3.2、引用数据类型
对象(Object)、数组(Array)、函数(Function)
3.2.1、Object 类型
JavaScript 中的对象(Object)类型是一组由键、值组成的无序集合,定义对象类型需要使用花括号{ },语法格式如下:
{name1: value1, name2: value2, name3: value3, ..., nameN: valueN}
Object.name1 = value1
3.2.2、Array 类型
数组(Array)是一组按顺序排列的数据的集合,数组中的每个值都称为元素,而且数组中可以包含任意类型的数据
[1,2,3,'hello',true,null]
new Array(1,2,3,4);
3.2.3、Function 类型
函数(Function)是一段具有特定功能的代码块,函数并不会自动运行,需要通过函数名调用才能运行
function sayHello(name){
return"Hello, "+ name;
}
var sayHello = function(name) {
return"Hello, "+ name;
}
var res =sayHello("Peter");
console.log(res);// 输出 Hello, Peter
3.2.3.1、typeof 操作符
获取变量类型
typeof x;// 获取变量 x 的数据类型
typeof(x);// 获取变量 x 的数据类型
3.2.4、运算符
3.2.4.1、算术运算符
运算符 描述 示例
+ 加法运算符 x + y 表示计算 x 加 y 的和
- 减法运算符 x - y 表示计算 x 减 y 的差
* 乘法运算符 x * y 表示计算 x 乘 y 的积
/ 除法运算符 x / y 表示计算 x 除以 y 的商
% 取模(取余)运算符 x % y 表示计算 x 除以 y 的余数
3.2.4.2、赋值运算符
运算符 | 描述 | 示例 |
---|---|---|
= | 最简单的赋值运算符,将运算符右侧的值赋值给运算符左侧的变量 | x = 10 表示将变量 x 赋值为 10 |
+= | 先进行加法运算,再将结果赋值给运算符左侧的变量 | x += y 等同于 x = x + y |
-= | 先进行减法运算,再将结果赋值给运算符左侧的变量 | x -= y 等同于 x = x - y |
*= | 先进行乘法运算,再将结果赋值给运算符左侧的变量 | x *= y 等同于 x = x * y |
/= | 先进行除法运算,再将结果赋值给运算符左侧的变量 | x /= y 等同于 x = x / y |
%= | 先进行取模运算,再将结果赋值给运算符左侧的变量 | x %= y 等同于 x = x % y |
3.2.4.3、字符串运算符
JavaScript 中的+和+=运算符除了可以进行数学运算外,还可以用来拼接字符串,其中:
- +运算符表示将运算符左右两侧的字符串拼接到一起;
- +=运算符表示先将字符串进行拼接,然后再将结果赋值给运算符左侧的变量
3.2.4.4、自增、自减运算符
运算符 | 名称 | 影响 |
---|---|---|
++x | 自增运算符 | 将 x 加 1,然后返回 x 的值 |
x++ | 自增运算符 | 返回 x 的值,然后再将 x 加 1 |
–x | 自减运算符 | 将 x 减 1,然后返回 x 的值 |
x– | 自减运算符 | 返回 x 的值,然后将 x 减 1 |
3.2.4.5、比较运算符
运算符 名称 示例
== 等于 x == y 表示如果 x 等于 y,则为真
=== 全等 x === y 表示如果 x 等于 y,并且 x 和 y 的类型也相同,则为真
!= 不相等 x != y 表示如果 x 不等于 y,则为真
!== 不全等 x !== y 表示如果 x 不等于 y,或者 x 和 y 的类型不同,则为真
< 小于 x < y 表示如果 x 小于 y,则为真
> 大于 x > y 表示如果 x 大于 y,则为真
>= 大于或等于 x >= y 表示如果 x 大于或等于 y,则为真
<= 小于或等于 x <= y 表示如果 x 小于或等于 y,则为真
3.2.4.6、逻辑运算符
运算符 名称 示例
&& 逻辑与 x && y 表示如果 x 和 y 都为真,则为真
|| 逻辑或 x || y 表示如果 x 或 y 有一个为真,则为真
! 逻辑非 !x 表示如果 x 不为真,则为真
3.2.4.7、三元运算符
条件表达式 ? 表达式1 : 表达式2 ;
4、输出语句
- 使用 alert() 函数来弹出提示框;
- 使用 confirm() 函数来弹出一个对话框;
- 使用 document.write() 方法将内容写入到 HTML 文档中;
- 使用 innerHTML 将内容写入到 HTML 标签中;
- 使用 console.log() 在浏览器的控制台输出内容。