JavaScript的三种使用方式
1.行内
在事件处理程序中,将JS代码编写到标签的onclick或onmouseover之类的属性中。不过值得注意的是,将JS代码写在标签中不方便维护,所以这种做法并不推荐。
<button onclick="alert('点击成功');">点击一下</button>
2.内部
将JS代码写在script标签内,并将标签插入到网页中。
<script>
alert("js代码可以写在script标签中")
</script>
将代码写在外部JS文件中,通过给script标签添加src属性来引入外部样式。而写到外部文件中的JS代码可以在不同页面中同时引用,可以增强代码的复用性,使用这种是写JS代码的推荐方式。
//引入外部JS文件
<script src="./02-js代码.js"> </script>
//该标签内不能再写js代码,若需要则可另外写一个script标签
//外部JS文件内容
alert("外部js代码")
JavaScript的数据类型
JavaScript的常用数据类型有六种,分为基本数据类型和引用数据类型,可以通过typeof运算符来检查数据对象的类型。
1.基本数据类型有以下几种
Number 数值类型,包括整数和浮点数。
String 字符串类型,字符串类型通过引号或者单引号进行定义。
Boolean 布尔值类型,布尔值类型只分为true和false两种。
null 空数据类型,就是表示空值。
Undefined 未定义数据类型,表示一个未声明变量,或者已声明但未赋值。
2.引用数据类型
Object 对象类型
数据的强制类型转换
强制类型转换,指将一个数据类型强制转换为其他数据类型,类型转换主要指,将其他的数据类型,转换为String、Number和Boolean类型
1.将其他类型转换为String类型
方法一:通过调用被转换数据类型的toString()方法来实现,该方法不会影响原变量类型,但该方法有返回值,所以可以通过给原变量赋值的形式改变原变量数据类型。不过null和undefined这两个类型没有该方法,若使用则会报错。
方法二:通过调用String()函数,并将被转换对象作为参数传递进去。对于Number和Boolean调用该函数,实际上是调用toString()。该方法可以转换null和undefined,但不是调用toString(),而是对其直接转换。
2.将其他数据类型转换为Number类型
方法一:使用Number()函数,若是字符串调用,则如果字符串中有非数字字符,会转换成NaN(不可表达的数值),如果是空字符串则转为0,如果是数字则转为数值。若是布尔值调用,则true转为1,false转为0。若是null类型调用则转为0。undefined类型会转为NaN。
方法二:这种方法专门转换字符串,如果是非字符串调用则会先将其转换为字符串。parseInt()把一个字符串转换为一个整数(提取字符串前面的数值部分,若前面没数值则会转为NaN)。parseFloat()把一个 字符串转换 为一个浮点数(提取字符串前面的小数部分)。
3.将其他类型转换为Boolean类型
方法一:调用Boolean()函数,若是数值调用,则除了0和NaN外都会转换为true。若是字符串调用,则除了空字符串外都会转换为true。而null和undefined都会转换为false。
方法二:为任意的数据类型做两次非运算,即可将其转换为布尔类型。
算数运算符
通常当对非Number类型的值进行运算时,会将这些值转换为Number然后进行运算(常见的如Boolean类型的true为1,false为0),其中任何值和NaN做运算都得NaN。
1.加法运算
+:两个值进行加法运算,并将结果返回。如果是对字符串进行加法运算,则会做拼串操作将两个字符串拼接为一个字符串并返回结果,其中任何值和字符串做加法运算都会 先被转为字符串然后再和字符串做拼串操作并返回结果。
-:可以对两个值进行减法运算,并将结果返回。
*:可以对两个值进行乘法运算,并将结果返回。
/:对两个值进行除法运算,并返回结果。
%:取余运算符,对值进行取余操作,并返回结果。
自增和自减
1.自增++:通过自增可以使变量在自身的基础上增加1。自增分为两种,前置++和后置++。
前置++:变量值等于原变量自增后的新值。
后置++:变量值等于原变量自增前的值。
2.自减--:通过自减可以使变量在自身的基础上减1。自减也分为前置和后置。
前置--:变量值等于原变量自减后的新值。
后置--:变量值是原值(自减前的值)。
var n1 = 10, n2 = 20;
var n = n1++;
console.log('n=' + n);//10
console.log('n1=' + n1);//11
n = ++n1;
console.log('n=' + n);//12
console.log('n1=' + n1);//12
n = n2--;
console.log('n=' + n);//20
console.log('n1=' + n2);//19
n = --n2;
console.log('n=' + n);//18
console.log('n1=' + n2);//18
逻辑运算符
JS中为我们提供了三种逻辑运算符
1.! 非:对一个值进行非运算,就是对一个布尔值进行取反操作,对于非Boolean类型则转换为Boolean类型。
2.&& 与: 对符号两侧的值进行与运算并返回结果,如果两个值中只要有一个值为false就返回false,只有两个值都为true时返回true。其中若第一个值就为false则不会再检查第二个值。对于非布尔值,会先将其转换为布尔值,再运算并返回原值,如果两个字都为true,则返回后面的值。如果有false则返回第一个false。
3.|| 或:对符号两侧的值进行与运算并返回结果,如果两个值中只要有一个值为true就返回true,只有两个值都为false时返回false。其中若第一个值就为true则不会再检查第二个值。对于非布尔值,如果两个字都为false,则返回后面的值。如果有true则返回第一个true。
关系运算符
通过关系运算符可以比较两个值之间的大小关系,如果关系成立则返回true,如果关系不成立则返回false。关系运算符包括大于号(>)、大于等于号(>=)、不等于(!=)、 等于(==)、全等(===)、不全等(!===)、小于(<)、小于等于(<=)。对非数值进行比较时会对其先转换为数值再进行 关系比较,而任何值和NaN比较都是false。如果符号两边都是字符串时不会将其转换为数值,会比较Unicode编码,且是一位一位进行比较,如果两位一样则比较下一位。所以在进行比较时要主要符号两边的变量类型。
条件运算符
条件运算符也叫三元运算符。
语法:条件表达式?返回结果1:返回结果2;先对条件表达式进行判断,如果条件表达式值为true则执行语句1并返回执行结果,如果是false则执行语句2并返回执行结果。
var a = 90, b = 50, c = 80;
var max = a > b ? a > c ? a : c : b > c ? b : c;//求a、b、c中的最大值
console.log(max);