哈哈哈,开始学JavaScript了。。。
先讲讲历史吧。
JavaScript 的历史故事
JavaScript是Netscape公司开发的,当时Netscape公司和开发Java的Sun公司有合作,开发JavaScript的时候,Sun公司也有参与,所以JavaScript和Java有些地方类似,但是和Java是两种不同的编程语言。前身LiveScript,可能改成JavaScript只是为了搭Java的便车吧。
JavaScript的概述
JavaScript是基于对象和事件驱动的脚本语言,主要应用在客户端。
那么JavaScript是干什么用的呢? 下面是一位网友的回答
JavaScript 使网页增加互动性。JavaScript 使有规律地重复的HTML文段简化,减少下载时间。JavaScript 能及时响应用户的操作,对提交表单做即时的检查,无需浪费时间交由 CGI 验证。JavaScript 的特点是无穷无尽的,只要你有创意
1.交互性(它可以做的就是信息的动态交互)
体现在JavaScript可以完成以下任务
1、嵌入动态文本于HTML页面
2、对浏览器事件作出响应
3、读写HTML元素
4、在数据被提交到服务器之前验证数据
5、检测访客的浏览器信息
6、控制cookies,包括创建和修改等
可以将原来静态的HTML变成动态的。2.安全性(不允许直接访问本地硬盘)
当你不可以访问本地硬盘的时候,就没办法在别人的硬盘上干坏事,所以很安全。(微软的JScript可以访问Word文档但是只能读不能写)3.跨平台性(只要是可以解释Js的浏览器都可以执行,和平台无关)
JavaScript与Java不同
JS是Netscape公司的产品,前身是LiveScript;Java是Sun公司的产品,现在是Oracle公司的产品。 简单来说就是两钟不同语言
2.JavaScript是基于对象,Java是面向对象。
我第一次的理解以为基于对象和面向对象是一样的,后来听了老师的解释是我理解错了。面向对象呢,就好像西方人说的上帝创造万物一样,程序员就是上帝,你可以创造地球,人,车,树等等。基于对象就是你不能创造对象,但是你可以用,他是现成的对象。一个是创造地球,一个是你站在地球上,你可以享受他的资源。3.JavaScript只需解释就可以执行,Java需要先编译成字节码文件,再执行。
Java是编译成.class文件再执行的,而JavaScript不需要编译成.class文件。直接解释就可以执行了JavaScript是弱类型,Java是强类型。
Java定义变量时候需要指定一个类型 比如 int a ,而JavaScript不需要只有一个var a 就好了。
JavaScript与Html的结合方式
其实就和CSS和Html结合方式类似
方式一:直接在Script标签写
<script type="text/javascript">
var a = 10;
alert(a);
</script>
方式二:到入JS文件
<script type="text/javascript" src="js/1.js"></script>
1.js文件代码如下
var x=100;
x +=100;
x++;
alert("x="+x);
结果
误区: 不能两种方式混合导入 错误代码如下
反模式:混合方式不能这样写,否则脚本片段是不会执行的
<script type="text/javascript" src="js/1.js">
alert("aaa");
</script>
但是 可以先用方式一导入,再用另一种方式导入。
<script type="text/javascript" src="js/2.js"></script>
<script type="text/javascript">
y++;
alert("y="+y);
</script>
这种方式后面的Y也会应用2.JS文件里的y.
2.js 代码
var y=100;
y=y<<2; // 右移两位乘以2的两次方
最后结果
简单来说 就是一个Script标签 只能用一种方式将JavaScript和HTML结合。
无论采用什么方式,多个script标签中js代码的变量是共用的。同一个页面中的多个script标签中的脚本是属于同一个源程序,相互间变量和函数等是共享的!
JavaScript的数据类型
因为我是先学的JavaSE所以我将JavaScript进行对比学习
JavaScript的数据类型,如图下
与Java的数据类型相比,多了一个未定义类型undefined类型。JavaScript把Java中的整数类型和浮点类型全部合成一种数值型number.
JavaScript的string 类型这是把Java的String 和char合成string
把所有的引用类型的所有类,数组等都合成object类型。(全是对象)
接下来我用个typeof方法探讨一下JavaScript的数据类型
布尔型boorean
JavaScript的 boorean和 Java的boorean 类似,也有区别。
- JavaScript中 有0和!0的概率,即 当结果是0 就代表false 其他就代表true
- JavaScript中的 true和false可以用来进行数学计算,分别表示1和0
if(5){
document.write( "5是非0表示true可以进来</br>");
}else{
document.write( "打脸了吧</br>");
}
if('object'){
document.write( "objcet是非0表示true可以进来</br>");
}else{
document.write( "打脸了吧</br>");
}
结果两个都进来了
数值型number
Java中的整形和浮点型
var int = 1; var float = 1.1; var double = 4.58;
document.write( "1的数据类型"+typeof(int)+"</br>" );
document.write( "1.1的数据类型"+typeof(float)+"</br>");
document.write( "4.58的数据类型"+typeof(double)+"</br>");
`
关于判断类型
// JavaScript中单引号('')和双引号("")是一样的作用
document.write( "正确的类型判断"+(typeof(123)=='number')+"</br>");
document.write( "错误的类型判断"+(tyoeif(123)==number)+"</br>");
因为浏览器有兼容性,当程序错了是不会提示的只会隐去。
所以类型判断的时候要加引号
对比一下JavaScript和Java数据类型
语言 | JavaScript | Java |
---|---|---|
数值型 | number | 整形+浮点型 |
字符型 | string | String+char |
引用类型 | object | 类+接口+数组 |
空类型 | null | null |
未定义类型 | undefined | 无 |
数据类型总结
总的来说就是这反映了JavaScript和Java的特性弱类型和强类型。JavaScript把Java的许多类型合一了,同时多了个未定义类型(undefined)
JavaScript的变量
JavaScript 的变量声明全部用var
JavaScript 中,对于变量存放的数据类型是没有限定的,不像强类型语言,限定了所存放数据的类型.
var x=3;
并且声明了x =3后 ,后面可以 用 其他类型对x进行赋值
var x = 3;
document.write("x的初始赋值"+x+"</br>");
x= 'abc';
document.write("x的第二次赋值"+x+"</br>");
分别把两次x的值显示到网页
x原来是number类型,现在重新赋另一种数据类型如string型数据,可以的,而且这就是弱类型语言的一个经典体现!
JavaScript的运算符和表达式
我们看看Java中有哪些算术运算符
算术运算符: +(正)、-(负)、+(加)、-(减)、*、/(除)、%(取余) 、++、–
“+” 我们都知道”+” 号有时候会表示数学里的加有时候又表示字符串的连接号,那么怎么区分呢?
// + 加 或者字符串的连接符
document.write( "'+'学习演示:12+1="+(12+1)+"</br>");
document.write( "'+'学习演示:'12'+1="+('12'+1)+"</br>");
document.write( "'+'学习演示:'12'-1="+('12'-1)+"</br>");
显示结果
通过显示结果我们可以看到,当+后两边都是数字的时候+号表示数学的加法,而当他旁边有字符串的时候则表示连接符号,不同的是-号连接字符串形式的数字也能这个字符串看成数字进行加法运算。即数学加(+)的优先级没有比字符串连接(+)的高
有关+-的一些细节
在JavaScript中 true 和 false 可以在数学运算中当做1和0来计算
document.write( "true+1="+(true+1)+"</br>");
document.write( "false+1="+(false+1)+"</br>");
结果
其他的运算符都和Java相同
关于% ,a%b 最后结果与b的正负无关,只保存和a的正负相同
即 10%3=1;10%-3=1;-10%3=-1;-10%-3=-1;
switch-case:
switch-case: 用法和Java类似。只是:Java只能用于 byte、int等整数类型,char和jdk1.7新增的String类型。
而js支持所有数据类型,即所有类型的数据都能用于选择
var x="bb";
switch(x){ //x可为任意类型的表达式
case "aa":
document.write( "a");break;
case "bb":
document.write( "b");break;
default:
document.write( "c");
}
接下来做个练习把写个简单的九九乘法表
CSS样式代码如下
<style type="text/css">
td{
border: 1px solid aqua;
font-size: 16pt;
}
</style>
JavaScript代码如下
<script type="text/javascript">
document.write("<table>");
document.write("<th>九九乘法表</th>");
for(var i=1;i<=9;i++){
document.write("<tr>");
for(var j=1;j<=i;j++){
document.write("<td>"+i+"*"+j+"="+i*j+"</td>");
}
document.write("</tr>");
}
document.write("<table>");
</script>
最后的样子是这样的