1.Java中switch语句只能用于选择byte、int等整数类型,char类型和jdk7新增的String类型。而js支持所有类型 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JS语言演示---流程控制语句讲解</title>

<style>
table {
border: 1px solid red;
border-collapse: collapse;
}

td {
border: 1px solid red;
width: 30px;
}
</style>
<script type="text/javascript">
function a1() {
var x = -3;
if (x - 1) {//"非0"即是true
alert("yes...."); //除"x+3"外都会执行,如当x,x-1,...
} else {
alert("no....");//只有当x+3时才会执行
}

x = 4;
if (x > 1) {
alert("a");
} else if (x > 2) {
alert("b");
} else if (x > 3) {
alert("c");
} else {
alert("d");
}
//这一段代码只会执行alert("a")
//if-else if-else语句中,只会进入一个条件块执行
}

function a2() {
/*Java中switch语句只能用于选择byte、int等整数
类型,char类型和jdk7新增的String类型。而js支持所有类型 */
var x = document.getElementById("t1").value;//读取编辑框中的内容
switch (x) {
case "aa":
alert("aa");
break;
case "bb":
alert("bb");
break;
case "cc":
alert("cc");
break;
default:
alert("dd");
}
}

function a3() {
var i = 1, s = 0;
while (i <= 100) {
s += i;
i++;
}
//document.write("s="+s+"<br/>");
alert("s=" + s);

i = 1;
s = 0;
do {
s += i;
i++;
} while (i <= 100);
alert("s2=" + s);
}

function a4() {
a: for ( var x = 0; x < 3; x++) {
for ( var y = 0; y < 4; y++) {
document.write("y=" + y);
if (y % 2 == 0) {
//break; //continue;
break a;
}
}
document.write("<br/>");
}
}

function a5() {
for ( var x = 1; x <= 9; x++) {
for ( var y = 1; y <= x; y++) {
document.write(x + "*" + y + "=" + x * y);
if (y == x) {
document.write("<br/>");
} else {
document.write(" ");
}
}
}
}
</script>
</head>
<body>
<input type="button" value="if-else演示" onclick="a1();">
<br />
<br /> 选项:
<input id="t1" type="text">
<input type="button" value="switch-case演示" onclick="a2();">
<br />
<br />

<input type="button" value="while,do-while演示" onclick="a3();">
<br />
<br />

<input type="button" value="for演示" onclick="a4();">
<br />
<br />

<input type="button" value="99乘法表演示1" onclick="a5();">
  

<h3>99乘法表演示2</h3>
<script type="text/javascript">
//用for循环实现在页面写一个99乘法表,且用表格封装
document.write("<table>");
for ( var x = 1; x <= 9; x++) {
document.write("<tr>");
for ( var y = 1; y <= x; y++) {
document.write("<td>" + x + "*" + y + "=" + x * y + "</td>");
}
document.write("</tr>");
}
document.write("</table>");
</script>

</body>
</html>

 

2JS中的数组非常重要,因为JS中只有一个容器---数组,它是Java中的数组与集合的综合

3JS中的数组长度可变,元素类型任意

4.数组定义方式1: 定义时直接赋初值

5.数组定义方式2: 用new对象的方式创建

6在创建时给参数:1个参数时是长度,2个及以上参数为元素初始值。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JS语言演示---数组用法讲解</title>

<script type="text/javascript">
//JS中的数组非常重要,因为JS中只有一个容器---数组,它是Java中的数组与集合的综合
//JS中的数组长度可变,元素类型任意

///数组定义方式1: 定义时直接赋初值
function a1(){
var arr = [1,3,5]; //※与Java不一样的地方1: 类型中没有"[]",数据是用"[]"封装 ,Java方式是: int[] arr={1,3,5}
//alert( typeof(arr) ); //object
alert(arr); //1,3,5 js中可以直接用数组名来输出它的内容
var x = arr[0]+arr[2]; //x=6 对数组元素的引用和Java是一样的
alert("x="+x);
}
function a2(){
var arr=[1,3,5];
arr[0]=8;

//※Js的数组有集合的功能,长度可以自动增长
arr[5]=7;//Java中是数组下载越界的,Js中不会
alert(arr); //1,3,5, , ,7
alert(arr[3]);//undefined

//※Js的数组有集合的功能,元素类型可以任意
arr[4] = "abc";
alert(arr);
arr[4]=23.5;
alert(arr);
}
function a3(){
//可以先声明一个空数组,然后往里面不断赋值,因为JS中的数组长度是可变的
var arr = [];
arr[0]=1;
arr[5]=3; arr[2]="abc"; arr[4]=true;
arr[10]=7; arr[6]=3.14;
//可以用arr.length读取数组当前的长度
alert(arr.length); //11

for(var i=0;i<arr.length;i++){
document.write(arr[i]+" ");
}
}

///数组定义方式2: 用new对象的方式创建
function a4(){
var arr = new Array(); //等价于: var arr=[];
arr[0]=3.4;
arr[1]="aa";
arr[2]=false;
alert(arr.length);
alert(arr);
}
function a5(){
/*
在创建时给参数:
1个参数时是长度,2个及以上参数为元素初始值
*/
var arr = new Array(3); //内容: undefined,undefined,undefined
alert(arr.length); //3

var arr2 = new Array(3,4); //内容: 3,4
alert(arr2.length); //2

var arr3 = new Array(3,4,7); //内容: 3,4,7
alert(arr3.length); //3
}

function a6(){
//二维数组
var arr =[];
arr[0]=[1,3,5];
arr[1]=[2,1,4,6,8,99];
arr[2]="abc";
arr[3]=10;
for(var i=0;i<arr.length;i++){
for(var j=0; j<arr[i].length;j++){
document.write(arr[i][j]+" ");
}
document.write("<br/>");
}
document.write("arr[3]:"+arr[3]);
}
</script>
</head>
<body>
<input type="button" value="演示1" onclick="a1();"> <br/><br/>
<input type="button" value="演示2" onclick="a2();"> <br/><br/>
<input type="button" value="演示3" onclick="a3();"> <br/><br/>

<input type="button" value="演示4" onclick="a4();"> <br/><br/>
<input type="button" value="演示5" onclick="a5();"> <br/><br/>

<input type="button" value="演示5" onclick="a6();"> <br/><br/>
</body>
</html>

 

7.与Java不一样的地方:  类型中没有"[]",数据是用"[]"封装   ,Java方式是: int[] arr={1,3,5}
   js中可以直接用数组名来输出它的内容
    对数组元素的引用和Java是一样的

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JS语言演示---数组用法讲解</title>

<script type="text/javascript">
//JS中的数组非常重要,因为JS中只有一个容器---数组,它是Java中的数组与集合的综合
//JS中的数组长度可变,元素类型任意

///数组定义方式1: 定义时直接赋初值
function a1(){
var arr = [1,3,5]; //※与Java不一样的地方1: 类型中没有"[]",数据是用"[]"封装 ,Java方式是: int[] arr={1,3,5}
//alert( typeof(arr) ); //object
alert(arr); //1,3,5 js中可以直接用数组名来输出它的内容
var x = arr[0]+arr[2]; //x=6 对数组元素的引用和Java是一样的
alert("x="+x);
}
function a2(){
var arr=[1,3,5];
arr[0]=8;

//※Js的数组有集合的功能,长度可以自动增长
arr[5]=7;//Java中是数组下载越界的,Js中不会
alert(arr); //1,3,5, , ,7
alert(arr[3]);//undefined

//※Js的数组有集合的功能,元素类型可以任意
arr[4] = "abc";
alert(arr);
arr[4]=23.5;
alert(arr);
}
function a3(){
//可以先声明一个空数组,然后往里面不断赋值,因为JS中的数组长度是可变的
var arr = [];
arr[0]=1;
arr[5]=3; arr[2]="abc"; arr[4]=true;
arr[10]=7; arr[6]=3.14;
//可以用arr.length读取数组当前的长度
alert(arr.length); //11

for(var i=0;i<arr.length;i++){
document.write(arr[i]+" ");
}
}

///数组定义方式2: 用new对象的方式创建
function a4(){
var arr = new Array(); //等价于: var arr=[];
arr[0]=3.4;
arr[1]="aa";
arr[2]=false;
alert(arr.length);
alert(arr);
}
function a5(){
/*
在创建时给参数:
1个参数时是长度,2个及以上参数为元素初始值
*/
var arr = new Array(3); //内容: undefined,undefined,undefined
alert(arr.length); //3

var arr2 = new Array(3,4); //内容: 3,4
alert(arr2.length); //2

var arr3 = new Array(3,4,7); //内容: 3,4,7
alert(arr3.length); //3
}

function a6(){
//二维数组
var arr =[];
arr[0]=[1,3,5];
arr[1]=[2,1,4,6,8,99];
arr[2]="abc";
arr[3]=10;
for(var i=0;i<arr.length;i++){
for(var j=0; j<arr[i].length;j++){
document.write(arr[i][j]+" ");
}
document.write("<br/>");
}
document.write("arr[3]:"+arr[3]);
}
</script>
</head>
<body>
<input type="button" value="演示1" onclick="a1();"> <br/><br/>
<input type="button" value="演示2" onclick="a2();"> <br/><br/>
<input type="button" value="演示3" onclick="a3();"> <br/><br/>

<input type="button" value="演示4" onclick="a4();"> <br/><br/>
<input type="button" value="演示5" onclick="a5();"> <br/><br/>

<input type="button" value="演示5" onclick="a6();"> <br/><br/>
</body>
</html>

 

8.可以用new的方式创建函数 ---动态函数,功能类似于Java中的类反射 

9.JS的函数内部可以再定义函数,而Java不允许这样

10.以后事件注册时写成下面形式
                    btnObj.οnclick=function(){
                          函数体.....
                    };

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JS语言演示---函数讲解3</title>
<script type="text/javascript">
/* 可以用new的方式创建函数 ---动态函数,功能类似于Java中的类反射 */
function a1() {
var add = new Function("x,y", "var sum;sum=x+y;return sum;");
var s = add(10, 20);
alert("s=" + s);
}

function a2() {
var p1 = document.getElementById("param").value;
var p2 = document.getElementById("fun1").value;
var f = new Function(p1, p2);
alert(f(10, 20));
}

//JS的函数内部可以再定义函数,而Java不允许这样
//匿名函数
function a3() {

var abc = function(a, b) {
return a * b;
};
/*上面的代码等价于:
function ff(a,b){
return a*b;
}
var abc = ff;
*/

alert(abc(2, 5)); //通过别名调用匿名函数
}

function a4() {
/*以后事件注册时写成下面形式
btnObj.onclick=function(){
函数体.....
};
*/
var btnObj = document.getElementById("btn1");
btnObj.onclick = function() {
alert("aaaa....");
};
alert("功能添加完毕!");
}
</script>
</head>
<body>
<input type="button" value="演示1" onclick="a1();">
<br />
<br /> 参数列表:
<input type="text" id="param" />
<br /> 函数体:
<input type="text" id="fun1" />
<br />
<input type="button" value="演示2" onclick="a2();">
<br />
<br />

<input type="button" value="匿名函数" onclick="a3();">
<br />
<br />
<input type="button" value="没功能" id="btn1">   
<input type="button" value="以后注册事件响应时常用匿名函数--给btn1注入功能" onclick="a4();">
<br />
<br />
</body>
</html>

10. js函数的一些小细节---与Java不一样的地方:

  1) 函数调用与参数

  2)  js中的函数不存在重载。定义了函数,只要通过该函数名就可以调用它, 调用不调用跟参数没有关系。参数匹配时,对应参数有数据传递时就接收,没用就是undefined,多余的就不接收。
               
 3) js中的函数只以函数名来识别调用,跟参数没关系,参数只是用于传递数据。
               
 4) 每个函数内部都有一个arguments[]用于接收并存储所有实参, 不管函数定义时的参数列表有没有定义或接收。

11. js函数的一些小细节---与Java不一样的地方:

函数有别名:
          函数名只是函数对象的一个引用(变量),同一个函数对象可以有多个引用指向它(非声明时的名称就是别名),  通过别名可以和原函数名一样访问该函数对象。
             

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JS语言演示---函数讲解2</title>
<script type="text/javascript">
/* js函数的一些小细节---与Java不一样的地方:
1. 函数调用与参数
js中的函数不存在重载。定义了函数,只要通过该函数名就可以调用它,
调用不调用跟参数没有关系。参数匹配时,对应参数有数据传递时就接收,
没用就是undefined,多余的就不接收。

js中的函数只以函数名来识别调用,跟参数没关系,参数只是用于传递数据。

每个函数内部都有一个arguments[]用于接收并存储所有实参,
不管函数定义时的参数列表有没有定义或接收。
*/
function show(x,y){
alert(x+","+y);
}
function a1(){
show(1,8); //1,8
show(1); //1, undefined
show(1,2,3); //1,2
show("aa",0.6,3); //aa,0.6
}


function show2(x,y){
alert(x+","+y);
for(var i=0; i<arguments.length;i++){
document.write(arguments[i]+" ");
}
}
function a2(){
show2("aa", 0.6, 3, true);
}
</script>
<script type="text/javascript">
/* js函数的一些小细节---与Java不一样的地方:
2. 函数有别名
函数名只是函数对象的一个引用(变量),
同一个函数对象可以有多个引用指向它(非声明时的名称就是别名),
通过别名可以和原函数名一样访问该函数对象。
*/

function getNum(){
return 100;
}

function b1(){
var v = getNum();
alert( v );
}

function b2(){
//alert(getNum); //getNum.toString()
var aa=getNum;
//alert( aa ); //aa.toString()
alert( aa() ); //aa()和getNum()效果一样
}
</script>
</head>
<body>
<input type="button" value="演示1-1" onclick="a1();"> <br/><br/>
<input type="button" value="演示1-2" onclick="a2();"> <br/><br/>

<input type="button" value="演示2-1" onclick="b1();"> <br/><br/>
<input type="button" value="演示2-2" onclick="b2();"> <br/><br/>
</body>
</html>