本文回顾了JavaScript的历史，从Netscape Navigator浏览器的组成部分到现代高性能引擎的发展，如V8和SpiderMonkey。深入介绍了JavaScript的基本语法，包括变量、数据类型、运算符、条件语句等内容。
1.js 历史
JavaScript 作为 Netscape Navigator 浏览器的一部分首次出现在 1996 年。它最初的设
计目标是改善网页的用户体验。
作者：Brendan Eich
期初 JavaScript 被命名为 LiveScript，后因和 Sun 公司合作，因市场宣传需要改名
JavaScript。后来 Sun 公司被 Oracle 收购，JavaScript 版权归 Oracle 所有。
2.浏览器组成
1.shell部分——用户能操作部分壳
2.内核部分——用户看不到的部分
1)渲染引擎（语法规则和渲染）
2)js引擎
3)其他模块（如异步）
3.js引擎
2001年发布ie6，首次实现对js引擎的优化。2008年Google发布最新浏览器Chrome，它是采用优化后的javascript引擎，引擎代号V8，因能把js代码直接转化为机械码来执行，进而以速度快而闻名。后Firefox也推出了具备强大功能的js引擎Firefox3.5 TraceMonkey（对频繁执行的代码做了路径优化）
Firefox4.0 JeagerMonkey
4.开始学习 js
js 三大部分 ECMAScript、DOM、BOM
如何引入 js?
1、页面内嵌标签,写 head 里面也行,写 body 里面也行
例：
<body>
<script type="text/javascript">
//告诉浏览器我们是 js
</script>
</body>
2、外部 js 文件，引入
例如：以 lesson.js 保存文件，再引入到 html 中
为符合 web 标准（w3c 标准中的一项）结构（html）、行（js）、样式（css）
相分离，通常会采用外部引入。
一个文件中可以包括多个 css，js——不混用
特殊写页面，大部分写在外部——不混用
如果同时写了内部的 js 和外部的 js，那么是外部的 js 文件显示出来
js 的逼格(特有特色）
| 编译型语言 | 解释性语言 | |
|---|---|---|
| 怎么做 | 通篇翻译后，生成翻译完的文件， 程序执行翻译后的文件 | 看一行翻译一行，不生成特定文件 |
| 代表语言 | C,C++ | JS,PHP，python 带尖角号 |
| 优点 | 快(常用于系统，游戏) | 可以跨平台 |
| 缺点 | 移植性不好（不跨平台，window 和Linux 不能混用） | 稍微慢点 |
js 是解释性语言：(不需要编译成文件）跨平台
java 先通过 javac，编译成.class 文件，通过 jvm（Java 虚拟机）进行解释执行
.java→javac→编译→.class→jvm→解释执行（java 可以跨平台）（java 是 oak 语言）
| 主流浏览器（必须有独立内核）市场份额大于 3% | 内核名称 |
|---|---|
| IE | trident |
| chrome | webkit/blink |
| firefox | gecko |
| opera | presto |
| safari | webkit |
开始学习 js
js 三大部分 ECMAScript、DOM、BOM
如何引入 js?
1、页面内嵌标签,写 head 里面也行,写 body 里面也行
例
<body>
<script type="text/javascript">
//告诉浏览器我们是 js
</script>
</body>
2、外部 js 文件，引入
例如：以 lesson.js 保存文件，再引入到 html 中
为符合 web 标准（w3c 标准中的一项）结构（html）、行为（js）、样式（css）
相分离，通常会采用外部引入。
一个文件中可以包括多个 css，js——不混用
特殊写页面，大部分写在外部——不混用
如果同时写了内部的 js 和外部的 js，那么是外部的 js 文件显示出来
js 基本语法
1、变量(variable)
HTML，css 不是编程语言，是计算机语言，编程语言需要有变量和函数
变量是存放东西，方便后续使用的框
1）变量声明
1.声明、赋值分解
var a; 这个叫变量声明。我们向系统中申请了 var 这个框，命名叫 a 给 a 赋值 100，写作 a =100，这里不是等号是赋值
var a ；a =100；可以简化写成 var a=100；
2.单一 var 声明法
如写做：var a = 10；a=20;那么后面的 20 就会覆盖掉前面的 10
2）命名规则（用接近的英文单词）———— 起变量名一定要以英文语义化
1.变量名必须以英文字母、、$ 开头
2.变量名可以包括英文字母、、$、数字
3.不可以用系统的关键字、保留字作为变量名
基本语法
下面是变量,例：var a = 10;
var b = 20;
var c;
c = a + b;
先运算等号右边的 a+b，运算完后，再赋值给左边 c
先取值，再赋值
运算大于赋值的优先级
js 是动态语言，动态语言基本上都是解释性语言，解释性语言基本上都是脚本语言
js 是浮点型语言（带小数点）
值类型（数据类型）
1、不可改变的原始值（栈数据）栈 stack
Number,String,Boolean,undefined,null
已经放进去的值不可改变，只会改房间编号为 null(硬盘原理)
Number 数字,例 var a = 123;
String 字符串,语言放双引号里，例 var a=”语言”，““是空串
Boolean 布尔数字,就两个值，false，true
undefined 是没有定义的，表示还没赋值,仅一个值 underfined
null 代表空，占位用，用空值来覆盖
例 var a =10;
var b = a;
a = 20;
document.write(b);
答案：10
原始值是我把一个值放到另一个值里面，改了第一个值，第二个值不变
2、引用值（堆数据）大致上放堆 heap 里面
array 数组, Object, function … data,RegExp 正则
var arr = [1,2,3,4,5,false,”abc”]; //这是数组
例：var arr = [1];
var arr1 = arr;
arr.push(2);
document.write(arr1);
答案：arr 是 1,2。arr1 是 1,2
引用值是把第一个值放到第二个值里面，改第一个值，第二个值也改变
js 由值决定类型。原始值和引用值唯一的不同是赋值形式不同
var a = 10;var b =a；是 a 先取出 10，copy 一份放到 b 里面，改变 a 的值，b 的值是不
变的，再把 a=20;时 b 的值还是 10，不发生改变
var arr = [1,2];var arr1 =arr;arr.push(3);
答案：这往[1,2]放 3，arr 和 arr1 都是[1,2,3]
引用值是在栈内存里面放堆的地址，拷贝的也是地址，所以改变 arr，arr1 也变了
var arr = [1,2]; var arr1 =arr; arr = [1,3]; document.write(arr1)
答案：arr = [1,3];是新建了一个新的房间。arr1 是 1,2,现在是插入新引入值”房间”,
会在堆里面重新申请一间房，并指向新房间
js 语句基本规则
1、语句后面要用分号结束“；”但 function test(){}，for(){}，if(){}后面都不用加分号
2、js 语法错误会引发后续代码终止，但不会影响其它 js 代码块
错误分为两种
1）低级错误（语法解析错误），不能写中文
2）逻辑错误（标准错误，情有可原，错的那个执行不了）
3、书写格式要规范，“= + / -”两边都应该有空格
js 运算符
一、运算操作符
- “+”作用：数学运算、字符串链接
2.任何数据类型加字符串都等于字符串
例 var a = “a”+ true + 1; //打印 atrue1
例 var a = 1 + “a” + 1 + 1; //打印 1a11
例 var a = 1 + 1 + “a” + 1 + 1; //打印 2a11，从左向右运算
例 var a = 1 + 1 + “a” +( 1 + 2); //打印 2a3
例 var a = 0 – 1； //等于-1 例 var a = 2 * 1； //等于 2 例 var a = 0 / 0； //答案是 NaN，应该得出一个数字类型的数，但是没法表达，
就用 NaN (NaN 是 Not a Number 非数，不是数，但是是数字类型
例 var a = 1 / 0; //是 infinity
例 var a = -1 / 0; /是-infinity
%，摩尔，模，是取余数的意思
例 var a =5%2 //5%2 是五除二的余数，商二余一
例 var a =5%1 //是五除一的余数，结果是 0 例 var num = 1 % 5; //意思是 1 除以 5 的余数。商 0 余 1 例 var a =4%6 //是四除六的余数，结果是 4 例 var a = 4;a % = 5;document.write(a); // 4 例 var a = 0;a % = 5;document.write(a); //0 例 var a = 10;a %= 2;document.write(a); //0 例 var a = 3;a % = 4; //4 “-”，“*”，“/“，“%”，”=“，“()”
优先级”=“最弱【赋值符号优先级最低】，”()”优先级较高
“++”，“- -”，”+=“，“-=”，“/=“，“*=”，“%=”
++
例 var a = 10; a = a + 1; //结果 11
例 var a = 1;
a = a + 1;写成 a ++是一种简化形式“++”，是自身加一，再赋值给自身
a++是 a=a+1 的简化形式
例 var a =10；document.write(++a );document.write(a); //答案 11；11
是先执行++，再执行本条语句 document.write(++a)
例 var a =1；document.write(a ++);document.write(a); //答案 1；2。是先执行
语句(document.write(a))，再++，所以第一次打印的还是 a，第二次打印 a++后的值
例 var a =10；var b=++a -1+a++;document.write(b + “ ” + a) //答案 21 12
先++a，这个时候 a=11，再-1，再加 a，b 就是 21，最后++，a 就是 12
赋值的顺序自右向左，计算的顺序自左向右（按数学来）
例 var a =1；var b = a ++ + 1；document.write(b)； //答案 2，先执行 var b =a+1， 再 a++
例 var a =1；var b = a ++ + 1；document.write(a)；document.write(b)； //答案 2，2 例 var a =1；var b = ++a + 1；document.write(a)；document.write(b)； //答案 2，3 例 var i = 1;var a = i++; //答案 a = 1; 此时 i 先将值 1 赋给 a,然后自己+1，i=2;
var b = ++i; //答案 b = 3；此时 i 先自己+1 为 3.再给 b 赋值，b=3;
“- -”，是自身减一，在赋值给自身
例 var a = 1;var b = a-- + – a;document.write(b);
//答案 0，先执行–a;此变成
0，然后第一个 a 也变成 0，那么 b = 0-- + --a 例 var a = 1;var b = --a + --a;document.write(b);
//答案-1 例 var a = 1;document.write(a++);document.write(a);
//答案 1；2 例 var a = 1;document.write(++a);document.write(a); //答案 2；2 例 var a =1; var b = a ++ +1;document.write(b);
//答案 2 a 写在后面就后运行，先计算 a+1=2 赋值给 b 后再++
例 var a = 1;var b= ++a + 1;document.write(a);document.write(b); //答案 2；3
+= -= 例 var a =10;a ++;a ++;a ++;加十个
简化写法：a +=10;也是 a = a+10;
例 var a =10;a += 10 + 1; //答案 21
例 var a = 1;a = a + 10;等于 a+=10
a++是 a +=1 的写法
/=
例 var a=10;a/=2;
//答案 5，是除二赋给自身的意思
例 var a =10;a *=2; //答案：20，是乘二赋给自身的意思
%=
例 var a=10;a%=2; //答案：0， 10 能整除 2,余数是 0,取余，余数赋给自身。
例 var a=3;a%=4; //答案：3，3 除以 4，余数为 3，余数赋给自身。
例 var a=0;a%=4; //答案：0，0 除以 4，余数为 0，余数赋给自身。
例 var a = 1;a% =10; //答案：1，1 除以 10，余数为 1，余数赋给自身。
二、比较运算符
1、“>”，”<”，”==”，“>=”，“<=”，”!=”比较结果为 boolean 值
但凡是运算符，都是要有运算的
用到布尔值，true 或 false
字符串的比较，比的是 ASCII 码（七位二进制 0000000） >， < 例 var a = “a”>“b”;document.write(a); //答案是 false
例 var a = 1 > 2;document.write(a); //答案是 false
例 var a = 1 < 2;document.write(a); //答案是 true
例 var a = “1”>“8”;document.write(a); //答案是 false
例 var a = “10”>“8”;document.write(a); //答案 false，不是十和八比，是字符串一
零和八比，先用开头的一和八比，比不过就不看第二位了；一样的就拿零和八比
例 var a = 123;document.write(a); //答案 false
运算结果为真实的值
= =，等不等于
例 var a = 1 == 2; //答案是说 1 等不等于 2，因为 1 肯定不等于 2，所以值为 false
例 var a = NaN == NaN; //答案是 false，NaN 不等于任何东西，包括他自己
例 var a = undefined == underfined; //答案是 true
例 var a = infinity == infinity; //答案是 true
例 var a = NaN == NaN; //答案是 false。非数 NaN 是不等于自己的
NaN 得不出数，又是数字类型，就是 NaN
!=是否不等于，非等
比较结果为 boolean 值：true 和 false
三、逻辑运算符：“&&”，“||”，“!“运算结果为真实的值
“&&”与运算符
两个表达式：先看第一个表达式转换成布尔值的结果是否为真，如果结果为真，那
么它会看第二个表达式转换为布尔值的结果，然后如果只有两个表达式的话，只看
看第二个表达式，就可以返回该表达式的值了，如果第一位布尔值为 false，不看后
面的，返回第一个表达式的值就可以了
运算符就是要求结果
例 var a = 1 && 2; //答案 2，如果第一位 1 为真，结果就为第二位的值 2 例 var a = 1 && 2 + 2; //答案 4，如果 1 为真，结果就为 4 例 var a = 0 && 2 + 2; //答案 0 例 var a = 1 && 1 && 8; //答案 8，先看第一个是否为真，为真再看第二个，
中途如果遇到 false，那就返回 false 的值
例 var a =1 + 1 && 1 – 1;document.write(a); //答案 0
如果是三个或多个表达式，会先看第一个表达式是否为真，如果为真，就看第二个
表达式，如果第二个也为真，就看第三个表达式（如果为真就往后看，一旦遇到假
就返回到假的值），如果第三个是最后一个表达式，那就直接返回第三个的结果
如果第一个是假，就返回第一个值，当是真的时候就往后走，一旦遇到假，就返回
例：2>1 && document.write(‘成哥很帅’) //意思是如果 2 大于 1，那么就打 印成哥很帅，如果前面真才能执行后面的（相当于短路语句使用）
&&与运算符是有中断作用的，当短路语句使用(如果。。那么。。) 例 var data = …; //执行一个语句，会用到 data
data&&执行一个语句全用到 data
例 data && function(data);
&与运算 我们一般不用
例 var num = 1 & 2;document.write(num); //答案 0 例 var num = 1 & 1;document.write(num); //答案 1 例 var num = 1 & 3;document.write(num); //答案 1
| 上下一与，不同为 0，相同为 1 | ||
|---|---|---|
| 1 在二进制中，是 1（为了对齐补的 0） | 0 | 1 |
| 3 在二进制中，是 11 | 1 | 1 |
| 运算结果 | 0 | 1 |
“||”或运算符
例 var num = 1 || 3; //答案 1 例 var num = 0 || 3; //答案 3 例 var num = 0 || false; //答案是 false
看第一个表达式是否为真，如果为真，则返回第一个值，碰到真就返回
如果第一个表达式是假，就看第二个表达式，如果第二个是最后一个，就返回第二
个的值
关注真假的说法：全假才为假，有一个真就为真
例 var num = 0 || false || 1;document.write(num); //答案 1 例 div .onclick = function(e){
非 IE 浏览器直接取 e 值
var event = e;
IE 浏览器存在 window.event;
}
div.onclick=function(e){
非IE浏览器
var event=e;
IE window.event;
}
写成下面这样就解决了兼容性。在所有的浏览器中都好使
div .onclick = function(e){var event = e || window.event;}
“!“非运算符，否的意思。
先转成布尔值，再取反
例 var a = ! 123;document.write(a); //答案 false。123 的布尔值是 true，取反是 false
例 var a = ! “”;document.write(a); //答案 true。空串””布尔值是 false，取反是 true
例 var a = ! !“”;document.write(a); //答案 false，取反后，再反过来，结果不变
例 var a = true;a =!a;document.write(a) //答案 false，自身取反，再赋值给自身
！=非等于是表达他们到底等不等的
四、被认定为 false 的值：转换为布尔值会被认定为 false 的值 undefined，null，NaN，
“”（空串）， 0， false
条件语句
一、If 语句 if、if else if if <—> && 转换
if(条件判断){
当条件成立时，执行里面的执行语句
}当 if 的条件成立时，才能执行{}内的语句
当条件转化为布尔值，如果为 true 就执行；如果为 false 就不执行
例 if(1 < 2){document.write(“老邓很丑”);}
例 if ( 1 > 0 && 8 > 9){}
&&放在 if 中的，全真才为真，&&是并且的意思
例 if ( 1 > 0 || 8 > 9){}
||放在 if 中是或者的意思，有一个是真就可以了
例:
//90-100 alibaba
//80-90 tencent
//70-80 baidu eleme xiecheng
//60-70蘑菇街
//60以下你肯定不是我教的
<script text=javascript>
var score=parseInt(window.prompt('input'));
if(score > 90 && score<=100){
document.write('alibaba');
}
if(score > 80 && score<=90){
document.write('alibaba');
}
if(score > 70 && score<=80){
document.write('alibaba');
}
if(score > 60 && score<=70){
document.write('alibaba');
}
if(score < 60){
document.write('你不是我教的');
}
</script>
//不能写 90<score<100,这样写会先比 90<score,等于 true 以后再跟 100 比
//else if 满足了第一条就不看第二条了，用 else if 要满足条件与条件之间互斥，不能
有交叉点。除了上面所有以外的。else if 除了这个以外，满足第一个就不看了，不满
足就看后面的
else if 除了这以外在看这个满不满足。满足条件后就不看了
下面的写法不够简洁
else 是上面这个条件的补集
简洁写法见下
if(score > 90 && score<=100){
document.write('alibaba');
}
else if(score > 80 && score<=90){
document.write('alibaba');
}
else if(score > 70 && score<=80){
document.write('alibaba');
}
else if(score > 60 && score<=70){
document.write('alibaba');
}
else(score < 60){
document.write('你不是我教的');
}
IF 和&&的互相转化
if (1 > 2) {
document.write.(‘a’);
}上面与右边效果完全一样1 > 2 && document.write(‘a’);&&和II比较常用在条件判断中
扫一扫
1633
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
