JavaScript ——【书写方式、输入输出、注释、变量】

1. JavaScript书写方式：

JS 有3种书写位置，分别为行内、内嵌和外部。

1.1 行内式 JS

<input type="button" value="点我试试" onclick="alert('Hello World')" />

• 可以将单行或少量 JS 代码写在HTML标签的事件属性中（以 on 开头的属性），如：onclick
• 注意单双引号的使用：在HTML中我们推荐使用双引号, JS 中我们推荐使用单引号
• 可读性差， 在html中编写JS大量代码时，不方便阅读；
• 引号易错，引号多层嵌套匹配时，非常容易弄混；
• 特殊情况下使用

1.2 内嵌 JS

 <script>
 alert('Hello World~!');
 </script>

• 可以将多行JS代码写到 <script> </script> 标签中

• 内嵌 JS 一般写在head或者body最后面，让别的项目加载完再加载js

1.3 外部 JS 文件

(1)先创建.js文件

(2)通过<script src="js文件名"></script>标签将外部的js文件链接到页面中

<script src="my.js"></script>

• 利于HTML页面代码结构化，把大段 JS代码独立到 HTML 页面之外，既美观，也方便文件级别的复用

• 引用外部 JS文件的 script 标签中间不可以写代码

• 适合于JS 代码量比较大的情况

2. JavaScript的输入输出

为了方便信息的输入输出，JS中提供了一些输入输出语句，其常用的语句如下：

方法	归属	说明
alert(msg)	浏览器	浏览器弹出警示框
console.log(msg)	浏览器	浏览器控制台打印输出信息
prompt(info)	浏览器	浏览器弹出输入框，用户可以输入
confirm(字符串)	浏览器	确认消息框

confirm函数用于提供确认功能，它首先显示给定的message参数所包含的信息，并提供两个可选择的回答“ok”和“cancel”，然后等待用户选择其中的一个。如果用户选择“ok”则返回true；否则，如若选择“cancel”则返回false。

3. JavaScript的注释

3.1 单行注释

为了提高代码的可读性，JS与CSS一样，也提供了注释功能。JS中的注释主要有两种，分别是单行注释和多行注释。
单行注释的注释方式如下：

 alert('Hello World~!');// 我是一行文字，不想被 JS引擎 执行，所以 注释起来
// 用来注释单行文字（ 快捷键 ctrl + / ）

3.2 多行注释

 alert('Hello World~!');
/*
wo
最
帅
*/

/* */ 用来注释多行文字（ 默认快捷键 alt + shift + a ）
以’/*‘开始，以’*/'结束；
快捷键为了顺手可修改为： ctrl + shift + /
vscode >首选项按钮 > 键盘快捷方式 > 查找 原来的快捷键 > 修改为新的快捷键 > 回车确认
在多行注释中可以嵌套单行注释，但是不能嵌套多行注释

4. JavaScript变量

4.1 什么是变量

变量是用于存放数据的容器。 我们通过 变量名 获取数据，数据可以修改。
本质：变量是程序在内存中申请的一块用来存放数据的空间。

4.2 变量的使用

变量在使用时分为两步：

4.2.1 声明变量

 var age; // 声明一个 名称为age 的变量 

• var 是一个 JS关键字，用来声明变量( variable 变量的意思 )。使用该关键字声明变量后，计算机会自动为变量分配 内存空间
• age 是定义的变量名，我们要通过变量名来访问内存中分配的空间
• 声明变量本质是去内存申请空间。

4.2.2.赋值

赋值

age = 10; // 给 age 这个变量赋值为 10 

• = 用来把右边的值赋给左边的变量空间中 此处代表赋值的意思
• 变量值是程序员保存到变量空间里的值

4.2.3 变量的初始化

var age = 18; // 声明变量同时赋值为 18

声明一个变量并赋值， 我们称之为变量的初始化

4.2.4 更新变量

一个变量被重新复赋值后，它原有的值就会被覆盖，变量值将以最后一次赋的值为准。

var age = 18;
age = 81; // 最后的结果就是81因为18被覆盖掉了

4.2.5 同时声明多个变量

同时声明多个变量时，只需要写一个 var， 多个变量名之间使用英文逗号隔开。

var age = 10, name = 'zs', sex = 2; 

4.2.6 声明变量特殊情况

情况	说明	结果
var age ; console.log (age);	只声明 不赋值	undefined
console.log(age)	不声明 不赋值 直接使用	报错
age = 10; console.log (age);	不声明 只赋值	10

4.2.7 变量命名规范

• 由字母(A-Za-z)、数字(0-9)、下划线(_)、美元符号( $ )组成，如：usrAge, num01, _name

• 严格区分大小写。var app; 和 var App; 是两个变量

• 不能 以数字开头。 18age 是错误的

• 不能 是关键字、保留字。例如：var、for、while

• 变量名必须有意义。 MMD BBD nl → age

• 遵守驼峰命名法。首字母小写，后面单词的首字母需要大写。 myFirstName

注意：’+'的作用

(1)算术运算的加法：运算对象必须是数值型数据

(2)连接符：可以将变量和字符串进行连接，连接的结果是一个字符串

var age = 25

var str = “年龄：”+age

4.2.8 变量的交换

<script>
    // 1. 声明一个临时变量temp为空
    // 2. 把apple1 给我们的临时变量 temp 
    // 3. 把apple2 里面的苹果给 apple1 
    // 4. 把临时变量里面的值 给 apple2 
    var temp; // 声明了一个临时变量为空
    var apple1 = '青苹果';
    var apple2 = '红苹果';
    temp = apple1; // 把右边给左边
    apple1 = apple2;
    apple2 = temp;
    console.log(apple1);
    console.log(apple2);
    //两个苹果已经交换位置
</script>