快速入门JavaScript基础

JavaScript认知

序言

JavaScript发展历史(JS)

简称JS

1.Netscape(网景) 公司的这种浏览器脚本语言，最初名字叫做 Mocha

2.1995年9月改为 LiveScript

3.1995年12月，Netscape 公司与 Sun 公司（Java 语言的发明者和所有者）达成协议，后者允许将这种语言叫做 JavaScript

4.JavaScript 是解释性语言，运行时由解释器直接执行，专门用来操作网页。

5.  (1)借鉴C语言的基本语法; (2)借鉴Java语言的数据类型和内存管理; (3)借鉴Scheme语言，将函数提升到"第一等公民"
(first class)的地位; (4)借鉴Self语言，使用基于原型(prototype)的继承机制。
6.1996年3月，Navigator 2.0 浏览器正式内置了 JavaScript 脚本语言。

JavaScript 版本

1. 1997年7月，ECMAScript 1.0发布
2. 1998年6月，ECMAScript 2.0版发布
3. 1999年12月，ECMAScript 3.0版发布，成为 JavaScript 的通行标准，得到了广泛支持。
4. 2007年10月，ECMAScript 4.0版草案发布（废除）
5. 2009年12月，ECMAScript 5.0版 正式发布
6. 2013年3月，ECMAScript 6 草案
7. 2015年6月，ECMAScript 6 正式发布

JavaScript 是什么

JavaScript： 基于对象和事件驱动，运行在浏览器客户端的脚本语言。
javaScript： 基于浏览器的脚本语言

 ✔ js的运行环境： 运行在浏览器端的一种脚本语言

JavaScript 能干什么

☞ PC端网站开发(https://www.taobao.com/)
☞ 移动端WebApp开发(https://main.m.taobao.com/?sprefer=sypc00)
☞ 地理定位等功能【http://lbsyun.baidu.com/jsdemo.htm#i4_5】
☞ 配合H5实现游戏【水果忍者： http://www.jq22.com/demo/html5-fruit-ninja/】
☞ 配合electron.js跨平台桌面开发(vscode)
☞ js可以实现人工智能  【面部识别】

JavaScript 组成

☞  ECMAScript 是JavaScript的语法规范，JavaScript是ECMAScript的实现
☞  BOM (Browser Object Model） 
      1.浏览器对象模型
        	通过BOM可以操作浏览器窗口，比如：弹出框、控制浏览器跳转、获取分辨率等
      2.是浏览器针对javascript的扩展
         	这些扩展在非浏览器环境中是不能使用的，比如node.js中就不能使用bom。
☞  DOM (Document Object Model) 文档对象模型
		1.是一个w3c的标准，这个标准定义了如何操作html,提供一套操作页面元素的API(函数方法)
		2.DOM可以把HTML看做是文档树，DOM提供的API可以对树上的节点进行操作 

总结：  JavaScript[JS]组成:ECMAscript，DOM，BOM

课堂测试

JavaScript 的组成，说法错误的是 （ ）
A: JavaScript 由 ECMAScript + BOM + DOM 组成
B:  BOM是浏览器对象模型，DOM是文档对象模型BOM 包含 DOM
C: BOM是浏览器对象模型，DOM是文档对象模型，BOM 和 DOM 无关
D:  JavaScript 中，ECMAScript 指的是js的语法规范

JavaScript 书写位置

外联式写法[推荐写法]

 ☞  在外部定义js文件，当前html文件里面引入
 	1. 新建js文件
    2. 通过script标签引用到当前页面中
    <script type="text/javascript" src="test.js"></script>

注意：
	1. 不能将代码写到外联式标签中。
    2. 一个网页中可以同时调用多个外部js文件
     <script type="text/javascript" src="test.js"></script>
	<script type="text/javascript" src="test.js"></script>
	<script type="text/javascript" src="test.js"></script>
	<script type="text/javascript" src="test.js"></script>

内嵌式写法(不推荐)

 ☞  在html页面内部设置
    <script type="text/javascript">
		 JavaScript[js] 代码
	</script>

  注意：
  	  该标签可以放到head标签中或者body标签中

行内式写法（不推荐）

☞  将js代码写到标签内部
<div onclick="js代码"></div>

注意：
	 onclick 是一个点击事件： 当点击div的时候，会触发该事件，执行该事件中的代码

JavaScript 中输入消息方式

 ☞ 弹框 alert('弹框内容')  
 ☞ 确认框 confirm('确定不听课吗?') 
 ☞ 输入框 prompt('请输入您的姓名')
 ☞ 网页写入 document.write('
这是一个大大的标题
');
 ☞ 控制台输出 console.log('这是控制台中输出的内容');

总结：
	 1. 在js中如果希望输出一个具体的文本信息，必须带引号
     2. 在使用document.write();的时候，可以在方法内输出html标签，加引号。

思考? 如果我们使用prompt()方法让用户输入了数据，我们又想要把用户输入的数据保存起来，怎么办呢？
在JavaScript中有一种专门用于保存数据的语法:变量

JavaScript 变量（重点）

 ☞ 变量概念: 是计算机内存中存储数据的标识符，根据变量名称可以获取到内存中存储的数据
 ☞ 变量作用：变量指的是在程序中保存数据的一个容器  
 ☞ 语法： var 变量名 = 数据;