JavaScript

JavaScript基础语法

JavaScript代码的书写位置

1.行内式 JS 代码（不推荐）

• 写在标签上的 js 代码需要依靠事件（行为）来触发

a标签 ：
<a href="javascript:alert('helloworld')">点我试试</a>
非a标签 ：添加一个个行为属性 比如onclick
       e.g. :<div onclick="js代码">俺也试试</div>

2.内嵌式 JS 代码

• 内嵌式的 js 代码会在页面打开的时候直接触发

    <script>
        alert('hello world')
    </script>

3.外链式 JS 代码（推荐）

• 外链式 js 代码只要引入了 html 页面，就会在页面打开的时候直接触发
• 新建一个 .js 后缀的文件，在文件内书写 js 代码，把写好的 js 文件引入 html 页面

// 这是demo.js
alert('hello world')

<!-- 这是html文件 -->
<!-- 通过 script 标签的 src 属性，把写好的 js 文件引入页面，建议在html代码下面引入 -->
<script src="index.js"></script>
<!-- 一个页面也可以引入多个 js 文件 -->

JS 中的注释

1.单行注释

• 一般就是用来描述下面一行代码的作用
• 可以直接写两个 / ，也可以按 ctrl + /

// 下面代码表示在浏览器里面出现一个弹出层
alert('我是一个弹出层')

2.多行注释

• 一般用来写一大段话，或者注释一段代码

• 可以直接写

• 可以按快捷键Shift+Alt+A

  /**/
  

  然后在两个星号中间写注释

  • 各个编辑器的快捷键不一样，vscode 是 ctrl + shift + a

/*
    我是一个多行注释
*/

/*
    注释的代码不会执行
    alert('我是一个弹出层')
    alert('我是一个弹出层')
*/
alert('我是一个弹出层')

JS的输出

1.alert()

• alert() 方法用于显示带有一条指定消息和一个 确认 按钮的警告框。

alert(666)

2.console.log()

• console.log() 方法用于在控制台输出信息。该方法对于开发过程进行测试很有帮助。

    console.log("hello world")

3.document.write

• write() 方法可向文档写入 HTML 表达式或 JavaScript 代码。
• 它与console.log()的区别是一个写在文档中，一个在控制台中

变量（重点）

• 变量指的是在程序中保存数据的一个容器
• 变量是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据
• 也就是说，我们向内存中存储了一个数据，然后要给这个数据起一个名字，为了是我们以后再次找到他
• 语法： var 变量名 = 值

1.定义变量及赋值

// 定义一个变量 声明
var num;

// 给一个变量赋值
num = 100;

// 定义一个变量的同时给其赋值 又叫初始化
var num2 = 200;

• 注意：
  1. 一个变量名只能存储一个值
  2. 当再次给一个变量赋值的时候，前面一次的值就没有了
  3. 变量名称区分大小写（JS 严格区分大小写）

2.变量的命名规则和命名规范

• 规则： 必须遵守的，不遵守就是错

  1. 一个变量名称可以由 数字、字母、英文下划线（_）、美元符号（$） 组成
  2. 严格区分大小写
  3. 不能由数字开头
  4. 不能是 保留字 或者 关键字
  5. 不要出现空格

• 规范： 建议遵守的（开发者默认），不遵守不会报错

  1. 变量名尽量有意义（语义化）
  2. 遵循驼峰命名规则，由多个单词组成的时候，从第二个单词开始首字母大写
  3. 不要使用中文

数据类型（重点）

• 是指我们存储在内存中的数据的类型
• 我们通常分为两大类 基本数据类型 和 复杂数据类型

1.基本数据类型

1. 数值类型（number）
   • 一切数字都是数值类型（包括二进制，八进制，十进制，十六进制等）
   • 100 1.5 100e4 infinity -infinity
   • NaN（not a number），一个非数字
2. 字符串类型（string）
   • 被引号包裹的所有内容（可以是单引号也可以是双引号）
3. 布尔类型（boolean）
   • 只有两个（true 或者 false）
4. null类型（null）
   • 只有一个，就是 null，表示空的意思
5. undefined类型（undefined）
   • 只有一个，就是 undefined，表示没有值的意思

2.复杂数据类型（暂时先不讲）

1. 对象类型（object）
2. 函数类型（function）

判断数据类型

• 既然已经把数据分开了类型，那么我们就要知道我们存储的数据是一个什么类型的数据
• 使用 typeof 关键字来进行判断

// 第一种使用方式
var n1 = 100;
console.log(typeof n1);

// 第二种使用方式
var s1 = 'abcdefg';
console.log(typeof(s1));