01 JS的组成

- - ES 定义js的语法规范，描述了语言的基本语法和数据类型
  - DOM（document object model）----有一套成熟的可以操作 ==页面元素的 API==，通过 DOM 可以操作页面中的元素。比如：增加个 div，减少个 div，给 div 换个位置等

API:
application programming interface 的简写;
翻译：应用程序编程接口；大白话：别人写好的代码，或者编译好的程序，提供给你使用，就叫作 api

- - BOM (brower object model)------有一套成熟的可以操作 ==浏览器的 API==，通过 BOM 可以操作浏览器。比如：弹出框、浏览器跳转、获取分辨率等

02 JS的书写方式

- 1. 行内式-------缺点：可维护性、可操作性差实际项目中绝对不要使用

😶 必须要写javascript: ;

- 1. 内部式

！注意：

<!-- scirpt标签 定义src属性 内部式程序就不会执行了 --> 
<script src> 
// 定义在script标签中的内部式代码 
// 但是 script标签定义了src属性 这个内部式代码就不会执行了
window.alert('我是内部式程序'); 
</script>

- 3. 外部式

03 JS的变量

1、变量的使用

2、变量的命名规范------案例：变量的交换

2、1 变量由字母、数字、下划线、$符号组成，不能以数字开头，并且其他的特殊字符不可以(eg:

var bigbox123$_ = 222;) (x var 123bigbox= 333;)

2、2 小驼峰命名法-------第一个单词的首字母小写，后面单词的首字母大写（eg:bigBox）

2、3 字母区分大小写

2、4 变量不能是关键字和保留词

eg: 关键字 var let for等

保留词 let----这一类词现在没有什么特殊功能，但是将来的新语法中可能会作为关键字来用

2、5 变量名称----语义化

// 先计算右侧表达式 50+60 的结果 110 // 再将计算结果110 赋值给左侧变量 def 存储 var def = 50+60 ;

04 JS的调试方式---不是最终的执行结果

- - window.alert（' '）；
  - document.write（' '）；
  - console.log（' '）；

05 JS的数据类型

【基本数据类型】

- - - 数值类型 (number)

- - - 1. 整数（100 0 -100）
      2. 浮点数（100.1）
      3. NaN

浮点数三个核心问题：

①有效数值：最多是17位，从左起，第一个非0的数字，开始计算有效数值的位数

②溢出/精度丢失/误差

③科学计数法 2e3就是2乘以10的三次方，结果是2000

NaN(是数值类型，但不是一个具体的数值)

- NaN的两个核心问题：

①有NaN参与的运算结果一定还是NaN

②两个NaN比较是不是相等，结果是false

- isNaN的判断

如果是NaN,返回值是true

如果不是NaN，返回值是false

- - - 字符串类型 (string)

定界符所包裹着的定界符：' ' " "

定界符：

【1】单引号、双引号（拼接字符串）

①单引号、双引号不能包裹/嵌套自身；--solve-- 在单引号或者双引号内使用转义符 /'----'

/"-----" //----

console.log( '贵阳 \'今天天气\' 有点热' ); 
console.log( "贵阳 \"今天天气\" 有点热" );

②单双引号中的内容不能换行； --solve-- 在单引号或者双引号内使用转义符 /n

console.log( "贵阳\n今天天气\n有点热" );

③单引号/双引号不支持解析变量；--solve-- 使用字符串拼接的方法

'字符串'+变量+'字符串' 变量+'字符串' 变量+'字符串'

var temp = 30 ; 
// 单引号 双引号 不会解析变量 
// 字符串中 输入的 temp 对于 单引号 双引号来说 就是 t e m p 四个字符 
// 不是 一个 变量 
// 不会 解析 temp 这个变量 中存储的数据 
// 只会 将 temp变量名称 作为 4个字符 输出 
document.write( '贵阳当前气温是 temp℃ ' ); 
document.write( "贵阳当前气温是 temp℃ " );
//字符串拼接的方法
document.write("贵阳当前的气温是"+temp+"℃")； 
//字符串拼接时注意执行顺序 
console.log(100 + 200 + '贵阳')；//300贵阳 
console.log(100 + '贵阳' + 200)； //100贵阳200

④js的计算功能---eval

    console.log( 5 + 7 ); //12 console.log( 5 + '7' ); //57 console.log( '5' + 7 ); //57 
    console.log('5 + 7'); //5+7 console.log(eval('5 + 7')); //12

【2】反引号（模板字符串）[es6新增的语法]

①不能包裹/嵌套自身；--solve-- /`

②可以换行；

console.log( `贵阳 有什么好吃的 吗?` );

③支持解析变量；----- 通过使用${ 变量}，可以解析变量

// 反引号中解析变量 
var temp = 31 ; 
// 直接定义变量不能解析变量 
console.log( `贵阳当前气温是 temp ℃` ); 
// 将变量使用 ${} 包裹 模板字符串 会 自动解析变量中存储的数据 
// 讲 解析的数据 拼接在字符串中 
// 也就是 ${temp} 的 解析结果是 变量 temp 中 存储的数值 31 
// 也就是 字符串的执行结果是 贵阳当前气温是 31 ℃ 
console.log( `贵阳当前气温是 ${temp} ℃` );
// 可以 解析运算 表达式 将 5+7 的运算结果 12
// 解析到 字符串中 
console.log( `贵阳当前气温是 ${5+7} ℃` );

- - - 布尔类型 (boolean)

true flase

【常见的布尔类型】表单中的 disabled/readonly/mutiple/selected 列表中的reversed

- - - null

- undefined

【引用数据类型】

- 对象

- 数组

- 函数

06 JS的输入框

window.prompt( );

----通过输入框输入数据，输入的数据可以使用变量存储，but实际项目中一般是使用input输入框输入数据

<script> var res = window.prompt('请您输入数据'); console.log( res ); </script>

07 数据类型的检测

（1）为什么？

①js语言是一门动态类型的语言，变量并没有一个单独的数据类型，而是会随着内部存储数据的变化，数据类型也会发生变化

②变量的数据类型，与内部存储数据有关

③将来使用变量时，需要知道内部存储的数据是什么类型，避免程序出错

（2）使用方法：①typeof(变量) ②typeof 变量

实际项目中常用的方法：Objcet.prototype.toString.call( 数据 )；

<script> 
// 数据类型的检测 
// 为什么要检测？ 
// 语法： （1）typeof(变量) （2）typeof 变量 
var a = 100; 
console.log(typeof a); 
//number console.log(typeof(a)); 
//number var b = '哈哈哈'; console.log(typeof b); 
//string var c = true;
console.log(typeof c); 
//boolean var d = undefined; 
console.log(typeof d); 
//undefined var e = null; 
console.log(typeof e); 
//object console.log(Object.prototype.toString.call(e)); 
//[object null] *
</script>

07 数据类型的转换

转换为数值类型----【1】强制转化【2】自动转化
- 【1】强制转化

方法：

<script> 
var a = 100; 
var b = 100.1; 
var c = '嘿嘿嘿嘿'; 
var d = '300'; 
var dd = '300.1'; 
var e = '500skjmn'; 
var ee = ''; 
var eee = ' ';
var f = true; 
var g = false;
var h = undefined; 
var i = null; 
</script>

- 1. Number(需要转换的数据)
  console.log(typeof(Number(c)),Number(c)); //NaN console.log(typeof(Number(d)),Number(d)); //300
- 1. parseInt() -----数据中有数字时有情况，没有数字是结果都是NaN 取整数，忽略小数部分

以纯数字开头时，取数字部分，转换为number；

如果是纯数字，直接转换为number；

如果是纯字母，直接转为NaN

- 1. parseFloat()-------数据中有数字时有情况，没有数字是结果都是NaN 取整数，不忽略小数部分
  2. - 0 操作
  console.log(typeof(c - 0),c - 0); //NaN console.log(typeof(d - 0),d - 0); //300
- 【2】自动转化
- - 1、什么时候转-----算数运算时
  - 2、转化原则

1-----true

0-----false null '' ' '

NaN----undefined

转化为对的数值---字符串内容符合数值语法 / 整数浮点数科学计数法

转换为字符串----【1】强制转化【2】自动转化
- 【1】强制转化

- 1. String(变量) ------其他的数据类型都可以通过该方法转换为字符串类型

console.log(typeof(String(a)),String(a)); console.log(typeof(String(b)),String(b));

- 1. 变量.toString()-------不能是undefined和null数据类型转换为字符串类型

console.log(typeof(f.toString()),f.toString()); console.log(typeof(g.toString()),g.toString());

- 【2】自动转化
- - 1、什么时候转化？ ----字符串拼接时，其他数据类型转化为字符串类型
  - 2、转化原则---将数据转化为对应的字符串内容

转换为布尔类型-----【1】强制转化【2】自动转化
- 【1】强制转化

- 1. Boolean(变量)
  console.log(typeof(Boolean(c)),Boolean(c)); console.log(typeof(Boolean(d)),Boolean(d)); console.log(typeof(Boolean(dd)),Boolean(dd));
- 【2】自动转化
- - 1、什么时候转？ ---if()语句逻辑运算符三元运算符
  - 2、转化原则

false ----- 0 0.000 '' null undefined NaN

true------除了以上的情况外的所有

【一】 JS的基础