笔记来源:拉勾教育 - 大前端就业集训营
文章内容:学习过程中的笔记、感悟、和经验
Javascript语法
Javascript(JS)简介
网页、网站、应用程序
- 网页:单独的一个页面
- 网站:一系列相关的网页页面组合在一起
- 应用程序:可以和用户产生交互,并可以实现某些功能
前端三层
HTML:结构层,从语言角度描述页面结构组成
CSS:样式层,从美观角度描述页面结构样式
Javascript:行为层,从交互角度描述页面行为
JS应用场景
- 网页特效
- 服务端开发(Node.js)
- 命令行工具(Node.js)
- 桌面程序(Electorn)
- App(Cordova)
- 硬件控制-物联网(Ruff)
- 游戏开发(cocos2d-js)
JS是什么
javascript是一种运行在客户端上的脚本语言,最早在HTML网页上使用,用来给HTML网页增加动态功能
浏览器是一种运行js脚本语言的客户端,js解释器被称为js引擎,是浏览器的一部分
JS简史
在WEB日益发展的同时,网页的大小和复杂性不断增加,受制于网速的限制,为完成简单的表单验证而频繁地与服务器交换数据只会加重用户的负担,当时走在技术革新最前沿Netscape(网景)公司,决定着手开发一种客户端语言,用来处理这种简单的验证。
1995年,就职于 Netscape公司的 Brendan Eich,开始着手为即将于1996年2月发布Netscape, Navigator2浏览器开发一种名为 LiveScrip的脚本语言。为了尽快完成 LiveScript的开发,Netscape与sun公司建立了一个开发联盟。在 Netscape Navigator2正式发布前夕,Netscape为了搭上媒体热炒Java的顺风车,临时把LiveScript改名为 JavaScript。
由于 JavaScript1.0获得的关注度越来越高,1996年,微软就在其 Internet Explorer3中加入了名为 JScript的 JavaScript实现,这意味着有了两个不同 I JavaScript版本,导致 JavaScript i没有一个标准化的语法和特性
1997年,以 JavaScript11为蓝本的建议被交给了欧洲计算机制造商协会(EM, European ComputerManufacturers Association)。该协会指定39号技术委员会(Tc39, Technical Committee#39)负责“标准化一种通用、跨平台、供应商中立的脚本语言的语法和语义。TC39由来自 Netscape、sun、微软、 Borland及其他关注脚本语言发展的公司的程序员组成,他们经过数月的努力完成了ECMA-262标准,定义一种名为 ECMAScript的新脚本语言。
| 版本 | 时间 | 说明 |
|---|---|---|
| ECMAScript1 | 1997.06 | |
| ECMAScript2 | 1998.06 | |
| ECMAScript3 | 1999.12 | 成为JavaScript的通行标准,得到了广泛支持。 |
| ECMAScript4 | 2007.10 | ECMAScript4.0版草案发布,对3.0版做了大幅升级。草案发布后,由于4.0版的目标过于激进,各方对 于是否通过这个标准,发生了严重分歧。以Yahoo、Microsoft、Google为首的大公司,反JavaScript 的大幅升级,主张小幅改动以JavaScript创造者BrendanEich为首的Mozilla公司,则坚持当前的草 案。 |
| 2008.07 | 由于各方分歧太大,争论过于激进,ECMA开会决定,中止ECMAScript4.0的开发,将其中涉及现有功能 改善的一小部分,发布为ECMAScript3.1,而将其他激进的设想扩大范围,放入以后的版本,由于会议的气 氛,该版本的项目代号起名为Harmony(和谐)。会后不久,ECMAScript3.1就改名为ECMAScript5. | |
| ECMAScriptS | 2009.12 | ECMAScript5.0版正式发布。Harmony项目则一分为二,一些较为可行的设想定名为JavaScript.next 继续开发,后来演变成ECMAScript6;一些不是很成熟的设想,则被视为JavaScript.next.next,在更远 的将来再考虑推出。 |
| ECMAScript5.1 | 2011.06 | 成为ISO国际标准(ISO/IEC16262:2011) |
| ECMAScript 6/ECMAScript2015 | 2015.06.17 | ECMAScript6发布正式版本,并且更名为"ECMAScript2015"。 |
js组成
Javascript、Jscript、Actionscript等脚本语言都是基于ECMAScript标准的
Javascript、Jscript、Actionscript中声明变量、操作数组等方法相同,但是在操作浏览器对象方面又有各自不同的方法
JS组成
- ECMAScript
- DOM:文档对象模型 - DOM树
- BOM:浏览器对象模型
计算机组成
软件:
- 应用软件:浏览器、QQ、word等
- 系统软件:windows、MacOS等
硬件:
- (主板)三大件:CPU、内存、硬盘
- 输入设备:鼠标、键盘、手写板、摄像头等等
- 输出设备:显示器、打印几、投影仪等
JS基本语法
书写位置
写在行内
<!-- 写在元素HTML结构内部 -->
<div onclick="alert('hell0 world')">我是内容</div>
写在<script>标签内部
<script>
alert('我写在script标签内部')
</script>
引入外部js文件
//新建index.js文件书写
alert('我写在外部js文件中')
<!-- 使用script标签引入 -->
<script src="./index.js"></script>
注意:
- 引用外部文件的script标签内部不可以再书写js代码
- 标签可以放在head中或者body中,习惯写在head中
js注释
js注释分为两种,块级注释和单行注释
书写方法:
- 块级注释:
/* 注释内容 */ - 单行注释:
// 注释内容
//单行注释,不可以换行
/*
我是块级注释
内部可以写多行内容
*/
alert语句
警告、警示的意思,在浏览器中弹出警示框,警示框的内容需要人为定义
时js内置好的功能(函数、方法),想要实现功能必须在alert关键字后面加小括号执行,提醒的内容写在校括号内部
书写方法:alert('警示内容')
//使用方法
alert('你好');
alert(99);
语法:
- 必须要alert后面添加小括号
- 小括号内不可以传递参数,根据类型的不同,有不同的语法要求(比如字符串可以直接写在引号内)
- 引号必须成对出现,不可以使用一个单引号一个双引号(" 这是错误的')
- 所有有特殊功能的符号不可以使用中文符号,必须使用英文状态下的符号
- 在语句结尾需要添加一个
;进行结尾(允许不写,但是可能会出现一些问题) - js对换行、空格、缩进不敏感
- 代码执行是按照顺序加载的(默认从上到下、从左往右)
prompt语句
弹出一个对话框,内部有一个提示语句和一个输入框,可以在输入框根据提示填写内容
是js内置的功能,后面必须添加小括号,内部传递两个参数,每个参数一般都是字符串类型(加引号),参数之间用逗号隔开
书写方法:promot('提示信息','文本框默认内容')
// 使用方法 第一个参数代表提示信息,第二个表示默认填写内容,可以为空
prompt('请输入你的年龄','25');
console控制台
控制台存在于大部分浏览器,内部可以查看html、css、js信息,浏览器右键审查元素可以打开
控制台里面有一个console(控制台)面板,对js有非常重要的作用
作用:
- 调试bug、提示错误个数、位置、类型等信息
- 直接在内部书写语句、进行执行
- js内部内置了console对象,内部封装了多个方法,可以可以调用console对象方法执行对应方法,比如console有一个log方法,可以自定义内容输出在控制台内部
console.log()
// 在控制台输出(打印)内容
console.log('我在控制台输出')