一:JavaScript简介
JavaScript 是一种专为与网页交互而设计的脚本语言
在HTML中使用JavaScript:
<!-- 方式一:内嵌 -->
<script type="text/javascript">
alert("hello world");
</script>
<!-- 方式二:导入外部js -->
<script src="/javascripts/application.js" type="text/javascript" charset="utf-8" async defer></script>
<script>属性介绍:
type:type="text/javascript"
src:外部JS文件URL
defer:表示脚本延迟到文档完全被解析和显示后再执行;相当于告诉浏览器立即下载,但延迟执行;只应用于外部脚本
async:表示应该立即下载脚本,但不应妨碍页面中的其他操作(异步);只应用于外部脚本
<script>元素最好放在<body>元素中最后面。
原因:JavaScript文件若放在<head>中,意味着必须等到全部JavaScript代码都被下载、解析和执行后,才能开始呈现页面的内容,这会造成页面呈现的明显延迟
ECMAScript中的一切(变量名、函数名和操作符)都区分大小写。
标识符:变量、函数、属性的名字
①可包含字母、数字、下划线和美元符号$
②首字符不能为数字
ECMAScript标识符采用驼峰大小写格式,如getElementById
ECMAScript的变量是松散类型的,即一个变量可以用来保存任何类型的数据
注释://单行注释 /* 多行注释 */
二:数据类型
ECMAScript数据类型:5种基本数据类型 + 1种复杂数据类型
1,基本数据类型
1.1 undefined:声明变量但未初始化,其值自动被赋予undefined;var message;
1.2 null:表示一个空对象指针;如果定义的变量准备在将来用于保存对象,那么最好将该变量初始化为null值
1.3 Boolean:布尔值,只有两种值 true 和 false
函数Boolean()可将所有数据类型转换为其对应的Boolean值(布尔值为false的有:false、""(空字符串)、0、NaN、null、undefined)
1.4 Number:数值类型
函数isFinite()可以确定一个数值是不是有穷数
函数isNaN()可以确定一个数是否“不是数值”,该函数会尝试将其他数据类型转换为数值,如字符串"10"或Boolean值
由于保存浮点数值需要的内存空间是保存整数值的两倍,因此ECMAScript会不失时机地将浮点数值转换为整数值
由于浮点数值计算会产生舍入误差的问题,因此,永远不要测试某个特定的浮点数值!
<script type="text/javascript">
var a=0.1;
var b=0.2;
var c;
if (a+b == 0.3){ //不要做这样的测试!
c=1;
}
console.log(c) //结果为: undefined
</script>
NaN:非数值(Not a Number);NaN不等于其本身!
可以把非数值转换为数值的3个函数:
①Number():用于任何数据类型
true-->1;false-->0;null-->0;""-->0;undefined-->NaN;"hello"-->NaN;"12blue"--> NaN;"123"-->123; "1.1" -->1.1; "011"--> 11(无法解析八进制值); "0xA"--> 10(可以解析十六进制值);
②parseInt():用于把字符串转换成数值(整数)
"12blue"--> 12; ""--> NaN; "22.5"--> 22; "0xA"--> 10
parseInt()解析八进制字符串时,ECMAScript 3和ECMAScript 5存在分歧!为消除此困惑,可以为此函数提供第二个参数:转换时使用的基数
parseInt("070",8); //56 parseInt("070",10); //70
③parseFloat():用于把字符串转换成数值(浮点数),只解析十进制值(无法解析八进制与十六进制值)
"12blue"--> 12; ""--> NaN; "22.5"--> 22.5; "0xA"--> 0
1.5 String:字符串类型,由双引号或单引号表示
转换为字符串的方法:
toString()方法:null和undefined没有这个方法
String()函数:有toString方法的,返回其结果;null,undefined分别返回"null" 和 "undefined"
var a=10;
a.toString(); //"10"
a.toString(2); // "1010"
a.toString(8); // "12"
a.toString(16); // "a"
2,复杂数据类型
Object:对象类型
ECMAScript中的对象其实就是一组数据和功能的集合
var hi = new Object();
在ECMAScript中,Object类型是所有它的实例的基础,即Object是所有对象的基础
Object属性和方法:①构造函数 constructor:保存着用于创建当前对象的函数
②hasOwnProperty(propertyName):用于检查给定的属性在当前对象实例中是否存在;属性名必须以字符串形式指定
③isPrototypeOf(Object):用于检查传入的对象是否是当前对象的原型
④propertyIsEnumerable(propertyName):用于检查给定的属性是否能够使用for-in语句来枚举;属性名必须以字符串形式指定
⑤toLocalString():返回对象的字符串表示,该字符串与执行环境的地区对应
⑥toString():返回对象的字符串表示
⑦valueOf():返回对象的字符串、数值或布尔值表示
三:操作符
1,一元操作符
①前置递增和递减操作符:变量的值是在语句被求值之前改变的
var m = 1;
++m; //等价于 m=m+1
--m; //等价于 m=m-1
②后置递增和递减操作符:在包含它们的语句被求值之后才执行的
var m = 1;
m++; //等价于 m=m+1
m--; //等价于 m=m-1
③一元加和减操作符:
m= +m; //对数值m不会产生任何影响;若m为非数值类型,则将其转换为数值类型
m= -m; //主要用于表示负数
一元操作符适用于任何值:数值、字符串、布尔值、对象
一元操作符能将非数值类型转换为数值类型
2,位操作符
ECMAScript中的所有数值都以IEEE-754 64位格式存储,但位操作符并不直接操作64位的值,而是先将64位的值转换成32位的整数,然后执行操作,最后再将结果转换回64位。
第32位用于表示数值的符号:0表示整数,1表示负数
负数采用二进制补码格式存储:①求这个数值绝对值的二进制码;②求二进制反码,即0-->1,1-->0;③得到的二进制反码加1
按位非 | 表示符号:~ | 返回数值的反码 |
按位与 | 表示符号:& | 将两个数值的每一位对齐进行逻辑与操作 |
按位或 | 表示符号:| | 将两个数值的每一位对齐进行逻辑或操作 |
按位异或 | 表示符号:^ | 两个数值对应位上不同时返回1,相同时返回0 |
左移 | 表示符号:<< | 将数值的所有位向左移动指定的位数 不影响符号位;以0填充右侧多出的空位 |
有符号的右移 | 表示符号:>> | 将数值的所有位向左移动指定的位数 不影响符号位;用符号位的值填充所有空位 |
无符号的右移 | 表示符号:>>> | 将数值的所有32位(包括符号位)都向右移动 以0来填充空位 |
3,布尔操作符
逻辑非 | 表示符号:! | 先将它的操作数转换为一个布尔值,然后再对其求反 |
逻辑与 | 表示符号:&& | 两个操作数均为true时返回true 属于短路操作符 |
逻辑或 | 表示符号:|| | 有一个为true返回true;两个操作数均为false时返回false 属于短路操作符 |
短路操作符:如果第一个操作数能够决定结果,就不会再对第二个操作数求值
逻辑与运算规则:
第一个操作数是对象,则返回第二个操作数;
第一个操作数求值结果为true,第二个操作数是对象,返回该对象;
第一个操作数是null、NaN、undefined,则返回null、NaN、undefined
逻辑或运算规则:
第一个操作数是对象,则返回第一个操作数;
第一个操作数求值结果为false,则返回第二个操作数;
两个操作数都是null、NaN、undefined,则返回null、NaN、undefined
4,乘性操作符
若参与乘性计算的某个操作数不是数值,后台会先使用Number()函数将其转换为数值
乘法 | 符号:* | 1,乘积超过数值表示范围,返回Infinity或-Infinity 2,若有一个操作数是NaN,则返回NaN 3,Infinity与0相乘,返回NaN 4,Infinity与非0相乘,返回Infinity或-Infinity |
除法 | 符号:/ | 1,若有一个操作数是NaN,则返回NaN 2,Infinity被Infinity除,零被零除,结果为NaN 3,非零的有限数被零除,返回Infinity或-Infinity 4,Infinity被任何非零有限数值除,返回Infinity或-Infinity |
求模(取余) | 符号:% | 1,被除数是无穷大值而除数是有限大的数值,结果为NaN 2,被除数是有限大的数值而除数是零,Infinity被Infinity除,结果为NaN 3,被除数是有限大的数值而除数是无穷大的数值,结果是被除数 4,被除数是零,则结果为零 |
5,加性操作符
加法 | 符号:+ | 1,两个操作数都是数值,执行常规的加法计算; Infinity加-Infinity,其结果是NaN; 2,有一个操作数是字符串,则加号起到连接符的作用 会将另一个不是字符串的操作数转换为字符串 3,有一个操作数是对象、布尔值、null或undefined,将它们转换为相应数值类型 |
减法 | 符号:- | 1,Infinity减Infinity,-Infinity减-Infinity,其结果是NaN; 2,有一个操作数是字符串、布尔值、null或undefined,则先在后台调用Number() 函数将其转换为数值再进行减法运算 3,有一个操作数是对象,则调用对象的valueOf()方法取得表示该对象的数值,若无 valueOf()方法,则调用其toString()方法并将得到的字符串转换为数值 |
6,关系操作符
有 < (小于),> (大于), <= (小于等于), >= (大于等于)。
规则:
①两个操作数都是字符串,则比较两个字符串对应的字符编码值;
②有一个操作数是数值,则将另一个操作数转换为一个数值,再进行数值比较;
③一个操作数是布尔值,则先将其转换为数值,再进行比较
7,相等操作符
7.1 相等(==)和不相等(!=):先转换再比较
规则:
①有一个操作数是布尔值,先将其转换为数值再进行比较;
②一个操作数是数值,另一个是字符串,先将字符串转换为数值;
③null和undefined不能转换成其他值,且null==undefined;
④NaN不等于其本身,即NaN != NaN;
⑤两个操作数都是对象,则比较它们是不是同一个对象
7.2 全等(===)和不全等(!==):仅比较而不转换
null !== undefined;NaN !== NaN
8,赋值操作符
符号:=
复合赋值操作符:+=、-=、*=、/=、%=、<<=、>>=、>>>=
var m = 1;
m += 1; //等价于 m = m+1;其它类推
9,条件操作符(三元表达式)
variable = boolean_expression ? true_value : false_value;
条件表达式为真,则将值true_value赋给变量variable;条件表达式为真,则将值false_value赋给变量variable
补充:typeof操作符
typeof操作符:用于检测给定变量的数据类型
typeof返回值:
undefined 值未定义;
boolean 布尔值;
string 字符串;
number 数值 (包括NaN);
object 对象或null(null被认为是一个空的对象引用;
function 函数
四:语句
1,if语句
if (condition1){
statement1
}else if (condition2){
statement2
}else{
statement3
}
2,do_while语句
// 循环体内的代码至少会被执行一次
do {
statement
}while(expression);
3,while语句
while(expression){
statement
}
4,for语句
// 参数分别为:初始化表达式;控制表达式;循环后表达式 (均为可选)
for(initialization;expression;post-loop-expression){
statement
}
5,for-in语句:是一种精准的迭代语句,可用来枚举对象的属性
for (property in expression){
statement
}
6,label语句:在代码中添加标签,以便将来使用
label:statement
7,break和continue语句
它们用于在循环中精确地控制代码的执行,可与label语句联合使用
break; //会立即退出循环,强制继续执行循环后面的语句
continue; //立即结束本次循环,继续执行下一次循环
8,with语句:将代码的作用域设置到一个特定的对象中
其目的主要是为了简化多次编写同一个对象的工作
with (expression){
statement
}
9,switch语句
可在switch语句中使用任何数据类型;
每个case的值不一定是常量,可以是变量,甚至是表达式;
switch语句在比较值时使用的是全等操作符,因此不会发生类型转换。
switch (expression) {
case label_1:
// statements_1
break;
case label_2:
// statements_2
break;
default:
// statements_def
break;
}