1_ js介绍、入门，js引入，变量，值类型，运算符

代码段都有注解

web 发展史

最早的一个浏览器其实是3w (简写）只不过它刚刚出来就凉了 而真正正式投入使用的图像化浏览器是Mosaic,Mosaic是互联网历史上第一个获普遍使用和能够显示图片的网页浏览器。与1993年问世。
1994年4月,马克安德森和 Silicon Graphics(简称为SGl,中译为“视算科技"或“硅图”)公司的创始人吉姆·克拉克( Jim Clark)在美国加州设立了 Mosaic Communication Corporation"。
Mosaic公司成立后,由于伊利诺伊大学拥有Mosaic的商标权,且伊利诺伊大学已将技术转
让给 Spy glass公司,开发团队必须彻底重新撰写浏览器程式码,且浏览器名称更改为Netscape Navigator,公司名字于1994年11月改名为 Netscape Communication Corporation",此后沿用至今,中译为“网景”。微软的 nternet Explorer及 Mozilla firefox等,
其早期版本皆以 Mosaic为基础而开发。微软随后买下 Spy glass公司的技术开发出 Internet
Explorer浏览器,而 Mozilla firefox则是网景通讯家开放源代码后所衍生出的版本。

主流浏览器

浏览器			引擎
IE				trident
Chrome			webkit/blink
Firefox			Gecko
Safari			webkit

Opera presto（已废弃）现已改用Google Chrome的Blink内核，不算主流浏览器了

js历史

Java Script作为 Netscape Navigator浏览器的一部分首次出现在1996年。它最初的设计目标是改善网页的用户体验。
作者: Brendan Eich
期初 JavaScript被命名为,LiveScript,后因和Sun公司合作,因市场宣传需要改名JavaScript。后来Sun公司被Oracle收购, JavaScript版权归Oracle所有。

浏览器组成

1. shell部分
2. 内核部分
   渲染引擎(语法规则和渲染)
   js引擎
   其他模块

js发展

2001年发布ie6,首次实现对js引擎的优化和分离
2008年 Google发布最新浏览器Chrome,它是采用优化后的 javascripts引擎,引擎代号V8,因能把js代码直接转化为机械码来执行,进而以速度快而闻名
后 Firefox也推出了具备强大功能的js引擎
Firefox3.5 TraceMonkey(对频繁执行的代码做了路径优化)
Firefox4.0 JeagerMonkey

js的逼格

• 解释性语言—(不需要编译成文件)跨平台

  编译性语言 C C++
  有点：快
  不足：移植性不好（不跨平台）
  解释性语言 JavaScript php python
  有点：跨平台
  不足：稍微慢

• 单线程
• ECMA标注—为了取得技术优势,微软推出了JScript,CEnv推出 ScriptEase,与 JavaScript同样可在浏览器上运行。为了统一规格JavaScript兼容于ECMA标准,因此也称为ECMAScript。

js执行队列

轮转时间片：类似吃饭

js三大部分

ECMAScript、DOM、BOM

开始学习js

如何引入j5?
页面内嵌< script></ script>标签
外部引入< rscript src= location"></ script>
符合web标准(w3c标准中的一项)结构、样式、行为相分离,通常会采用外部引入

js基本语法

• 变量(ariable)
  • 变量声明
  1. 声明、赋值分解
     举例：
     var a = 20
     先声明变量a，再赋值
  2. 单一var模式
     举例：
     var a = 1;
     var b = 2;
     var c = 3;
     最好不要一直var而是换成一行,一次性申请到位，就能省时间
     var a=1,
     b=2,
     c=3;
  • 命名规则
  3. 变量名必须以英文字母、_、$开头
  4. 变量名可以包括英文字母、_、$、数字
  5. 不可以用系统的关键字、保留字作为变量名

关键字与保留字

来源：https://www.w3cschool.cn/javascript/js-reserved.html
JavaScript 保留关键字
Javascript 的保留关键字不可以用作变量、标签或者函数名。有些保留关键字是作为 Javascript 以后扩展使用。

abstract arguments boolean break byte
case catch char class* const
continue debugger default delete do
double else enum* eval export*
extends* false final finally float
for function goto if implements
import* in instanceof int interface
let long native new null
package private protected public return
short static super* switch synchronized
this throw throws transient true
try typeof var void volatile
while with yield

• 标记的关键字是 ECMAScript5 中新添加的。

JavaScript 对象、属性和方法
您也应该避免使用 JavaScript 内置的对象、属性和方法的名称作为 Javascript 的变量或函数名：

Array Date eval function hasOwnProperty
Infinity isFinite isNaN isPrototypeOf length
Math NaN name Number Object
prototype String toString undefined valueOf

Java 保留关键字
JavaScript 经常与 Java 一起使用。您应该避免使用一些 Java 对象和属性作为 JavaScript 标识符：

getClass java JavaArray javaClass JavaObject JavaPackage

Windows 保留关键字
JavaScript 可以在 HTML 外部使用。它可在许多其他应用程序中作为编程语言使用。

在 HTML 中，您必须（为了可移植性，您也应该这么做）避免使用 HTML 和 Windows 对象和属性的名称作为 Javascript 的变量及函数名：

alert all anchor anchors area
assign blur button checkbox clearInterval
clearTimeout clientInformation close closed confirm
constructor crypto decodeURI decodeURIComponent defaultStatus
document element elements embed embeds
encodeURI encodeURIComponent escape event fileUpload
focus form forms frame innerHeight
innerWidth layer layers link location
mimeTypes navigate navigator frames frameRate
hidden history image images offscreenBuffering
open opener option outerHeight outerWidth
packages pageXOffset pageYOffset parent parseFloat
parseInt password pkcs11 plugin prompt
propertyIsEnum radio reset screenX screenY
scroll secure select self setInterval
setTimeout status submit taint text
textarea top unescape untaint window

HTML 事件句柄
除此之外，您还应该避免使用 HTML 事件句柄的名称作为 Javascript 的变量及函数名。

实例：

onblur onclick onerror onfocus
onkeydown onkeypress onkeyup onmouseover
onload onmouseup onmousedown onsubmit

注意：在JavaScript中关键字不能用作变量名或者函数名，否则可能会得到错误消息，例如““Identifier Expected”（应该有标识符、期望标识符）”。

非标准 JavaScript
除了保留关键字，在 JavaScript 实现中也有一些非标准的关键字。

一个实例是 const 关键字，用于定义变量。 一些 JavaScript 引擎把 const 当作 var 的同义词。另一些引擎则把 const 当作只读变量的定义。

Const 是 JavaScript 的扩展。JavaScript 引擎支持它用在 Firefox 和 Chrome 中。但是它并不是 JavaScript 标准 ES3 或 ES5 的组成部分。建议：不要使用它。

基本语法

• 值类型 — 数据类型
  • 不可改变的原始值(栈数据)
    • Number, String, Boolean, undefined, null
  • 引用值(堆数据)
    • array object, function

原始值是存在栈里面的（stack）

var a = 10;// 栈中存放a的数值10
var b = a;// 栈中先把a的数值取出之后copy了这个数值10放到b中，所以不管改a的值还是b的值，互相不影响
a = 20;
document.write(b);// 所以b还是等于10

引用值大部分存在堆中（heap）

var arr = [1];// 因为是数组（array），所以是引用值，栈中arr存放了[1]所在的堆地址
var arr1 = arr;// 因为栈中的存放的是堆中[1]存放的地址！所以arr1中copy了arr存放的堆地址，所以一旦堆上的东西改变了，那么都会受到影响
arr.push(2);
document.write(arr1);// arr1打印出来是1,2

 var arr = [1,2];// 现在同样是存里[1,2]所在的堆地址
 var arr1 = arr;// arr1copy了[1,2]的堆地址
 arr = [1,3];// 但是现在arr重新赋值了一个[1,3],这个[1,3]会在堆上面重新开辟一块空间，所以arr重新存储了[1,3]的堆地址
 document.write(arr1);// arr1指向的还是[1,2]的堆地址，所以打印出来还是1,2

• js语句基本规则
  • 语句后面要用分号结束;
  • js语法错误会引发后续代码终止,但不会影响其它js代码块
  • 书写格式要规范,"=+/-"两边都应该有空格

错误分为：

1. 低级错误（语法解析错误）
2. 逻辑错误（标准错误，情有可原）

js运算符

• 运算操作符
  • “+”
    1. 数学运算、字符串链接
    2. 任何数据类型加字符串都等于字符串

• “-”，"*"，"/"，"%"，"="，"()"
• 优先级”"=“最弱,"()″优先级较高
• “++”，“- -”，“+=”，“-=”，“/=”，“*=”，“%=”

var a = 1 + 1 + "a" + 1 + 1;// 赋值为 2a11
var b = 1 + 1 + "a" + (1 + 1);// 赋值为 2a2
var c = 0 / 0;// NaN（not a number）
var d = 1 / 0;// Infinity（无穷）
var e = -1 / 0;// -Infinity（负无穷）

赋值的顺序 自右向左，计算的顺序，自左向右

var a = 10;
var b = ++a - 1 + a++;// 11 - 1 + 11
document.write(b + " " + a);// 21 12

 var a = 1;
 var b = a-- + --a;// --a的优先级别比较大，所以先算--a，得到a=0，b = 0-- + 0 = 0
 document.write(b);// 0

a 和 b 交换方法
第一种：（第三方变量）

var a = 1;
var b = 2;
var c = a;
a = b;
b = c;

第二种：（无第三方变量）

var a = 1;
var b = 2;
a = a + b;
b = a - b;
a = a - b;

• 比较运算符
  • “>”,"<","==",">=","<=","!="
  • 比较结果为 boolean值
• 逻辑运算符
  • “&&”,"||","!"
  • 运算结果为真实的值
• 被认定为 false的值
  • undefined, null, NaN, “”, 0, false

 var a = NaN == NaN;// 非数不等于任何东西，包括自己
 document.write(a);// 特例：false

逻辑运算符

// 先看与运算符第一个表达式转换为布尔值得结果，如果结果为真，那么它会看第二个表达式转换为布尔值得结果
// 如果只有两个表达式的话，只要看到第二个表达式，就可以返回第二个表达式的值了
//（undefined,null,NaN,"",0,false => false）如果返回为假，则把判断为假的表达式返回
var a = 1 && 2;// 2
var b = 0 && 2 + 2;// 0
var c = 1 && 0; // 0
var d = 1 && false; // false
var e = 1 && NaN; // NaN

// 短路语句！！！
data && fun(data) // 如果后端data没有传到前端，那么data就没有值，后面的fun（data）函数就不会执行

了解单个&，下面做的就是二进制与完之后再变成十进制结果，我给了注释，看不懂也没事

var a = 1 & 1; // 1 1&1=1
var b = 1 & 2; // 0 01&10=00
var c = 11 & 3; // 3 1011&11=11

div.onclick = function (e) {
  // 在非IE浏览器中，点击事件传参变量e是有值的，而IE浏览器中e这个变量是没有值
  // IE中的值是放在window.event中，为了做兼容：
  var event = e || window.event;
}

var a = true;
a = !a;
docoument.write(a);// false