一、什么是JavaScript?
再讲JS的基础之前,先让我们了解一下什么是JS吧。
JS,全称JavaScript。是t一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,内置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。
二、使用JS的三种方式
1、在HTML标签中直接内嵌JS():并不提倡使用。
<button onclick="alert('小婊砸!你真点啊!')">有本事点我啊!!</button>
>>>不符合w3c内容与行为分离的要求!!!
2、在html页面中使用<script></script>包裹JS代码:
< script type="text/javascript"> //JS代码; </script>
>>>Script标签可以放到页面中的任何位置。
3、引入外部的JS文件,使用<script></script>标签:
<script language="JavaScript" src="js/01.js"></script>
[注意事项]
①<script></script>可以嵌入到页面的任意位置。但是,位置的不同会导致JS代码的执行顺序不同
比如<script></script>放到<body>前面,则JS代码会在页面加载之前就执行
②引入外部的JS代码,<script></script>必须是成堆的标签。而且,标签中不能再有任何的代码。
三、JS中的变量
1、JS中变量声明的写法;
var num = 10; //使用var声明的变量,属于局部变量,只在当前作用域内有效。
num = 10; //不用var声明的变量,默认为全局变量,在整个JS文件中都有效。
var = x=8,y,z=10; //使用一行语句同时声明多个变量。上式中,y属于已声明,但未赋值状态,结果为undefined;
[声明变量的注意事项]
①JS中所有变量的声明,均使用var关键字。变量具体是什么数据类型,取决于给变量赋值的类型;
②JS中同一个变量,可以在多次不同赋值时,修改变量的数据类型;
var a = 10; //从初始声明,是a属于整数型;
a = "哈哈哈"; //重复赋值时,整数型的a被修改为字符串类型;
③变量可以使用var声明,也可以不实用var声明。
[区别]使用var声明为局部变量,不实用var声明为全局变量;
④只用var声明,但是不赋值,结果为undefined;
例如: var a; // a为undefined。但是,如果不声明也不赋值的a,直接使用会报错。
⑤同一变量名可以多次使用var声明。但是,后面的var并没有任何卵用。第二次再使用var声明时,只会被理解为普通的赋值操作。
2、变量名的命名要求:
①变量名,只能有字母、数字、下划线组成;
②开头 不能是数字;
③变量名区分大小写,大写字母与小写字母为不同变量;
3、变量名的命名规范:
①要符合小驼峰法则:
首字母小写,之后每个单词的首字母大写;var myNameIsSong = 1; ✔
②或者使用匈牙利命名法:
所有字母小写,单次之间用_分隔;var my_name_is_song = 1; ✔
③var mynameissong = 1; ✖,能用,但是不规范。
4、JS中的数据类型
①Undefined:未定义。已经使用var声明的变量,但是没有赋值。如,var a;
②Null:表示空的引用。
③boolean:布尔类型。表示真假,只有两个值: true/false
④Number:数值类型。可以是整数,也可以是小数;
⑤String:字符串类型。用双引号或单引号包裹的内容,称为字符串;
⑥Object:对象类型。
5、常用的数值函数
①isNaN(): 判断一个变量或常量,是否是NaN(not a num 非数值);
使用isNaN()判断时,会尝试 使用Number()函数进行转换,如果最终结果能够转为数字,则不是NaN,结果为false。
②Number()函数: 将其他类型的数据,尝试转为数值型;
var num = 1;
alert(Number(num));
[字符串类型]
>>>字符串为纯数值字符串,会转为对应的数字;"111"->111
>>>字符串为空字符串,会转为0; ""->0
>>>字符串包含任何其他字符串时,都不能转; "1a"->NaN
[布尔类型]
true -> 1; false -> 0
[Null/Undefined]
Null -> 0; Undefined -> 1
[Object]
③ ParseInt(): 将字符串转为整数类型;
>>>純数值字符串,能转。 "12" -> 12; "12.9" -> 12;(小数转化时,直接抹掉小数点,不进行四舍五入)
>>>空字符串,不能转,"" -> NaN
>>>包含其他字符的字符传,会截取第一个非数值字符串前的数字部分;"123a456" -> 123; "a123b456" -> NaN
>>>PassInt()只能转字符串,转其他类型,全是NaN。
[Number函数与ParseInt函数的区别]
1、Number函数能转各种数据类型,ParseInt函数只能转字符串。
2、两者在转字符串时,结果不完全相同。(详见上面解释)
④ParseFloat:将字符串转为数值型;
转换规则与ParseInt相同,值是如果有小数,则保留小数点:如果没有小数,则依然是正数
"12.5" -> 12.5; "12" -> 12;
⑤typeof:检测变量的数据类型:
字符串 -> String 未定义 -> Undefined true/flase -> Boolean
数值 -> Number 对象/Null -> Object 函数 -> function
四、JS中常用的输入输出语句
1、document.write(); 将()中的内容打印输出到浏览器屏幕上;
使用时需注意:除变量/常量外的所有内容,必须放到""中。变量和常量必须放到""外面
如果同时有变量和字符串,必须用+链接;
var num1 = prompt("请输入第一个数");
var num2 = prompt("请输入第二个数");
var sum = parseFloat(num1) + parseFloat(num2)
alert("结果是"+sum);
2、alert():使用弹窗输出;
弹窗警告,()中的内容与上述要求相同。
3、promt(); 弹窗输入;
接受两部分参数:
①输入框上面的提示内容,可选;
②输入框里面的默认信息,可选;
当只写一部分时,表示输入框上面的提示内容;
可以定义变量,接收输入的内容。点击确定按钮,变量将被赋值为输入的内容,点击取消按钮,变量将被赋值为null。
输入内容时,默认接收的数据类型都是字符串!!!
五、运算符的使用
1、算术运算(单目运算符)
+ 加、 -减、 *乘、 /除、 %取余、 ++ 自增、 --自减
>>> +:有两种作用,链接字符串/加法运算。当+两边全为数字时,运行加法运算;
当+两边有任意一边为字符串时,起链接字符串的作用,链接之后的结果为字符串。
除+外,其余符号运算时,会先尝试将左右变量用Number函数转为数字。
>>> /:结果将会保留小数点。
>>> ++:自增运算符,将变量在原有基础上+1。
>>> --:自减运算符,将变量在原有基础上-1。
【a++和++a的异同】
①相同点:无论是a++还是++a,运算完以后,a的值均会+1;
②不同点:a++,先用a的值去运算,再把a+1;
++a,先把a+1,在用a+1以后的值去运算;
<script type="text/javascript"> var a= 3,b,c; b = a++ +2; //先用a运算,b=3+2 再把a+1,a+4 c = ++a +2; //先把a+1,a=5,在用a+1以后的值去运算,c5+2 alert(a) alert(b) alert(c) </script>
2、 赋值运算
= 赋值、 += -= *= /= %=
+=: a+=b;相当于 a=a+b;但是,前者的运算效率要比后者快,所以推荐使用+=的写法;
其余的运算符类似。
3、关系运算
== 等于、===全等(严格等于)、 != 不等、 !== 不全等、 >、<、>=、<=
>>>关系运算符,运算之后的结果,只能Boolean类型
>>>判断一个数字是否处于某个区间,必须用&&链接;
a<10 && a>0;✔ 10>a>0;✖
>>> ===:严格等于;要求不但要类型相同,值也必须相同;类型不同,结果直接为false;类型相同,在进行下一步判断;
==: 等于。类型相同,与===效果一样。类型不同时会先尝试用Number函数将两边转为数字,然后再进行判断。
但是有个别特例,如: Null==false;✖ Null==Undefined;✔
4、条件运算符(多目运算)
a>b?true:false
有两个重要符号:?和:
当?前面部分运算结果为true时,执行:前面的代码
当?前面部分运算结果为false时,执行:后面的代码
冒号两边可以为数值,则整个式子可用于赋值。var a = 1<2?1:2;
冒号两边可以为代码块,将直接执行代码。1<2?alert(1):alert(2);
多目运算符可以多层嵌套。var a = 1<2?alert(1):(1>0?4:5);
5、位运算符、 逻辑运算符
&&与、 ||或 、!非
&&: 两边都成立,结果为true
||: 两边有任意一边成立,结果为true
6、运算符的优先级:
() //小括号最高
! 、++ 、 -- //单目运算符
* 、 / 、 %
+ 、 -
> 、 < 、 >= 、 <=
== 、 !=
&& //与或同时存在时,&&比||高
||
= 、 += 、 -= 、 *= 、 /= //最低的是各种赋值