您的位置 首页 php

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

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

本人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-26 2标准化的脚本程序设计语言。这种语言在万维网上应用广泛,它往往被称为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:包含整形和浮点型
  • Boolean
  • String
  • undefined: 声明了变量但没有赋值,即未被定义的变量
  • null:空值

3.引用值

  • object: 对象
  • array:数组
  • function:函数
  • date: 日期
  • RegExp:正则

4. 原始值和引用值的区别

原始值: 存储在栈(stack)中 的简单数据,也就是说它们的值直接存储在变量访问的位置
引用值: 地址存储在栈内存而值存储在堆(heap)中 的对象,如:

(1)原始值

存储a,b并赋值:

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

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

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

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

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

文章来源:智云一二三科技

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

文章地址:https://www.zhihuclub.com/153624.shtml

关于作者: 智云科技

热门文章

网站地图