最近和很多小伙伴一起学习React,不少是学生,只有c经验,但是没有学过JS。没关系嘛,语言都是相通的。接下来带大家快速入门一下JS,只要你有任何一门编程语言的基础,JS学起来很快的,毕竟JS最早被戏称为玩具语言,玩具谁还不会玩嘛。
JS与JavaScript与Java
JavaScript简称JS,编程老人们都听过一个笑话:JavaScript和Java的关系就像雷锋和雷峰塔的关系,对娱乐圈来说,就像林允和林允儿的关系。可是真的有人很认真地问我,JavaScript和Java差别大吗?额(⊙o⊙)…
我认真地回答下这个问题,JavaScript和Java都是编程语言,JavaScript刚出生的时候叫Mocha,后来改名叫LiveScript,再后来因为当时Java的名气很大,很红,红的发紫,于是它想蹭下热度,又改名叫JavaScript。
什么是JavaScript
JavaScript出生于1995年,是网景公司的一个名叫Brendan Eich的工程师写出来的,而且只用了两个月的时间。两个月发明一个编程语言,并且大红大紫了二十多年,作为程序员我并不觉得多厉害,他肯定是被产品经理逼的。
1995年的时候,Web正当红,但是当时客户端对服务端依赖严重,一个简单的表单校验都需要跟服务端交互,这方面用Java或者C#写过网页的人肯定深有体会。再加上那个年代网速贼拉慢,于是客户端脚本语言的出现就迫在眉睫了,于是英雄Brendan Eich就出来拯救苍生了,我觉得我们可以叫他“脚本侠”,毕竟他帮我们省掉了多少流量啊。
群众的眼睛是雪亮的,使用了JavaScript的Netscape Navagator2发布后很受欢迎,JavaScript也迅速跻身成为了当时的一线小花。哦对了,Netscape Navagator是个浏览器,2是它的版本。对比一下,Netscape Navagator就是当年的《宫锁心玉》,JavaScript是杨幂,结果当然就是都红了。
JavaScript与ECMAScript
眼看着Netscape Navagator抢占市场的领导者姿势,当时的另一个大鳄微软坐不住了,赶紧给自己的当家一姐IE投入更多资源,想要稳固自己的市场地位。于是IE3发布的时候,加入了JScript,而这个所谓的JScript就是JavaScript的实现。市场很残酷,毕竟胳膊拧不过大腿,微软财大气粗的,网景虽然是JavaScript的发明者,但是与微软比,家底还是弱了点。
虽然我刚刚说JScript就是JavaScript的实现,但毕竟亲生父母不同,她们俩还是有很多差异的。对于市场来说,两个版本的的JavaScript急需规范化。
于是1997年,JavaScript 1.1作为提案被提交给了欧洲计算机制造商协会,这个协会英文简称就是ECMA。接下来TC39技术骑士团承担了标准化JavaScript的重任,在一系列的圆桌会议之后,标准化的JavaScript出世了,还被赐了新名字,ECMA-262,俗称ECMAScript。JavaScript就是菩提的孙悟空,法力无边,但是太“野”了,而ECMAScript是被唐僧规范了之后的孙行者。
1998年,国际标准化组织ISO和国际电工委员会IEC也将ECMAScript采纳为标准。自此以后,各家浏览器均以ECMAScript作为自己实现JavaScript的依据,但是具体实现依然各有不同。所以刚入行的前端萌新们,如果你选择了前端这个行业,解决浏览器差异性问题将成为你的毕生事业~
JavaScript的实现
虽然JavaScript和ECMAScript基本上是同义词,但JavaScript远远不限于ECMA-262所定义的那样,完整的JavaScript实现包含以下几个部分:
- 核心:ECMAScript
- 文档对象模型:DOM
- 浏览器对象模型:BOM
ECMAScript
ECMAScript,即ECMA-262定义的语言。它也是有版本的,现在最近的版本是第11版,发布于2021年6月。当然最出名的还是第6版,就是我们常说的ES6,也叫ES2015或者ES Harmony,于2015年6月发布。
ES6正式支持了类、模块、迭代器、生成器、箭头函数、期约(promise)、反射(reflect)、代理(proxy)和众多的新的数据类型。如果你觉得你平常工作中用不到很多ES6新特性,那一定是你的认知有问题,加油吧,少年~
另外,ECMAScript并不局限于Web浏览器,Web浏览器只是它的一个宿主环境,其他像是服务器端JavaScript平台Node.js和即将被淘汰的Adode Flash等,也是它的宿主环境。
DOM
文档对象模型(DOM,Document Object Model),用于在HTML中使用扩展的XML。DOM将整个页面抽象为一组分层节点。
DOM通过创建表示文档的树,让开发者可以随心所欲地控制网页的内容和结构。使用DOM API,可以轻松增删改查节点。
BOM
浏览器对象模型(BOM,Browser Object Model),IE3和NetScape Navigator3提供了关于BOM API,用于支持访问和操作浏览器的窗口。
但是因为在很长的时间内都没有标准,所以每个浏览器实现的都是自己的BOM。尽管HTML5的出现一定程度上改变了这个局面,H5以正式规范涵盖了尽可能多的BOM特性。由于H5的出现,之前很多与BOM有关的问题都迎刃而解了。但是浏览器差异性依然不少,因此解决浏览器差异性问题是前端的毕生事业,除非哪天天下浏览器大同了~
说到这里,给前端萌新们提醒下,你的页面上线前一定要多测试,比如谷歌、火狐、IE、Safari、360、QQ浏览器等,Windows和Mac,安卓与苹果,差异性不可忽视~
不过也不是所有差异性都需要前端解决,比如我之前做的很多项目是ToB的,因此我们只兼容谷歌和火狐,后来火狐也放弃了,只兼容谷歌,什么IE、QQ,全都不管~
也许会有前端萌新说,产品经理要求全部兼容,那就和他讲道理,多兼容的话工期多一倍,并且用户用不到那么多莫名其妙的浏览器,干嘛不把精力放到核心浏览器上。你见过玛莎拉蒂的销售天天给你打电话问你买不买吗?Target Marketing!
如果你的产品经理依然不听话,那就换了他,当然被换的也有可能是你自己~
总结
好了,相信大家都已经对JavaScript有了清晰的认识,作为JavaScript的新手或者老手,建议人手一本红宝书,即《JavaScript高级程序设计》第4版。我接下来也会继续更新JavaScript读书笔记,这是我30天咸鱼计划的一部分,如果你也感兴趣,可以关注公众号"bubucuo",和我一起进阶~