浏览器内核
通常所谓的浏览器内核也就是浏览器所采用的渲染引擎，渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同，因此同一网页在不同的内核的浏览器里的渲染（显示）效果也可能不同。
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引入的几种方式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script>
// 当页面中所有的资源都加载完毕之后再加载
//第三种
window.onload=function(){
var box=document.getElementById("box");
console.log(box);
}
</script>
</head>
<body>
<div id="box">box</div>
//行内式：通过事件引入（有限制性）
<div onclick="alert(1111)">11111</div>
</body>
</html>
<script>
// 第一种
// var box=document.getElementById("box");
</script>
<!-- 第二种：单独引入js文件 -->
<script src="11.js"></script>
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
注释
单行注释：//
多行注释：/*多行注释*/
语句
js的语句是以；为结尾的
虽然不一定是必须的，但是我们建议不省略
代码块结束以后可以省略
变量
变量相当于容器，值就是容器中盛放的内容，变量名字就是贴在容器上的标签，通过这个标签可以找到变量，读取使用它。
在计算机中，变量就是给一个内存区域起的一个代号，通过这个代号把相应的数据存放在这里。
在ECMAScript中，变量是松散类型的（弱类型、动态类型），也就是一个变量可以保存任何类型的值
定义一个变量并使用
在js语法中，使用var（目前）加 变量名 = 数据；
var name="xiaoxiaohui" (把等号后面的值赋给了前面定义的变量)
还可以给多个变量同时赋值，或者是同时定义，使用逗号隔开
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
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（）
Number是JS内置的转换方法，可以把其它数据类型“强制”转换为数字类型
* + 把字符串转换为数字：一但字符串中出现非有效数字字符，则结果为NaN，
只有都是有效数字字 符，才能转换为具体的数字，空字符串会转换为0
* + 把布尔转换为数字：true转换为1 false转换为0
* + 把空转换为数字：null转换为0 undefined转换为NaN
* + 不能把Symbol类型转换为数字，否则会报错
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类型的）
从字符串最左边开始查找，把找到的有效数字字符转换为数字，一直遇到一个非有效数字字符为止，则结束查找
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。
引用数据类型之普通对象（object）
把多组键值对用大括号包起来 ,并且属性与属性之间用“逗号”进行分割
语法：
var obj={
属性名1：属性值，
属性名2：属性值
......
}
var obj={
"name":"lili",
"age":18
}
属性名和属性值
属性名：就是用来描述某种特征或者特点的名字，（又被称作键，key）
属性值：就是这个特征的具体值（又被称作值，value）
合称键值对
基本操作：增、删、改、查
1、获取属性值的获取
对象的属性名一般都是字符串格式(还可以是数字格式)，属性值可以是任意类型数据
对象.属性名;
对象['属性名'];
注意：如果对象里面没有这个属性名，得到的值就是“undefined”
var obj={
"name":"lili",
"age":18
}
console.log(obj.name);
console.log(obj["name"])
2、增、改
对象的属性名（键）是不允许重复的，之前没有这个属性则为新增，之前有这个属性，则是修改对应的属性值
如果原来的对象中没有那个属性名，就是新增，如果有就是修改
var obj={
"name":"lili",
"age":18
}
obj.name="dawei";====>修改
obj.sex="男"=====》 增加
console.log(obj)
3、删除
彻底删除 delete 对象["属性名"]
只是让对象中的属性值为空， obj["属性名"]=null；
var obj={
"name":"lili",
"age":18
}
delete obj["age"];
obj.name=null;
console.log(obj);
4、思考题：
var obj={
name:"lili",
age:18
}
var name="zhufengpeixun";
console.log(obj.name);
console.log(obj["name"]);
console.log(obj[name]);
5、属性名是数字格式
对象的属性名只能是数字或者字符串，如果是数字的话不能用obj.数字，会报错：
Uncaught SyntaxError: Unexpected number； //语法错误
6、注意：
对象的属性名不能是引用数据类型值
基于 对象[属性名] 的方式操作，需要保证属性名是一个值（字符串/数字/布尔等都可以），如果不是值而是一个变量，它会把变量存储的值作为对象的属性名进行操作
基于 对象.属性名 的方式操作，属性名就是点后面的
let n = {
x: 100
};
let m = [100, 200];
let obj = {};
obj[n] = "珠峰";
obj[m] = "培训";
console.log(obj);
引用数据类型之数组简单了解
用中括号（[]）包含以逗号分隔的元素列表
数组是特殊的对象:
1.它的属性名是数字，数字从零开始，逐级递增，每一个数字代表着当前项的位置 =>我们把这种数字属性名叫做“索引”
2.默认有一个length属性存储数组的长度
let arr = [10, 20, 30];
console.log(arr[0], arr[1], arr[2]);
console.log(arr.length);
console.log(arr['length']);
数据类型之间的转换
之前我们学的知识基本数据类型之间的转换
那如果带有引用数据类型呢？
Number()
+ 对象转换为数字：先把对象转换为字符串，再把字符串转为数字
* + 普通对象
* + 数组对象
1、普通对象转换为数字类型
/*
* 1.先把obj转化为字符串 "[object Object]"
* 2.把字符串转换为数字 Number("[object Object]")
*/
let obj={x:100};
console.log(Number(obj)); //=>NaN
2、数组转换为数字类型
/*
* 1.先把arr转换为字符串： "10"
* 2.在把"10"转换为数字：10
*/
let arr = ["10"];
console.log(Number(arr)); //=>10
/*
* 1.先把ARR转换为字符串： "10,20"
* 2.在把"10,20"转换为数字：NaN
*/
arr = ["10", "20"];
console.log(Number(arr)); //=>NaN
console.log(Number([])); //=> []->'' Number('')->0
console.log(Number(['AA'])); //=> ['AA']->'AA' Number('AA')->NaN
String()
1、普通对象转换为字符串
普通对象转换为字符串都是 "[object Object]"
2、数组转换为字符串
数组对象转换为字符串是 "第一项,第二项..."（逗号分隔数组中的每一项）
Boolean()
除了0 "" NaN undefined null 其他都是true
1、普通对象转换为布尔值
2、数组转换为布尔值
基础调试代码
var num=0;
// 1、打印
console.log(num);
function fun(){}
// 2、详细输出
// console.dir输出一个对象或者一个值的详细信息；
// console.log可以一次性输出多个值，但是dir不可以；
console.log(fun,10,100);
console.dir(fun);
// 3、弹框的时候，会把数据转为字符串(toString)
// alert是在浏览器窗口中弹出一个提示框，提示框中输出指定的信息
// 需要等到alert弹出框，点击确定关闭后，后面的代码才会继续执行
var obj={name:"lili"};
// alert(obj);
//4、提示框,如果点击是确定，返回值就是true,如果点击的是取消，返回值就是false
// confirm相对于alert来说，给用户提供了确定和取消两种选择
var res=confirm("你准备好了吗？");
console.log(res);
//5、带输入框的提示框： 返回值，如果点击的是确定，返回的就是你输入的内容，
// 如果点击是取消是null
var res2=prompt("你是男孩还是女孩？");
console.log(res2);
浅谈js运行机制
(堆栈内存和不同数据类型的操作方式）
堆（heap）栈（stack）内存
浏览器加载页面，运行代码的时候：
每打开一个页面，就会从计算机的内存条中分配出两块内存：堆内存（heap）和栈内存（stack）
堆内存（heap）：
主要存放引用数据类型的值
栈内存（stack）：
给代码提供可执行的环境
存贮基本数据类型的值
1、思考题：
var a=12;
var b=a;
console.log(b);
var obj1={"name":"lili","age":12};
var obj2=obj1;
obj2.age=18;
console.log(obj1.age);
1、浏览器打开页面的时候会划分两块内存，堆内存和栈内存：
栈内存的作用：
1、给js提供一个可运行的环境
2、存储基本数据类型的值
堆内存的作用：存放引用数据类型，对象的话存贮的就是键值对，如果是函数，把整个函数当成字符串进行存储
2、代码自上往下执行 （之前还有一个变量提升阶段，会在后面的课程中进行讲解）
====> 基本数据类型：存在栈内存中， 按值操作
====> 引用数据类型的值比较复杂，存在堆内存中，按引用地址的操作
3、赋值操作的三步曲：
+ 先创建值
+ 再创建变量
+ 最后把创建的变量和值关联在一起
练习题2.1
var a={
n:12
}
var b=a;
b={
n:13
}
console.log(a.n);
2.2
var obj={
n:10,
b:obj.n*10
}
console.log(obj.b);
在js中用来检测数据类型的四种方式
typeof
instanceof
constructor
Object.prototype.toString.call()
typeof 运算符 详解
typeof 首先返回的是一个字符串，它返回的类型.
'number'
'string'
'boolean'
'undefined'
'object'
'function'
特点：
typeof null 的结果是 "object"（这个是浏览器的BUG：所有的值在计算中都已二进制编码存储，浏览器中把前三位是000的当做对象，而null的二进制前三位就是000，所以被识别为对象。
typeof 普通对象/数组对象/正则对象... 结果都是"object"，这样就无法基于typeof区分是普通对象还是数组对象等了
typeof 12 ===> "number"
typeof "zhufeng" ====》 'string'
typeof false ===>'boolean'
typeof true ====> 'boolean'
typeof null ====> 'object'
typeof undefined ====>'undefined'
typeof [1,2] =====>"object"
typeof function(){} =>"function"
BAT面试题
1、
typeof []
typeof typeof []
typeof typeof typeof typeof typeof []
