zoukankan      html  css  js  c++  java
  • JavaScript 练习,变量,数组,函数,对象, with for 语句

    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=gb2312" />
    <title>无标题文档</title>
    
    <style type="text/css">
    table{70%; border-collapse:collapse;}
    table th{ border:#0000FF 1px solid}
    </style>
    
    </head>
    
    <body>
    
    <script type="text/javascript">
    
    var x = 3;   //变量
        x = x-1;
    alert(x);
    if(2==x)      //if swith while for 控制语句
    	alert("Yes");
    else
    	alert("No");
    	
    var y = "abc";	
    switch(y)
    {
    	case "abc": 
    		alert("abc");
    		break;
    	case "def":
    		alert("def");
    		break;
    	default: 
    		alert("default");		
    }
    
    x = 1;
    while(x<3)
    {
    	alert("x=" + x);
    	x++;
    }
    
    var sum="";
    for( var x=1; x<3; x++ )
    {
    	if(x==2)
    		sum = sum + "x=" + x;
    	else
    		sum = sum + "x=" + x + ",";
    }
    alert(sum);
    document.write("<font color='red' size='10'>"+sum+"<font/>");
    
    document.write("<table>");
    for(var x=1; x<=9; x++)
    {
    	document.write("<tr>");
    	for(var y=1; y<=x; y++)
    	{
    		document.write("<th>" + y + "*" + x + "=" + y*x + "</th>");		
    	}
    	document.write("</tr>");
    }
    document.write("</table>");
    
    var arr = new Array();   //数组
    arr = ["abc", 1, true, 8.9];
    arr[6] ="I'am 6";
    for(var x=0; x<arr.length; x++)
    {
    	alert(arr[x]);
    }
    
    var str="";
    function printArray(arr)  //函数
    {
    	for(var x=0; x<arr.length; x++)
    	{
    		if(x==arr.length-1)
    			str += arr[x];
    		else
    			str += arr[x] + " , ";
    	}
    	alert(str);s	
    }
    printArray(arr);
    
    </script>
    
    </body>
    </html>


    函数使用  一般函数 动态函数 匿名函数

    <script type="text/javascript">
    		
    function show()
    {
    	for(var i=0; i<arguments.length; i++)
    		alert(arguments[i]);	
    	return  arguments.length;	
    }
    show(1,2,3,4);
    show("length: " + show(1,2,3));
    
    //动态函数
    var show2 = new Function("x", "y", "sum=x+y; return sum");
    var sum = show2(2,3);
    alert(sum);
    
    //匿名函数
    var show3 = function()
    {
    	alert("匿名函数");
    }
    show3();
    
    //事件驱动 + 匿名函数
    window.onload = function()
    {
    	alert("事件驱动 + 匿名函数");
    }
    
    //事件驱动 + 一般函数
    function method()
    {
    	alert("事件驱动 + 一般函数");
    }
    window.onload = method;
    
    </script>

     构造对象

    <script type="text/javascript">
    
    // 构造对象Person
    function Person(name, age)
    {
    	this.name = name;
    	this.age = age;
    }
    var p = new Person("kevin", 23);
    alert(p.name + "-----" + p.age);
    
    //构造对象,添加属性 和 方法
    function Person2()
    {
    }
    var p2 = new Person2();
    p2.name = "xiang";
    p2.age = 24;
    p2.fun = function()
    {
    	alert(this.name + "++++" + this.age);
    }
    p2.fun();
    
    </script>


    封装: 可以先将所需功能写到一个*.js文件中,然后在HTML中调用*.js文件,即可调用其中的方法和变量。例如:

    jsDemo1.js

    // JavaScript Document
    function ArrayTool(){};
    var arrayTool = new ArrayTool();
    
    function sortArray(arr)
    {
    	var temp=0;
    	for(var i=0; i<arr.length; i++)
    	{
    		for(var j=arr.length-1; j>i; j--)
    		{
    			if(arr[j]<arr[j-1])
    			{
    				temp = arr[j];
    				arr[j] = arr[j-1];
    				arr[j-1] = temp;
    			}
    		}		
    	}
    	return arr;
    }
    
    function showArray(arr)
    {
    	var str = "";
    	for(var i=0; i<arr.length; i++)
    	{
    		if(i==arr.length-1)
    			str += arr[i];
    		else
    			str += arr[i] + " , ";
    	}
    	alert(str);
    }
    
    arrayTool.getSortArray = sortArray;
    arrayTool.showArray = showArray;

    HTML调用文件

    <script type="text/javascript" src="jsDemo1.js"> </script>
    <script type="text/javascript">
    
    var arr = [6,5,4,3,2,1];
    arrayTool.showArray(arr);
    arrayTool.getSortArray(arr);
    arrayTool.showArray(arr);
    
    </script>

    with用于确定对象的作用范围

    with(对象){可直接调用对象的属性和方法,不用加对象名}

    for…in语句用于遍历对象或数组

    for(变量)s  in (学生对象)stu){alert(s)}此处打印出stu的属性,要获得属性值用stu[s]

    for(x in array) alert(x)打印的是数组角标

    <script type="text/javascript">
    
    function Person(name, age)
    {
    	this.name = name;
    	this.age = age;
    }
    var p = new Person("kevin", 23);
    with(p)                //with语句
    {
    	alert(name + "----" + age);
    }
    
    //for in 语句遍历对象 和 数组  //for 语句
    for(s in p)    
    {
    	alert(s + "=" + p[s]);
    }
    var arr = [1, 2, 3, 4];
    for(a in arr)
    {
    	alert(arr[a]);
    }
    
    </script>

  • 相关阅读:
    WebApi实现自定义错误日志
    WebApi实现IHttpControllerSelector问题
    动态属性ExpandoObject
    SQL远程连接
    HTML空格占位
    SQL生僻字模糊查询
    python中的字符串
    idea闪退
    lineNumber: 1; columnNumber: 1; 前言中不允许有内容。
    linux下后台启动weblogic
  • 原文地址:https://www.cnblogs.com/xj626852095/p/3648157.html
Copyright © 2011-2022 走看看