JavaScript_语法,语句,函数,对象

1.JavaScript与Java对比:

JavaScript出自Netspace公司
Java出自sun公司

JS是基于对象的,Java是面向对象的

JS是弱类型(非严谨)语言,Java强类型(严谨)语言

只要浏览器中含有解析JS的引擎,便可执行,与平台无关

2.JS变量,语句,循环:

<!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>JS_1</title>
<link rel="stylesheet" type="text/css" href="CSS/table.css">

<script type="text/javascript">

 /*
 //JS变量
 var str="'abc'"
 var i=3250/1000*1000
 var j
 alert(str)//弹出'abc',alert不是JS语句,而是dom编程中内容
 alert(i) //3250(而不是3000)
 alert(j) //undefined(变量定义但未初始化,弹出提示)
*/

//JS语句
/*
var x=3
if(3=x)//JS的0/null表示false,非0/非null为true
        //一般对于判断写成3==x避免错误
  alert("yes")
else
  alert("no")

alert(true+1)//2

var y=true,z=false
y=y&z //y&&z
alert(y)//y&z(1&0)结果0,y&&z结果false
 */


//for循环
var sum="";
for(var x=0;x<5;++x)
 if(x!=4)
   sum=sum+"x="+x+",";
 else
   sum=sum+"x="+x;
document.write(sum+"<br/>");//x=0,x=1,x=2,x=3,x=4 
 //九九乘法表
 document.write("<table>");
 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("<br/>");
 }
 document.write("</table>");


 //数组 
 var arr=[4,5,6];
 for(var i=0;i<arr.length;++i)
   document.write("arr["+i+"]="+arr[i]+"<br/>");
  
 var arr2=[1.2,"abc",3]//类似于Java中的集合,不存在越界
 document.write(arr2[5]);//如果元素为被初始化,undefined
 
 var arr3=new Array();//未指定初始值
 arr3[1]="efg";
 document.write("<br/>"+arr3[1]);
 </script>
</head>

<body>

</body>
</html>

table用到的简单的样式:table.css

@charset "utf-8";
  table{  
      border-collapse:collapse;
      border-width:60px;
  }
  tr td{
  border:#00F 2px solid;
  padding:10px;
  }

JS1

3.JS函数:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> JS函数 </title>
  <script type="text/javascript">
    //函数
    
    //无参函数
    show();
    function show(){
      alert("无参函数"+arguments.length);//传入的实参会被封装到数组arguments中
    }
    show(3,4,5);//show()依然会被调用,也就说JS不存在重载,纯粹按名调用
    
    //有参函数
    show2("abc",12)
    function show2(x,y){ 
     document.write(x+" "+y+"<br/>");//abc 12
    }
    
    
    //全局变量与局部变量
     var x=10;//全局变量
     function show3(x){
       x=4;//局部变量x被改变
     }
     show3(x);
     document.write("x="+x+"<br/>");//x=10
     
    
    //函数返回值
    function show4(){
      return "123";
    }
    document.write(show4());//123

    //在JS中函数本身就是一个对象,而函数名就是对象的名字
    function show5(){//show5指向该函数对象
      return "函数对象";
    }
    var x=show5;//将show5指向的对象的地址赋值给x,那么x也指向该对象
alert(x);//将弹出整个函数
       
    //动态函数,参数和函数体都可以作为变量传递
    var dynamic=new Function("x","y","return x+y;");
    document.write("<br/>"+dynamic(3,4));//7

    //匿名函数
    var anonymity=function(){
     document.write("<br/>匿名函数被调用");
    }
    anonymity();
  </script>
 </head>

 <body>
  
 </body>
</html>

4.JS中自定义对象:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title>JS中自定义对象</title>
  <script type="text/javascript" src="animal.js"></script>
  <script type="text/javascript">
   //第一种初始化方式
   function Person(){
     document.write("进行初始化动作<br/>");
   }
   var p=new Person();//会调用上面函数
   p.name="zhangsan";//成员初始化
   p.age=10;
   
   p.getName=function(){//相当于定义成员函数
      return p.name;
   }
   document.write(p.getName()+"<br/>");//zhangsan
  
  //第二种初始化方式
  /*
  function Animal(name,sex){//特别类似Java构造函数
    this.name=name;
    this.sex=sex;
  }
  var animal=new Animal("lion","male");
  document.write(animal["name"]+" "+animal.sex);//两种方式都能取到成员属性值
  */
  
  //把对象封装到JS文件中
    document.write(animal.getName());
  </script>
 </head>
  
 <body>
  
 </body>
</html>

animal.js:

/*JavaScript*/
  function Animal(name,sex){
    this.name=name;
    this.sex=sex;
  }
  var animal=new Animal("lion","male");
  animal.getName=function(){
      return animal.name;
   }

5.JS的with语句与in语句

ArrayTool.js

/*JavaScript*/
function ArrayTool(){

}
var ArrayTool=new ArrayTool();
ArrayTool.getMax=function(arr){//getMax相当于ArrayTool对象的成员方法
   var max=arr[0];
   for(var i=1;i<arr.length;++i)
       if(arr[i]>max)
         max=arr[i];
    return max;
}
ArrayTool.getMin=function(arr){//同上
   var min=arr[0];
   for(var i=1;i<arr.length;++i)
       if(arr[i]<min)
         min=arr[i];
    return min;

}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> 简单封装与特有语句 </title>

 <script type="text/javascript" src="ArrayTool.js"></script>
 <script type="text/javascript">
   //使用ArrayTool.js中的方法
   var arr=[3,5,1,4,7];
   document.write("max="+ArrayTool.getMax(arr)
                  +",min="+ArrayTool.getMin(arr)+"<br/>");



    //with语句
    function Student(name,sex){
      this.name=name;
      this.sex=sex;
    }
    var stu=new Student("lisi","M");
    with(stu){//当属性和方法特别多时,也可以采用这种方式调用
              //with确定对象作用范围
       document.write(name+"...."+sex+"<br/>");
    }

    
    //JS类似Java增强for循环语句
    for(s in stu){
      //document.write(s+"<br/>");//s依次取出stu对象中的属性
       document.write(s+"="+stu[s]+"<br/>")//stu[s]取出对象stu中属性相应的值
    }
    for(index in arr){
      document.write(arr[index]+"&nbsp;");
    }
 </script>
 </head>

 <body>
  
 </body>
</html>

JS4

6.JS内部固有对象:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> 内部已定义好的对象 </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
 </head>
 <script type="text/javascript">
    //1.String对象
    var str="abcdef"
    document.write(str.charAt(2)+" "
                   +str.link("http://www.baidu.com")+" "
                   +str.substr(2,9)+" "+str.substring(2,4)+"<br/>");
                   //c abcdef(超链接) cdef cd
    //2.Math对象
    for(var i=0;i<6;++i){
       document.write(parseInt(Math.random()*10+1)+"&nbsp;");  
       //需要得到整数,可以使用Global对象中的pareInt方法
    }
    
    //3.R进制<-->十进制
     var toHex=18;
     document.write("<br/>"+parseInt("12",16)+" "+toHex.toString(16))//18 12
    
    //4.获取日期
    var date=new Date();
    var week=["日","一","二","三","四","五","六"];
    with(date){
     var month=getMonth()+1;//month也是从0开始
     month=month>9?month:("0"+month);//01,02...12
    
     document.write("<br/>"+getFullYear()+"年"+month+"月"+getDate()+"日 星期"+week[getDay()]);
    }
    
    
    //5.prototype(原型),也可以封装到.js文件使用,自定义对象没有prototype
    
    /*
    function getMax(arr){
        var max=arr[0];
        for(var i=1;i<arr.length;++i)
       if(arr[i]>max)
         max=arr[i];
       return max;
    }
    */
    Array.prototype.getZD=getMax;//Array.prototype 返回对象类型原型的引用。
                                 //Array.prototype.getZD=getMax;相当于向数组对象中
                                 //添加一个成员方法getZD
   
    var arr=[4,1,7,9];
    //document.write("<br/>"+"max="+arr.getZD(arr));//max=9
   //改进getMax方法
     function getMax(){
        var max=this[0];
        for(var i=1;i<this.length;++i)
       if(this[i]>max)
         max=this[i];
       return max;
    }
     document.write("<br/>"+"max="+arr.getZD());
    //向String中添加一个字符串变色方法
    function myColor(color){

      return "<font color='"+color+"'>"+this+"</font>";
  
    }    
    String.prototype.stringColor=myColor;
    document.write("<br/>abc".stringColor("red"));
    
    
    
    
    //6.回顾一下,去除String两端空格
    var str="       a b  ";
    var start=0,end=str.length-1;
    for( ;(start<=end)&&
        (str[start]==' '||str[end]==' '); ){
        if(str[start]==' ')
             ++start;
        if(str[end]==' ')
            --end;
    }
    document.write("<br/>"+"--"+str.substring(start,end+1)+"--");//--a b--
    
 </script> 
 <body>
  
 </body>
</html>

JS5

【推广】 免费学中医，健康全家人
原文地址：https://www.cnblogs.com/yiqiu2324/p/3266193.html