JavaScript是一种依托于网页为宿主的脚本语言,JavaScript是一门非常强大的语言,尤其对于web端,用途广泛,好用,偏向于操作网页,可以操作网页中的任何一个元素,JavaScript的缺点是是不能操作数据库,所以制作动态网页时需要结合其他语言来完成。
初学者可能会误以为JavaScript和Java语言之间有关系,虽然他们名字很像,他们确实是没有关系的。Java是sun公司的,该公司在2010年10月24日被oracle收购,oracle不仅是数据库的名字,oracle也就是大名鼎鼎的甲骨文公司。JavaScript是Netspace公司的,该公司1998年11月被AOL美国在线收购了。而JScript则是微软的,三者并没有太多关系。
JS可以嵌在网页的任何一个位置,也可以在外部。用<script>标签。
JS的注释语法分有单行注释和多行注释两种:
单行注释://后一行的内容会被注释
多行注释:/* 中间的内容会被注释 */
HTML:<!-- 中间的内容被注释 -->
css:/* 中间的内容被注释 */
JS的输出语法:
alert();输出其中的内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> </body> </html> <script> var i=10; alert("hello world"+" "+i); </script>
如图,<script>嵌在了网页的最下方:
用var定义了一个变量i,然后用alert输出可以看出,
1.“”中的内容会被直接输出
2.定义好的变量会输出变量的值而不是变量本身。
3.+号会把它们连起来输出
confirm();输出可选择的内容
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> </body> </html> <script> var i=confirm("确认吗"); alert(i); </script>
运行该代码后,会出现如下提示框:
如果点击确定:
如果点击取消:
由此可见,confirm不仅输出,还可以和用户简单的交流,如果用户点击确定,会返回true,如果用户点击取消,会返回false,confirm有且仅有这两个返回值。
prompt("");用户输入
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> </body> </html> <script> var i=prompt("请输入"); alert(i); </script>
运行后:
会出现一个输入的对话框,我们尝试输入一段文字:
点击确定后:
会返回用户输入的内容。
这里需要注意的是,用户输入的内容返回都是字符串形式。输入数字1,返回就是字符串‘1’。
数据类型:
计算机存储数据的时候并不是所有的数据都一样的,严格按照数据类型来存储。程序语言都绕不开数据类型,常见的数据类型有:
int 整数
float 单精度小数
double 双精度小数
decimal 小数
money 货币类型
char 字符
string 字符串
bool 布尔型,只有true和false
datetime 日期时间类型
强类型语言和弱类型语言:
说到类型,又分为强类型语言和弱类型语言,简单来说,强类型语言定义变量需要指定类型,比如C#,Java,假设你在c#代码中,你定义了一个整型变量后,就不能赋一个字符型数据给这个变量,除非你用强制类型转换,弱类型语言定义变量不需要指定类型,比如JavaScript,var 可以接受任何类型。
先记住慢慢理解:
强类语言使得对象处理的数据更容易被理解,而不需要与ADO.NET和XML编程模型打交道。这在大型系统里是很有用的,特别是当设计者定义了由自定义类所组成的数据访问层,并把设计向组织内的其他程序员发布的时候。当然,现在自定义类的使用有下降的趋势:它们需要编更多的代码,因为你必须创建.NET Framework所缺少的对象关系映射层。
强/弱类型是指类型检查的严格程度的。语言有无类型,弱类型和强类型三种。无类型的不检查,甚至不区分指令和数据。弱类型的检查很弱,仅能严格的区分指令和数据。强类型的则严格的在编译期进行检查。
类型转换:
虽然JavaScript是弱类型语言,但还是要用到类型转换。
parseInt()转换成整数
parseFloat()转换成小数
在前面已经可以看到,字符串与数字相加,得出的是在字符串的相加
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> </body> </html> <script> var i='999'; var l=1.5; alert(i+l); i=parseInt(i); alert(i+l); </script>
可见在JavaScript中字符串和数字类型相加,得出的结果是字符串的组合,点确定
这是转换成变量i成数字之后,数字和数字之间相加,得出的结果是数字的和。
JavaScript中的运算符表达式
数学运算符:
+
数字求和,或字符串的组合
-
求差
*
乘积
/
除号需要注意的是,如果除一个不能整除得数,在JavaScript中会得出准确的小数,但是在其他强类型语言中,不能够整除的整数得出的还是整数,因为强类型语言中整数除以整数得出的还是整数。多余的小数就去掉了。
%
取余数
补充:有些小数运算会出问题,如下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> </body> </html> <script> var i=1.1; var l=56; alert(i*l); </script>
得出的结果明显有问题,与浮点数有关,可以尝试在小数运算中扩大10000倍在除以10000来解决问题。
逻辑运算符:
&&
与,并,两者都要是真true
||
或,二者有一个是真true就可以
!
非,否
比运算符:
==
等于,===是恒等于,=是赋值
!=,<>
不等于
>
大于
<
小于
>=
大于等于
<=
小于等于
三元运算符:
a==b?"A等于B":"A不等于B";
举例:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> </body> </html> <script> var i=1; var l=10; var c=i>=l?"ok":"no"; alert(c); </script>
以上是判断变量i是否大于等于变量l,若果是,返回OK,如果不是,返回no,c是判断的返回值。
再来一个输入的判断:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> </head> <body> </body> </html> <script> var i=prompt("请输入第一个数字"); var l=prompt("请输入第二个数字"); var c=i>=l?"第一个数大于等于第二个数":"第一个数不大于第二个数"; alert(c); </script>
输入第一个数字12
输入第二个数字10
判断得出第一个数字大于第二个数字。