龙空技术网

JS从0开始:浏览器发展史、编程语言、JS变量、栈和堆

前端攻略 116

前言:

现时小伙伴们对“livejs”大致比较关心,朋友们都想要分析一些“livejs”的相关内容。那么小编也在网摘上汇集了一些有关“livejs””的相关内容,希望各位老铁们能喜欢,大家一起来了解一下吧!

重点 一、三、四、五、六、七,难点:七

本人JS代码注释只有一个 / 时,即为重要的知识点

一.五大主流浏览器 内核二. 浏览器的历史和JS的诞生

1.1990年 蒂姆·伯纳斯·李(是个喜欢用超文本分享资讯的人)开发了一个world wide web 移植到C 改名为libwww(后改名为nexus) 意义:允许别人浏览他人编写的网站

2.1993年 美国伊利诺大学NCSA组织(核心成员马克-安德森)开发了一个MOSIAC的浏览器 意义:可以显示图片,图形化的浏览器

3.1994年 马克安德森 和 吉姆克拉克(硅谷公司SGI员工)成立了MOSIAC communication corporation 公司 因为图标侵权 (之前蒂姆·伯纳斯·李转让给spy)

后改名为网景公司Netscape communication corporation, 建立了Netscape navigator浏览器 一直流行到2003年左右

4.1996年 微软公司收购spy glass,诞生了 IE Internet explore 1.0 (内核trident是仿照MOSICA内核进行开发的)

同时1996年网景公司工程师Brendan eich在自家浏览器Netscape navigator上开发出了livescript(JS前身), 1996年JAVA火起来,而网景的livescript不温不火,所以网景公司与Sun公司商量共同推广产品:livescript更名为javascript

5.2001年,IE6 XP诞生了,由于js的兴起,js的引擎也被剥离出来,形成独立的js引擎

6.2003年,mozilla 公司开发出firefox ,其内核是基于Netscape navigator(1998年11月,网景被美国在线(AOL)收购。网景公司为了恶心微软开放了自家内核源码,吐槽一句:微软仿照了网景公司MOSIAC浏览器内核创立的IE浏览器,并最终竞争过了网景,微软属实坏蛋,不过适者生存,感谢网景公司开放源码)

7.2008年,goole开发出Chrome浏览器以及JavaScript引擎V8(JS引擎,直接翻译机器码,独立于浏览器运行)

8.2009年,甲骨文oracle收购了sun公司,Js所有权转移给甲骨文

三.编程语言

编程语言分为两大类:编译型和解释型

1.编译型:写的源码 --> 要通过一个编译器的东西 --> 机器语言 --> 可执行的文件

优点:运行速度快,经过编译以后的可以直接执行不需要再编译,而解释型语言每一次运行源码时都需要去翻译

缺点:编译型有跨平台不兼容的问题,跨平台需要重新编译,跨平台移植不是很好。

2.解释型语言:源码 --> 通过解释器 --> 解释一行执行一行

优点: 不需要根据不同的系统平台进行移植曲(各平台有相应的解释器)

缺点:运行比较慢

四.脚本语言

脚本语言(如php、js等) --> 通过脚本引擎的解释器来解释以后才能正常运行

脚本语言前后端都有如后端的是php:

Js客户端脚本:JS解释器在浏览器上

Php:服务端脚本, php解释器在服务器上

后端脚本语言和前端脚本语言的区别:前端脚本可以在浏览器检查元素中看到,后端不能

五. ECMAScript

ECMAScript是一种由Ecma国际(前身为欧洲计算机制造商协会,European Computer Manufacturers Association) 通过ECMA-262标准化的脚本程序设计语言。这种语言在万维网上应用广泛,它往往被称为JavaScript或JScript,所以它可以理解为是JavaScript的一个标准,但实际上后两者(JavaScript、JScript)是ECMA-262标准的实现和扩展。

六. ECMAScript 语法(1)单线程与多线程

单线程:只能做一件事情

多线程:同时能做多件事情

JS引擎是单线程(因为js引擎是单线程的,所以js是单线程的语言)

JS引擎是单线程但是能同时执行多个操作,如:

原因是Js引擎单线程-->模拟多线程

我们这里要介绍一个概念:轮转时间片:它能短时间之内轮流执行多个任务的片段

步骤:(1)存在任务1、任务2

(2)切分任务1和任务2(将它们切成很多个小任务)

(3)随机排列这些任务片段,组成队列

(4)按照这个队列顺序将这个任务片段送进JS进程

(5)Js线程执行一个又一个的任务片段

(这个就相当于有两个任务时,任务一跑一毫秒,任务二跑一毫秒,就这样切换跑完)

(2)JS的引用

引用有两种方法

·····外部引用:

 <script type="text/javascript" src="js/index.js">  </script> 

·····内部引用:

 <script type="text/javascript">    console.log("a");    </script> 

那当他们同时存在时会引用谁呢?

如这个下图中,大家认为会执行哪个中的代码呢?

答案是"js/index.js"这个文件中的代码,甚至这个文件不存在时还会直接报错

原因:因为JS是一门解释型语言(一行一行编译),上面先引用后下面代码就不管了

(3)变量

①定义:变量是存储数据的一个容器

②变量声明的过程:由变量声明( var(variable))、变量赋值这两个部分组成

var a;//声明变量a=3;//变量赋值

单一声明方式:一个var声明多个变量,如:

  var  a,b;

③变量命名规范

不能以数字开头能以字母、下划线、$ 开头可以包含数字、字母、下划线、$不可以使用关键字和保留字命名(保留字留着以后作为关键字)命名语义化(要有意义,让别人看的懂)、结构化(如Js_header、J-header专门给JS用的)变量名用小驼峰命名法:首字母小写,后面每个单词第一个字母大写七. JavaScript的值1.弱类型语言

动态语言->基本上都是脚本语言->解释型语言->一定是 弱类型语言

静态语言->编译型语言->强类型语言

强类型语言:强调/强制数据类型

JS是弱类型语言:弱化数据类型,自动化的去识别数据类型(如整型和浮点型)

2.原始值

Number:包含整形和浮点型BooleanStringundefined:声明了变量但没有赋值,即未被定义的变量null:空值3.引用值object:对象array:数组function:函数date:日期RegExp:正则4. 原始值和引用值的区别

原始值:存储在栈(stack)中 的简单数据,也就是说它们的值直接存储在变量访问的位置

引用值:地址存储在栈内存而值存储在堆(heap)中 的对象,如:

(1)原始值

存储a,b并赋值:

var a=3;/声明一个a空间,在a中存储3var a=b;/声明一个b空间,将a中取到的值,复制一份到b中a=1;/重新开辟一个新空间a(覆盖1006) 在新空间a中存储1console.log(b);

b输出的值为3,与a的值不同。 因为给原始值赋值时,会在栈内存中开辟一个新的内存空间,如果想更改一个原始值的值时,会重新开辟一个内存空间进行赋值,原有的内存空间还存在于栈内存中(所以说手机数据不会完全删除)

(2)引用值:地址存在栈内存,值存在堆内存

var arr1=[1,2,3];/在栈内存中声明一个空间arr1,在堆内存中存储值,栈内存的空间中存储的是堆内存中的地址var arr2=arr1;/在栈内存中声明一个新空间arr2,将存储的arr1堆内存地址复制给arr2arr1.push(5);/arr1,arr2共同指向的值改变console.log(arr2);//输出1,2,3,4,5 

arr2输出的值与arr1相同

但当我们重新给arr1赋值时,arr2的值与arr1的值不同

var arr1=[1,2,3];/在栈内存中声明一个空间arr1,在堆内存中存储值,栈内存的空间中存储的是堆内存中的地址var arr2=arr1;/在栈内存中声明一个新空间arr2,将存储的arr1堆内存地址复制给arr2arr=[1,2];/在栈内存中声明一个新空间arr1,并且值存在于堆内存中,在新的arr1的空间中存储新的地址,这时候调用arr1和arr2分别指向不同的地址 所以值也不同console.log(arr2);

小编是一个有着7年工作经验的前端工程师,关于web前端,自己有做材料的整合,一个完整学习web前端的学习路线,学习材料和工具。需要的伙伴可以私信我,发送“前端”等3秒后就可以获取领取地址,免费送给大家

结论:往里面增加值、修改值时影响,重新赋值不影响

标签: #livejs