JS认识

js发展史

为什么要有js?

因为我们做前端的不止是要有页面，而且要做到人机交互，很显然，HTML和css都是静态页面我们生活中都是需要动态的页面，js也是需要逻辑上的处理，和其他两个相比也就要需要编程思想了。

js的行为：

html：结构
css：样式
js：行为
HTML负责呈现的内容
css负责呈现在网页中显示的样式
而js就是负责一些动态效果，完成人机交互。

JavaScript的来历

“1994年，网景公司（Netscape）发布了Navigator浏览器0.9版。这是历史上第一个比较成熟的网络浏览器，轰动一时。但是，这个版本的浏览器只能用来浏览，不具备与访问者互动的能力。比如，如果网页上有一栏"用户名"要求填写，浏览器就无法判断访问者是否真的填写了，只有让服务器端判断。如果没有填写，服务器端就返回错误，要求用户重新填写，这太浪费时间和服务器资源了。网景公司急需一种网页脚本语言，使得浏览器可以与网页互动。”

网页脚本语言到底是什么语言？

网景公司当时有两个选择：一个是采用现有的语言，比如Python、Scheme[skiːm]、Tcl等等，允许它们直接嵌入网页；另一个是发明一种全新的语言。这两个选择各有利弊。第一个选择，有利于充分利用现有代码和程序员资源，推广起来比较容易；第二个选择，有利于开发出完全适用的语言，实现起来比较容易。到底采用哪一个选择，网景公司内部争执不下，管理层一时难以下定决心，就在这时，发生了另外一件大事：1995年Sun公司将Oak语言改名为Java，正式向市场推出。Sun公司大肆宣传，许诺这种语言可以"一次编写，到处运行"，它看上去很可能成为未来的主宰。

网景公司动了心，决定与Sun公司结成联盟。总之，当时的形势是， 网景公司的整个管理层，都是Java语言的信徒，Sun公司完全介入网页脚本语言的决策。因此，Javascript后来就是网景和Sun两家公司一起携手推向市场的，这种语言被命名为"Java+script"并不是偶然的。此时，34岁的系统程序员（布兰登·艾奇）登场了。他主要方向和兴趣是函数式编程，网景公司招聘他的目的，是研究将Scheme语言作为网页脚本语言的可能性。他本人也是这样想的，以为进入新公司后，会主要与Scheme语言打交道。

仅仅一个月之后，1995年5月，网景公司做出决策，未来的网页脚本语言必须"看上去与Java足够相似"，但是比Java简单，使得非专业的网页作者也能很快上手。这个决策实际上就将很多非面向对象编程的语言都排除在外了。同时布兰登·艾奇被指定为这种"简化版Java语言"的设计师。但是，他对Java一点兴趣也没有。为了应付公司安排的任务，他只用10天时间就把Javascript设计出来了。但是由于设计时间太短，语言的一些细节考虑得不够严谨，导致后来很长一段时间，Javascript写出来的程序混乱不堪。

js的设计思路

（1）借鉴C语言的基本语法； 　
（2）借鉴Java语言的数据类型和内存管理；
（3）借鉴Scheme[skiːm] 语言，将函数提升到"第一等公民"（first class）的地位；
（4）借鉴Self[self] 语言，使用基于原型（prototype[ˈproʊtətaɪp]）的继承机制。
所以，Javascript语言实际上是两种语言风格的混合产物，（简化的）函数式编程+（简化的）面向对象编程。这是由Brendan Eich（函数式编程）与网景公司（面向对象编程）共同决定的。

什么是 JavaScript ？

JavaScript的简称“js” “是一种具有函数优先的轻量级框架”，js是一种"解释型"和"即时编译型"的"高级编程语言"。 虽然它是作为开发前端页面的脚本语言而出名的，但是它也被用到了很多非浏览器环境中。 “JavaScript基于原型编程”、并且支持"面向对象"、"命令式"以及"声明式"的风格来进行编译。
同时：
JavaScript，也称ECMAScript，“是一种基于对象和事件驱动并具有相对安全性并广泛用于客户端网页开发的脚本语言。”

js的组成

1.ECMAScript
2.DOM（document object model）
3.BOM（browser object model ）
（1）ECMA是（欧洲计算机制造商协会）它规定了js的语法标准。
（2）DOM是文档对象模型，规定了文档的显示结构，可以轻松地删除、添加和替换节点 。
（3）BOM是浏览器对象模型，就是浏览器自带的一些功能样式，如搜索框，设置，等学习 浏览器窗口交互的对象。

js中的历史：

JavaScript特点

1.是一种"解释性脚本语言"（代码不进行预编译）。
2.主要用来向HTML（标准通用标记语言下的一个应用）页面添加交互行为。
3.js可以"直接嵌入HTML页面"，但写成"单独的js文件"有利于结构和行为的分离。
4.跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行（如Windows、Linux、Mac、Android、iOS等）
5.js它是"单线程编程语言"。

「为什么JavaScript是单线程？」

1.JavaScript语言的一大特点就是单线程，也就是说，同一个时间只能做一件事。那么，为什么JavaScript不能有多个线程呢？这样能提高效率啊。
2.JavaScript的单线程，与它的用途有关。作为浏览器脚本语言，JavaScript的主要用途是与用户互动，以及操作DOM。这决定了它只能是单线程，否则会带来很复杂的同步问题。比如，假定JavaScript同时有两个线程，一个线程在某个DOM节点上添加内容，另一个线程删除了这个节点，这时浏览器应该以哪个线程为准？
3.所以，为了避免复杂性，从一诞生，JavaScript就是单线程，这已经成了这门语言的核心特征，将来也不会改变。为了利用多核CPU的计算能力，HTML5提出Web Worker标准，允许JavaScript脚本创建多个线程，但是子线程完全受主线程控制，且不得操作DOM。所以，这个新标准并没有改变JavaScript单线程的本质。

js的规范

1、区分大小写：ECMAScript中的一切(变量、函数名和操作符)都严格区分大小写。
2、标识符：指变量、函数、属性的名字，或者函数的参数。 标识符命名规则：
1)第一个字符必须是一个字母、下划线(_)或一个美元符号($);
2)其他的字符可以是字母、下划线、美元符号或数字; ECMAScript标识符一般采用、驼峰大小写命名格式。不能把关键字、保留字、true、false和null用作标识符。
3、注释：ECMAScript有单行注释和多行注释(块级)两种。
//单行注释
/*多行注释 (代码块) */
JavaScript注释可用于提高代码的可读性，阻止代码的执行。
4、可选的分号：ECMAScript中的语句以一个分号结尾；如果省略分号，则由解释器确定语句的结尾。这是非严谨语言的特点。(不推荐省略分号)
5、变量：ECMAScript的变量是松散类型的，所谓松散类型就是可以保存任何类型的数据。

JS中的关键字和保留字

关键字:

Break	Case	Catch	Continue	Default
delete	do	else	finally	for
function	if	in	instanceof	new
return	switch	this	throw	try
typeof	var	void	while	with

保留字:

adstract	boolean	byte	char	class
const	debugger	doule	enum	export
extends	final	float	goto	implemen
import	private	interface	long	native
package	super	protected	public	short
static	int	synchroized	throws	transient
Volatile

页面引入JavaScript

Js是一门运行在浏览器端的脚本语言。
类似于css，需要在html页面中引入javascript。

1.直接嵌入在这里插入代码片

<script type="text/javascript">
 	JavaScript代码 
</script>

注意：
//1.内部脚本可以在任意地方执行（即script标签可以放在任意地方）；但建议将js代码放在结构下边；body结束标签前面；
//2.Js代码是script的内容
//3.Script有一个type的属性，属性值是‘text/javascript’;表示当前文本是js内容；

2.外部js文件

<script src="js文件路径" type="text/javascript"></script>

//仍然使用script标签，使用了src属性，引用对应的js文件 //引用了外部js中，那么在script标签中的js代码是不会执行的。

3.行内 (内联)

小结：

1. 明白什么是js: //他是一种高级语言，高级语言中的 解释性语言
2. Js可以做什么 //可以进行跨平台使用，作input框的判断，抽奖的，单名器，
3. Js的三大组成部分： //ECMA-script:js的执行标准 、 BOM:浏览器的对象模型 、DOM:文档的对象模型
4. 引入js的三种方式：行内，内部，外部，注意不同的写法；（重点）

三种输出方式

1.JavaScript输出方式一弹出框

语法：
1.警告框
window.alert(“”) //弹出警告框

2.确认框
如果希里用户验证或接受某个东西，则通常使用〝确认”框。当确认框弹出时，用户将不得不单击“确定”或“取消”来继续进行。
原理：
如果用户点击“确定”，返回true。 如果用户点击“取消”，返回false
语法：window.confirm(‘请选择 确定 或 取消’);

2、document.write输出

这种输出方式是直接输出在页面当中。也是很简单的我们来看一下代码和运行效果。我们只需要敲上 document.write(“Hello World”); 这样就ok了。

3.console.log输出

这种方式应用于调试，属于通过调试工具方式输出。它的格式是

 console.log("Hello World");
 

JavaScript输入方式—输入框

使用window.prompt(“”)方法用于显示可提示用户进行输入的 对话框.

JavaScript变量

1.变量概念-标示符
2.如何声明变量
3.全局变量、局部变量

1.变量概念-标示符

变量概念（变量名和值）
var bac = 123;
var name = ‘老王’
注意：变量：变量是一个可以存储单个可变信息的容器；
变量是由两个部分构成的：
1.变量名：一般来说，等号左边的内容为变量名
2.变量值：一般来说，等号右边的内容为变量值

2.如何声明变量

关键字：声明变量的关键字是 ‘var’
1.单独声明
//一次性声明一个变量，每一个变量需要使用一个var。
var name = ‘南星’;

2.一次性声明多个 只需要一个’var’关键字，然后就可以声明多个变量。 注意：‘同时声明多个需要使用逗号隔开’ var name = ‘南星’,age = 18,sex = ‘男’;
注意：两个特别的声明方式’重复声明 ’ 和 ‘遗漏声明:’

1.重复声明: //重复声明，后来的会覆盖原先的。 var a = 5 ; var a = 6; alert(a);//6

2.遗漏声明: 在js中，允许遗漏声明，不会出错，如下： c = 123; alert©;

3.全局变量、局部变量

1.全局和局部是指变量的生效范围，在哪些地方能够起作用，能使用的。
2.全局和局部是以函数作为分界线的。
​’注意：javascript中没有常量’​，在js中，变量的值是可以改变的，也就是可以变化的。
​注意：‘变量需要先声明后使用’