[TOC]

浏览器内核

通常所谓的浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同，因此同一网页在不同的内核的浏览器里的渲染（显示）效果也可能不同。

blink（webikt 内核的升级）（Google Chrome/ Safari /Opera/ 大部分的国产和手机浏览器）
Gecko（[ˈɡekəʊ]）内核（Firefox 火狐）
Presto （[ˈprestəʊ]）欧朋
Trident （ie浏览器）

JAVASCRIPT历史
JavaScript诞生于1995年
设计的主要目的是处理以前由服务器端语言负责的一些输入验证操作

历史背景：第一次互联网大战就发生在网景和IE之间，也就是微软。网景是最早做浏览器的一个平台，平台叫netspace navigator 1,微软做的第一款叫IE1.0。

1995年，网景发布了浏览器netspace navigator 2，在1的版本嵌入了一个脚本语言，并且是可编程的脚本语言，还是免费的。取名LiveScript，目的是为了处理验证由服务器端语言负责的一些输入验证操作。

由于java非常火，得到sun公司（java属于sun）的授权改名JavaScript。

由于JavaScript大受欢迎，网景公司在发布浏览器3版本的时候，顺便发布了JavaScript1.1版本。

此时微软这个大厂商，想把浏览器直接植入到电脑里，安装就与这个浏览器，并且浏览器里也有这个语言，微软推出JScript。由于这个历史遗留原因，接下来学习就有很多兼容性问题。

在1997年，有一个“欧洲计算机制造商协会”，（简称 ECMA），拿了JavaScript1.1版本制定了规范并且发布，ECMA-262。也叫ECMAScript，作为各自使用的标准

ECMAScript版本：

1998年，2.0版本ES2.0； 1999年，3.0版本（重点看，成为了JavaScript的通用标准，广泛支持）； 2007年，ES4.0草案发布，最终只是抽取一部分内容发布为ES3.1;其实也是后来的ES5（因为4已经被命名并且被驳回了）； 2009年，正式发布ES5； 2013年，ES6草案发布（内容就是当时ES4提出的）； 2015年，ES6正式发布，并且命名为ES2015；以后每年更新一个版本，以年号命名，以此类推；

为什么学JavaScript

所有主流浏览器都支持JavaScript
目前，全世界大部分网页都使用JavaScript
他可以让网页呈现各种动态效果
作为一个Web开发工程师，如果你想提供漂亮的网页、令客户满意的上网体验，JavaScript是必不可少的工具

JS的构成
ECMAScript：语言的核心（语法）
DOM（文档对象模型）：Document Object Model，提供了一系列的应用程序接口（api），供我们开发者对DOM的添加删除修改等（说白了就是操作标签的）
BOM（浏览器对象模型）：Browser Object Model，客户端和浏览器端窗口操作的基础（操作浏览器窗口的），可以使用BOM对浏览器窗口进行访问和操作，比如移动窗口位置、返回历史记录等等，但是BOM没有一个成型的规范，但是所有的浏览器都支持。

any application that can be written in JavaScript, will eventually be written in JavaScript
译:”任何可以用 JavaScript 来写的应用，最终都将用 JavaScript 来写”

什么是JavaScript：

JavaScript是一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。

JS引入的几种方式
```javascript <!DOCTYPE html>

box
//行内式：通过事件引入（有限制性）
11111

<a name="VE8EK"></a>
## JavaScript命名规范

- 区分大小写
- 名字以数字，字母、下划线、$ 符号组成，（但是不能以数字开头）
- 不能是关键字或者保留字，
   - 关键字，就是代表特殊含义和功能的名字，
      - 比如 var、function、break、else、new、var、 case、  finally 、 return、 void 、 catch  、for  、switch 、 while 、 continue、this 、 with 、default 、 if 、 throw 、 delete 、 in 、  try 、do 、 instranceof、  typeof
   - 保留字，就是现在还不是关键字，但是以后有可能会被规定成关键字，预先保留着。
      - 比如：abstract 、 enum   、int 、 short 、 boolean  、export  、interface、  static、  byte  、extends 、 long 、 super 、 char 、 final  、native  、synchronized 、 class  、float 、 package  、throws 、 const  、goto  、private 、transient 、 debugger 、 implements  、protected 、 volatile 、 double  、import  、public
- 命名要有语义化，可以遵循：
   - 小驼峰命名法（驼峰命名法）：首单词的首字母小写，其余单词的首字母大写，例如：studentMessage
   - 大驼峰命名法(又叫帕斯卡命名法)：跟小驼峰命名法类似，只不过是每个单词的首字母都大写，例如：StudentMessage
   - 下划线命名法：要求单词与单词之间通过下划线连接即可。例如：my_name
<a name="V4xD4"></a>
## 注释
> 单行注释：//
> 多行注释：/*多行注释*/

<a name="Srmhf"></a>
## 语句
js的语句是以；为结尾的<br />虽然不一定是必须的，但是我们建议不省略<br />代码块结束以后可以省略
<a name="sUOHF"></a>
## 变量
> 变量相当于容器，值就是容器中盛放的内容，变量名字就是贴在容器上的标签，通过这个标签可以找到变量，读取使用它。
> 
> 在计算机中，变量就是给一个内存区域起的一个代号，通过这个代号把相应的数据存放在这里。
> 
> 在ECMAScript中，变量是松散类型的（弱类型、动态类型），也就是一个变量可以保存任何类型的值

<a name="Wjzyi"></a>
### 定义一个变量并使用
在js语法中，使用var（目前）加 变量名 = 数据；<br />var name="xiaoxiaohui"  (把等号后面的值赋给了前面定义的变量)

还可以给多个变量同时赋值，或者是同时定义，使用逗号隔开
```javascript
var sex="女",age="18"；

可以给同一个变量多次赋值或者多次定义

var age=18;
age=19;
console.log(age);

数据类型

1 JS 中数据类型的划分

1.1 原始值类型

Number 数值
String 字符串
Boolean 布尔值 true(真)/false（假）
Null 空
Undefined 未定义
Symbol
BigInt

1.2 引用数据类型
Array
Object
Function
RegExp
Math
Date
……….

2 原始值类型介绍

2.1 number 数值类型

① 整型（整数）

② 浮点（小数）
直接写小数
浮点的精度问题（十进制小数转为二进制小数，大部分无法精确转换；整数不存在这个问题）
- 0.1+0.2=0.3
  ③ JS中数值的范围
JS 中的Number数据类型只能安全地表示-9007199254740991 (-(2^53-1)) 和9007199254740991(2^53-1)之间的整数，任何超出此范围的整数值都可能失去精度。

④ 特殊的数值 NaN
NaN是number类型，是一个数值，表示非有效数字
特点1：NaN与任何数进行任何运算结果都是NaN
特点2：NaN与任何数都不相等，包括自己
⑤ 数值相关的运算符

- - / %
    ⑥相关函数
    isNaN()
    想要验证一下n是不是有效数字：
- isNaN 验证一个值是否为非有效数字，如果是有效数字，则返回false，如果不是有效数字，则返回true ```javascript console.log(isNaN(1)); console.log(isNaN(NaN));

console.log(isNaN(‘AA’)); console.log(isNaN(‘12.5’)); console.log(isNaN(‘12.5px’)); console.log(isNaN([])); console.log(isNaN([10])); console.log(isNaN([10, 20])); console.log(isNaN({})); console.log(isNaN(null)); console.log(isNaN(undefined)); console.log(isNaN(Symbol(1)));

Number（）<br />Number是JS内置的转换方法，可以把其它数据类型“强制”转换为数字类型<br />         *   + 把字符串转换为数字：一但字符串中出现非有效数字字符，则结果为NaN，<br /> 只有都是有效数字字 符，才能转换为具体的数字，空字符串会转换为0<br />         *   + 把布尔转换为数字：true转换为1  false转换为0<br />         *   + 把空转换为数字：null转换为0 undefined转换为NaN<br />         *   + 不能把Symbol类型转换为数字，否则会报错 <br />    ![image.png](https://cdn.nlark.com/yuque/0/2022/png/21621156/1647167435865-8883ce6d-4109-4b8f-9a13-88ee0fdc867b.png#clientId=uee4ed63c-5d4e-4&crop=0&crop=0&crop=1&crop=1&from=paste&height=325&id=u78ff991d&margin=%5Bobject%20Object%5D&name=image.png&originHeight=716&originWidth=1266&originalType=binary&ratio=1&rotation=0&showTitle=false&size=99118&status=done&style=none&taskId=u56b11071-9410-4197-9901-11685fc3056&title=&width=575.4545329819043)
```javascript
console.log(Number('12'));
console.log(Number('12.5'));
console.log(Number('12px'));
console.log(Number('12.5.0'));
console.log(Number(true));
console.log(Number(false));
console.log(Number(null));
console.log(Number(undefined));
console.log(Number(Symbol(13)));
console.log(Number(function func() { }));

parseInt()/parseFloat():

也是把其它数据类型转换为number类型的
处理原理和Number不一样，他们是把字符串转换为数字类型（如果处理的值不是字符串，需要先转换为字符串然后再去转换为number类型的）
从字符串最左边开始查找，把找到的有效数字字符转换为数字，一直遇到一个非有效数字字符为止，则结束查找 ```javascript console.log(Number(‘12px’)); console.log(parseInt(‘12px’)); console.log(parseInt(‘12px24’)); console.log(parseInt(‘width:12px’)); console.log(parseInt(‘12.5px’)); console.log(parseFloat(‘12.5px’));

console.log(Number(true)); console.log(parseInt(true)); console.log(parseInt(‘true’)); console.log(parseInt(NaN)); console.log(Number(null)); console.log(parseInt(null)); console.log(isNaN(Number(parseInt(“0.8”))));

console.log(Number(‘’)); console.log(parseInt(‘’)); ``` toFixed()
保留小数点后面N位（最后的结果是一个字符串）
Number.MAX_SAFE_INTEGER
console.log(Number.MAX_SAFE_INTEGER); //=>9007199254740991
最大安全数（JS能够有效识别的最大整数）
console.log(9007199254740992 == 9007199254740993); //=>true
应该是不一样的，但是超过了最大数值，JS无法精准计算

2.2 BigInt:管理超过安全数值的数字

ES6中提供了一个新的数据类型 BigInt：管理超过安全数值的数字
console.log(BigInt(9007199254740992), BigInt(9007199254740993));

2.3 string 字符串类型

① 定义字符串

在JS中用单引号/双引号/反引号包起来的都是字符串
② 相关函数
String()

2.4 boolean 布尔值
布尔值表示真或假开或关是或否。
有 true 和 false 两个值

数字转为布尔值： 0转为false，NaN转为false；其他都是true 字符串转为布尔值：空字符串转为false，其他都是true null 转为 flase undefined 转为 false 总结：除了0 “” null undefined NaN为false，其他都是true

2.4 null 和 undefined

null表示没有，即该处不应该有值：
1）在我们不确定一个变量具体数据类型的时候，我们可以先赋值为null，后面可以再给具体的值。。
2）作为对象原型链的终点。
3）获取 DOM 获取不到的时候。
undefined表示缺少值，即此处应该有值，但没有定义：
1）定义了变量没有给值，显示 undefined。
2）定义了形参，没有传实参，显示 undefined。
3）对象属性名不存在时，显示 undefined。
4）函数没有写返回值，即没有写return，拿到的是 undefined。
5）写了return，但没有赋值，拿到的是 undefined。

JAVASCRIPT前三周内容

JS-第一周day01

浏览器内核

JAVASCRIPT历史

ECMAScript版本：

为什么学JavaScript

JS的构成

any application that can be written in JavaScript, will eventually be written in JavaScript

什么是JavaScript：

JS引入的几种方式

数据类型

1 JS 中数据类型的划分

1.1 原始值类型

1.2 引用数据类型

2 原始值类型介绍

2.1 number 数值类型

① 整型（整数）

② 浮点（小数）

③ JS中数值的范围

④ 特殊的数值 NaN

⑤ 数值相关的运算符

⑥相关函数

2.2 BigInt:管理超过安全数值的数字

2.3 string 字符串类型

① 定义字符串

② 相关函数

2.4 boolean 布尔值

2.4 null 和 undefined

JS-第一周day01

浏览器内核

JAVASCRIPT历史

ECMAScript版本：

为什么学JavaScript

JS的构成

any application that can be written in JavaScript, will eventually be written in JavaScript

什么是JavaScript：

JS引入的几种方式

数据类型

1 JS 中数据类型的划分

1.1 原始值类型

1.2 引用数据类型

2 原始值类型介绍

2.1 number 数值类型

① 整型 （整数）

② 浮点 （小数）

③ JS中数值的范围

④ 特殊的数值 NaN

⑤ 数值相关的运算符

⑥相关函数

2.2 BigInt:管理超过安全数值的数字

2.3 string 字符串类型

① 定义字符串

② 相关函数

2.4 boolean 布尔值

2.4 null 和 undefined

① 整型（整数）

② 浮点（小数）