1.JavaScript简史（来自w3cschool）
1.Nombas 和 ScriptEase
大概在 1992 年，一家称作 Nombas 的公司开发了一种叫做 C 减减（C-minus-minus，简称 Cmm）的嵌入式脚本语言。Cmm 背后的理念很简单：一个足够强大可以替代宏操作（macro）的脚本语言，同时保持与 C （和 C ++）足够的相似性，以便开发人员能很快学会。这个脚本语言捆绑在一个 叫做CEnvi 的共享软件中，它首次向开发人员展示了这种语言的威力。
Nombas 最终把 Cmm 的名字改成了 ScriptEase，原因是后面的部分（mm）听起来过于消极，同时字母 C “令人害怕”。
现在 ScriptEase 已经成为了 Nombas 产品背后的主要驱动力。
2.Netscape 发明了 JavaScript
当 Netscape Navigator 崭露头角时，Nombas 开发了一个可以嵌入网页中的 CEnvi 的版本。这些早期的试验被称为 Espresso Page（浓咖啡般的页面），它们代表了第一个在万维网上使用的客户端语言。而 Nombas 丝毫没有料到它的理念将会成为万维网的一块重要基石。
当网上冲浪越来越流行时，对于开发客户端脚本的需求也逐渐增大。此时，大部分因特网用户还仅仅通过 28.8 kbit/s 的调制解调器连接到网络，即便这时网页已经不断地变得更大和更复杂。而更加加剧用户痛苦的是，仅仅为了简单的表单有效性验证，就要与服务器进行多次地往返交互。设想一下，用户填完一个表单，点击提交按钮，等待了 30 秒的处理后，看到的却是一条告诉你忘记填写一个必要的字段。
那时正处于技术革新最前沿的 Netscape，开始认真考虑开发一种客户端脚本语言来解决简单的处理问题。
当时工作于 Netscape 的 Brendan Eich，开始着手为即将在 1995 年发行的 Netscape Navigator 2.0 开发一个称之为 LiveScript 的脚本语言，当时的目的是在浏览器和服务器（本来要叫它 LiveWire）端使用它。Netscape 与 Sun 及时完成 LiveScript 实现。
就在 Netscape Navigator 2.0 即将正式发布前，Netscape 将其更名为 JavaScript，目的是为了利用 Java 这个因特网时髦词汇。Netscape 的赌注最终得到回报，JavaScript 从此变成了因特网的必备组件。
3.微软和JScript
因为 JavaScript 1.0 如此成功，Netscape 在 Netscape Navigator 3.0 中发布了 1.1 版。恰巧那个时候，微软决定进军浏览器，发布了 IE 3.0 并搭载了一个 JavaScript 的克隆版，叫做 JScript（这样命名是为了避免与 Netscape 潜在的许可纠纷）。微软步入 Web 浏览器领域的这重要一步虽然令其声名狼藉，但也成为 JavaScript 语言发展过程中的重要一步。
在微软进入后，有 3 种不同的 JavaScript 版本同时存在：Netscape Navigator 3.0 中的 JavaScript、IE 中的 JScript 以及 CEnvi 中的 ScriptEase。与 C 和其他编程语言不同的是，JavaScript 并没有一个标准来统一其语法或特性，而这 3 种不同的版本恰恰突出了这个问题。随着业界担心的增加，这个语言的标准化显然已经势在必行。
2.JavaScript概述
1.JavaScript的特点
- 一种脚本语言
- 基于对象
- 动态性的
- 简单易用
- 安全性
- 跨平台性
- 改善用户体验
2.JavaScript的用法与输出
①用法：
HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
1.放到<head>中
<head>
<meta charset="UTF-8">
<title>第一个页面</title>
<script>
//点击跳转页面
function myforward() {
history.forward()
}
function myhref() {
console.log(location.href)
window.location.href="https://www.baidu.com";//跳转到百度
}
function myrl() {
console.log()
location.reload();//重新加载
}
</script>
</head>
2.放到<body>中
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test</title>
</head>
<body>
<script>
document.write(alert("JavaScript你好！"));
</script>
</body>
</html>
也可以创建一个js文件，在<script>里引用
<script src="../../jsFile/area.js" type="text/javascript"></script>
②输出：
JavaScript 可以通过不同的方式来输出数据：
- 使用 window.alert() 弹出警告框。
- 使用 document.write() 方法将内容写到 HTML 文档中。
- 使用 innerHTML 写入到 HTML 元素。
- 使用 console.log() 写入到浏览器的控制台。
3.JavaScript的核心语法
1.变量
用var关键字来声明变量
JavaScript声明变量的语法如下：
var massage;//声明变量
massage = "hi";//不声明变量而直接赋值
var width = 34,height = 31;//连续声明变量和赋值
JavaScript的变量是采用弱类型的形式，所以用var关键字来声明变量是不必确定类型，而是在使用或者赋值时自动确定其数据类型。
值得注意的是，JavaScript是区分大小写的，massage和MASSAGE是两个不同的变量哦。
2.数据类型
JavaScript有五种简单的基本数据类型：
- undefined 没有定义的数据类型
- null 空类型，表示一个变量已经有值，但值为空
- boolean 布尔类型，返回true或false判断
- number 数字类型
- string 字符串类型
- 还有另外一个复杂的数据类型---->object对象类型
3.JavaScript运算符
| 类型 | 运算符 |
|---|---|
| 算术运算符 | + - * / % ++ -- |
| 赋值运算符 | = |
| 比较运算符 | < > >= <= = = != |
| 逻辑运算符 | && ! || |
运算符使用实例：
这里只用了一些简单的常用的算数运算符与比较运算符，其他的以后再来介绍
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>test2</title>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
</script>
</head>
<body>
<!-- 根据出行月份和舱位类型，核算机票的最终价格 -->
<script>
var time = new Date();
var month = time.getMonth()+1;
var currentmoney = 3200;//当前价格
var cang = "头等舱";//舱位
var zk = null;//折扣
//判断你的折扣类型与最终价格
if (month == 5 || month == 6 || month == 7 || month == 8 || month == 9 || month == 10) {
if (cang = "头等舱") {
zk = "9折";
money = currentmoney * 0.9;
} else {
zk = "75折";
money = currentmoney * 0.75;
}
document.write("您的机票原价:" + currentmoney +"<br>"+"您出行的月份为:" + month+"<br>"+ "舱位:" + cang + "<br>"+"您的折扣为:" + zk + "<br>"+"最终价格:" + money+"元");
} else if(month ==1 || month == 2 || month == 3 || month == 4 || month == 11 || month == 12) {
if (cang = "头等舱") {
zk = "6折";
money = currentmoney * 0.6;
} else {
zk = "3折";
money = currentmoney * 0.3;
}
//算出你的最终价格以及你的折扣力度
document.write("您的机票原价:" + currentmoney +"<br>"+"您出行的月份为:" + month+"<br>"+ "舱位:" + cang + "<br>"+"您的折扣为:" + zk + "<br>"+"最终价格:" + money+"元");
}
</script>
</body>
</html>
运行出来效果如下
4.JavaScript注释
JavaScript与java、c#一样，都支持同样的注释格式
（1）使用“//”实现单行注释
（2）多行注释
<script>
/*
这是JavaScript的多行注释
*/
</script>
5.JavaScript的流程控制语句
JavaScript常用的成员流程结构有三种：
- 顺序结构
顺序结构表示程序中的各操作是按照它们出现的先后顺序执行的。 - 选择结构
1.while循环
while( 布尔表达式 ) {
//循环内容
}
注意：while循环如果一直返回的都是true，则代表此循环是死循环，应该避免这种情况
循环语句实例：
<table border="1" width="600">`
<tr>
<td>摄氏温度</td>
<td>华氏温度</td>
</tr>
<script type="text/javascript">
//摄氏度与华氏度的转换表格
var f; // 华氏摄氏度
var c = 0;//摄氏度
var count = 1; //条目
while (count <= 10 && c <= 250) {
f = c * 9 / 5.0 + 32; // 转换
document.write("<tr align = 'center'><td>" + c + "</td><td>" + f + "</td></tr>");
c = c + 20;
count++;
}
</script>
</table>
2.do...while循环
do {
//代码语句
}while(布尔表达式);
do...while循环是在执行完循环后再来检测条件表达式的值得
3.for循环
for(初始化; 布尔表达式; 更新) {
//代码语句
}
4.多重分支if语句
if(条件1){
//条件1成立时执行
}else if(条件2){
//条件2成立时执行
}else if(条件3){
//条件3成立时执行
}...else{
//条件不成立时执行
}
总结
JavaScript是我们在进行web网页开发是最常用的语言之一，也是web开发工作者必学的三门语言之一。
初识JavaScript我们知道了JavaScript的基本语法与他的流程控制语句以及其他的一些常识知识，但是这仅仅是一个开始，后面我们还要学到JavaScript的函数和JavaScript的对象以及jquery的相关知识。
而学习JavaScript只是一个前端工程师需要学的的东西的千分之一，一个好的前端工程师需要学习与了解的东西如下：
