One
一:主流浏览器 内核 引擎
| 浏览器 | 内核 | JavaScript引擎 |
|---|---|---|
| IE(已停用) | Trident | Trident |
| Edge | Chromium | V8 |
| Chrome | Chromium | V8 |
| Safari | Webkit | JavaScriptCore |
| Firefox | Gecko | SpiderMonkey |
| Opera | Presto | V8 |
二:浏览器历史和JS诞生
1、1990 蒂姆·伯纳斯·李(Tim Berners-Lee) ,在欧洲核子研究中心(CERN)研究超文本分享资讯,并提出了万维网概念。 1990年在CERN创建了世界上第一个网站和第一个网页浏览器。第一个网站是关于万维网的介绍,而第一个网页浏览器是WorldWideWeb。 world wide web 移植到C Libwww/nexus。 允许任何人浏览他人编写的网站。
2、1993 美国伊利诺大学NCSA组织(核心人员之一马克·安德森 Marc Andreessen) 开发---MOSIAC浏览器 显示图片 图形化浏览器
3、1994 马克·安德森和吉姆·克拉克(Jim Clark) 成立 MOSIAC communication corporation 插曲--->因为商标权的关系,公司被迫改名--->Netscape communication corporation MOSIAC 商标权隶属于 伊利诺大学,伊利诺大学又把MOSIAC转让给 SPY GLASS公司 Netscape communication corporation --->网景公司--->Netscape Navigator
4、1996 微软收购SPY GLASS--->在MOSIAC内核基础上--->开发IE Internet Exploror 1.0--->IE3.0 JScript 网景公司---Bredan eich 在Netscape Navigator开发出---livescript 网景公司与 SUN 公司合作,因市场宣传需要,为了蹭 Java 的热度,改名为 JavaScript
5、2001 微软 IE6 XP诞生 JS引擎
6、2003 mozilla公司 firefox--->netscape navigator基础上开发出来
7、2008 google 基于 WEBKIT BLINK GEARS开发 Chrome浏览器 Chrome--->V8引擎(JS引擎) 1、直接翻译机器码 2、独立于浏览器运行
8、2009 甲骨文Oracle 收购SUN公司 JS的所有权归属到甲骨文
三: ECMA
European Computer Manufactures Association 欧洲计算机制造联合会---总部地址为日内瓦---瑞士中立国 评估、开发、认可电信、计算机标准 ECMA - 262 脚本语言的规范,名称为ECMAScript ES5 ES6 --- 规范化脚本语言
四:编程语言
编译型 源码---> 编译器--->机器语言--->可执行文件 特性:需要跨平台开销成本,执行效率高。
解释型 源码---解释器---解释一行就执行一行 特性:无需跨平台开销成本,执行效率相对较慢。
脚本语言 ---> 脚本引擎 ---> 解释器 ---> 解释一行就执行一行
脚本语言,分为客户端 / 服务端两类脚本语言。 JavaScript为客户端 PHP 为服务端
五:JavaScript学习三大块
ECMAScript 语法、变量、关键字、保留字、值、原始类型、引用类型、运算、对象、继承、函数 DOM document object model 文档对象模型 ,有统一规范,执行W3C标准 BOM browser object model 浏览器对象模型,没有统一规范,但可以写兼容性
六:JS引擎为单线程,但可以通过"轮转时间片"模拟多线程。
单线程是指在同一时间内,程序只能执行一条指令。
多线程是指在同一时间内,程序可以同时执行多个指令。
轮转时间片---短时间内轮流执行多个任务的片段。 执行流程: 1、任务1、任务2 2、分别将任务1和任务2切分成多个片段 3、随机排列这些任务片段,并组成队列 4、按照组成队列顺序将任务片段送进JS进程 5、JS线程执行一个又一个的任务片段 由于JS进程执行的很快,我们感受不到,所以感觉是多线程的。
七、JS代码书写位置
1、行内式:写入标签内部。 2、内嵌式:写入 script 双标签内 3、外链式:引入外部JS文件
行内式
<input type="button" value="左键单击" onclick="alert('行内式')" />
内嵌式
<script type="text/javascript">
alert('内嵌式');
</script>
内嵌式(另一种用法,常见于企业级开发中的模板替换)
<script type="text/tpl" id="model">
//js代码
</script>
外链式
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
</head>
<body>
<script src="index.js"></script>
</body>
</html>
八:变量
前期的变量知识太简单,不想写,后面复杂的在继续写
九:JS的值
原始值--->基本数据类型 Number--->数值 String--->字符串 Boolean--->布尔值 Undefined--->未定义 null--->空值
引用值--->就是对象(万物即对象) Object--->对象 Array--->数组 Function--->函数 Date--->日期 Regexp--->正则
十:堆栈内存的初步理解
- 栈内存,先进后出原则,原始值存储在栈内存中,原始值不可改变,但可以覆盖,可以理解覆盖即删除的意思。
- 堆内存,引用值存储在堆内存中,栈内存中存储了引用值得地址(指针)。
原始值---栈内存关系,代码演示:
var a = 10; //声明一个变量a,并将数值10赋值给a这个变量;
var b = a; //在声明一个变量b,并将变量a赋值给b,也就是变量a得值赋值给了b;
a = 1; //变量a又重新赋值1;
console.log(b,a); //控制台打印变量a得值;
//打印结果:10 1
图解:
引用值---栈与堆内存关系,代码演示:
var arr1 = [1,2,3,4]; //声明一个数组变量arr1,并赋值1,2,3,4给变量arr1
var arr2 = arr1; //声明一个变量arr2,并将数组变量arr1的值赋值给arr2
console.log(arr1 + '|' + arr2); //打印arr1与arr2
//打印结果:1,2,3,4 | 1,2,3,4
console.log('---分隔符---');
arr1.push(5); //arr1数组下标4中插入一个数值5
console.log(arr1 + '|' + arr2); //打印arr1与arr2
//打印结果:1,2,3,4,5 | 1,2,3,4,5
console.log('---分隔符---');
arr1 = [1,2] //变量数组arr1重新赋值 1,2
console.log(arr1 + '|' + arr2); //打印arr1与arr2
//打印结果:1,2 | 1,2,3,4,5
图解: