练习向----- js三大核心—变量—浏览器输出语法—js 的数据类型—检测数据类型—数据类型转换—检测非数字的方法—运算符—条件分支 - if - switch

一、 js 的书写位置

行内式(强烈不推荐)

• a 标签
  在 href 属性上书写 javascript: 一段js代码 ;
  当你点击该 a 标签的时候, 会执行这一段 js 代码

• 非 a 标签

需要在标签上添加一个行为属性onclick
在属性值的位置直接书写 js 代码即可
内嵌式(不太推荐)
把 js 代码书写在一个 script 标签对内
注意:

1. script 标签可以书写在页面任何位置
   一般推荐书写在 head 的末尾或者 body 的末尾
2. script 标签内的 js 代码不需要任何行为, 打开页面就会执行
3. 一个页面可以书写多个 script 标签, 会按照从上到下的顺序依次执行

外链式(推荐)

把 js代码书写在一个.js后缀的文件内
在当前页面内以 script 标签的 src 属性引入

注意:

1. src 属性, 不是href
2. script 标签可以书写在页面任何位置 一般推荐书写在 head 的末尾或者 body 的末尾
3. script 标签内的 js 代码不需要任何行为, 打开页面就会执行
4. 一个页面可以书写多个 script 标签, 会按照从上到下的顺序依次执行
5. 当一个 script 标签被当做外链式引入一个 js 文件以后, 不能当做内嵌式使用了

• 第一段 js 代码
  语法: alert(‘文本内容’)
  注意: 小括号内的内容如果不是纯数字, 那么要使用引号包裹(单引号或者双引号)
  作用: 在浏览器出现一个弹出层(提示框), 显示对应的文本内容

<!-- a 标签行内式 -->
<a href="javascript: alert('努力努力1') ;">this</a>

<!-- 非 a 标签行内式 -->
<div onclick="alert('努力努力2')">this</div>

<!-- 内嵌式 js 代码 -->
<script>
	 alert('努力努力3')
</script>

<!-- 外链式 js 代码 -->
<script src="./js/day02.js"></script>

二、js三大核心

1. DOM - Document Obejct Model 文档对象模型
   • 本质: 把所有的和页面元素相关的内容抽象出来, 做成一个模型 API
   • 私人: 规定了文档的显示结构，可以轻松地删除、添加和替换节点
2. BOM - Borwser Obejct Model 浏览器对象模型
   • 本质: 把所有的和浏览器相关的内容抽象出来, 做成一个模型 API
   • 私人: 操作和浏览器相关的属性和方法，浏览器自带的功能
3. ECMAScript(ES)
   • js 的语法标准

三、变量

变量的命名规则和规范
规则:
1. 变量只能由 数字(0-9) 字母(a-zA-Z) 美元符($) 下划线(_) 组成
2. 变量不能由 数字 开头
3. 严格区分大小写
4. 不能使用关键字或者保留字
规范：
1. 变量语义化
2. 驼峰命名法
3. 不要用中文

/*
  多行注释
*/

// 单行注释

js 的变量
    + 在程序的运行过程中用来保存一个中间值的内容
    + 例子:
      => 202308051s 是多少天 ?
      => 202308051 / 60 / 60 / 24
      => 提前准备一个变量: 叫做 n, 保存的值是 60 * 60 * 24
      => 再次计算的时候, 202308051 / n 就可以

  语法:
    + 定义变量: var 变量名 = 值
      => var 定义变量的关键字, 告诉浏览器, 我要定义变量了
      => 变量名: 你自己定义的名字
      => 等于号(=): 赋值符号, 把右边的内容给到左边的变量
      => 值: 该变量存储的内容

• 定义变量
  • 定义了一个叫做 n 的变量, 保存的值是 100
  • 将来只要你使用 n 这个变量的时候, 就是在使用 100 这个值

例子: n * 22 等价于 100 * 22

var n = 100;

• 定义多个

  • 多个之间使用 逗号(,) 分隔

var n = 100, m = 200;

四、 浏览器输出语法

• 在浏览器输出一些内容

• 目的:

  1.展示给用户看到
  2. 排错 / 检验

语法

• 弹出层alert('文本内容')
• 控制台console.log('文本内容')
• 页面输出document.write('文本内容')

共同点

• 当你在小括号内书写内容的时候
  => 如果有引号包裹, 表示你要输出的是一段没有意义的文本
  => 如果没有引号包裹, 表示你要输出的是 纯数字, 布尔值 或者 变量

五、js 的数据类型

• 基础数据类型(简单数据类型)

=> Number 数值
=> String 字符串
=> Boolean 布尔
=> Undefined 空
=> Null 空

• 复杂数据类型(引用数据类型（地址）)

=> Object
=> Function
=> 以后再说

Number 数值

+ 整数
+ 浮点数(小数)
+ 科学计数法
+ 其他进制表示方式
	=> 二进制     0b 开头
	=> 八进制     0o 开头
	=> 十六进制   0x 开头
+ NaN(Not a Number): 非数字

var n1 = 100
var n2 = -100
var n3 = 100.222
var n4 = -234.567
// e5 表示 10 的 5 次方
// 10e5 表示 10 * 10^5
var n5 = 10e5
console.log(n5)

String 字符串

+ 就是一段文本
+ 所有被引号包裹的内容都叫做 字符串
	=> 单引号或者双引号无所谓
+ 在 JS 内被 反引号(``) 包裹的也叫作字符串
	=> 叫做 模板字符串

var s1 = 'hello world'
var s2 = "hello world"
var s3 = `hello world`
console.log(s1)
console.log(s2)
console.log(s3)

模板字符串

1. 可以换行书写字符串(``)
	=> 单引号和双引号不行,会报错
2. 可以直接解析变量
	=> 当你需要在字符串内插入一段变量内容的时候
	=> 直接书写 ${
   
    变量 }

var s1 = '<div><div></div><div></div><div></div><div></div></div>'
    console.log(s1)
var s2 = `
      <div>
        <div></div>
      </div>
    `
    console.log(s2)
var s3 = "${n}"
    console.log(s3)
var s4 = `${
     
     n}`
    console.log(s4)

六、检测数据类型

+ typeof 检测