• javascript学习笔记


    Javascript和html结合
    直接嵌入htm中
    <script type="text/javascript">alert("hello world!");</script>
    封装进js文件中,再引入
    hello.js
    alert("hello!");
    <script type="text/javascript" src="hello.js"/>

    js变量(属于弱类型)
    js中定义变量用关键字var ,非严谨,不用var也可以直接定义变量
     
    算术运算符
    alert("a=" + a/1000*1000);//a=3710
    alert("12" + 1);//a=121
    alert("12" - 1);//a=11
    alert(true);//true
    alert(true + 1);//2
    alert(false + 1);//0
    alert(false -1);//-1
    alert(2%5==0);//false

    其他运算符
    var t=4;
    alert(!t);//false
    alert(3>0?alert("Yes"):alert("No"));//Yes->undefined
    var xx;
    alert(xx);//undefined
    alert(xx==undefined);//true
    alert(typeof("abc"));//string
    alert(typeof(9));//number
    alert(typeof(true));//boolean
    alert(typeof(abc)=='string');//true

    语句
    var x="abc";
    switch(x){
         case "pk":
             alert("pk");
             break;
         case "abc":
             alert("abc");
             break;
         default:
             alert("ok");
             break;

    }
    document.write("abc");//直接输出到页面
    九九乘法表格:
    <script type="text/javascript">
    document.write("<table>");
    for(var x=1;x<=9;x++){
       document.write("<tr>");
       for(var y=1;y<=x;y++){
           document.write("<td>");
           document.write( y + "*" + x + "=" + y*x);
        document.write("</td>");
       }
       document.write("</tr>");
    }
    document.write("</table>");
    </script>

    数组
    javascript中数组定义两种方式
    var arr=[];var arr=[3,5,6];
    使用Array对象来完成
    var arr = new Array();//var arr=[];
    var arr1 = new Array(5);//定义数组长度为5
    var arr2 = new Array(5,6,7);//定义一个数组,元素为5,6,7
    特点
    长度是可变的,类型是任意的。

    函数
    function show(x,y){
       alert(x+":"+y);
    }
    show();//undefined:undefined
    show(1,2);//1:2
    show(1);//1:undefined
    show(1,2,3,4);//函数中有一个数组对传入的参数进行存储,这个数组是arguments,所以arguments.length=4

    function getSum(){
      return 100;}
    var sum=getSum;//getSum本身是一个函数名,而函数本身在js中就是一个对象。getSum就是这个函数对象的引用,将getSum这个引用的地址赋值给sum。这时sum也就指向了这个函数对象。
    alert(sum);//打印时候如果sum指向的是函数对象,那么会将该函数对象的字符串表现形式打印出来,就是该函数的代码定义格式。

    动态函数
    使用的是js中内置的一个Function对象
    var add = new Function("x,y","var sum; sum=x+y;return sum;");
    var he = add(4,8);
    alert(he);//12

    匿名函数
    var xixi=function(){
      alert("hello");
    }
    等价于
    function haha(){
      alert("hello");
    }
    var xixi=haha;
    xixi();
    十、练习
      <script type="text/javascript">
       
       var arr = [66,13,37,21,89,17];
       //取最值。
       function getMax(arr){
        var max = 0;
        for(var x=1; x<arr.length; x++){
         if(arr[x]>arr[max])
          max = x;
        }
        return arr[max];
        
       }
       
       var maxValue = getMax(arr);
    //   alert("maxValue:"+maxValue);
       //排序。
       
       function sortArray(arr){
        for(var x=0; x<arr.length-1; x++){
         for(var y=x+1; y<arr.length; y++){
          if(arr[x]>arr[y]){
           swap(arr,x,y);
          }
         }
        }
       }
       //数组中的元素位置置换。
       function swap(arr,x,y){
        var temp = arr[x];
        arr[x] = arr[y];
        arr[y] = temp;
       }
       function println(val){
        document.write(val+"<br/>");
       }
    //   document.write("排序前:"+arr);
       println("排序前:"+arr)
    //   sortArray(arr);
       println("排序后:"+arr)
    //   document.write("排序后:"+arr);  
      </script>
      <script type="text/javascript">
       
       //查找。
       function searchElement(arr,key){
        
        for(var x=0;x<arr.length; x++){
         if(arr[x]==key)
          return x;
        }
        return -1;
       }
       
       //折半,必须有前提。必须是有序的数组。
       function binarySearch(arr,key){
        
        var max,min,mid;
        min = 0;
        max = arr.length-1;
        
        while(min<=max){
         mid = (max+min)>>1;
         
         if(key>arr[mid])
          min = mid + 1;
         else if(key<arr[mid])
          max = mid - 1;
         else
          return mid;
        }
        return -1;
        
       }
       
       //对数组的反转。
       function reverseArray(arr){
        for(var start=0,end=arr.length-1; start<end; start++,end--){
         swap(arr,start,end);
        }
       }
       reverseArray(arr);
       println("反转后:"+arr);   
      </script>
     </body>
    </html>

    全局变量和局部变量,
    在脚本片段中定义的变量,是全局变量。在函数中定义的变量是局部变量。
      <script type="text/javascript">
       var x = 3;//全局变量x.  
       function show(){//函数局部的变量x
        x = 8;
       }
       show();
       document.write("x="+x);//x=3;
      </script>
    常用对象
    String
       var str = "abcde";
       println("len="+str.length);
       println(str.bold());//加粗
       println(str.fontcolor("red"));//字体颜色。
       println(str.link("http://www.163.com"));//将字符串变成超链接。
       println(str.substr(1,3));//bcd
       println(str.substring(1,3));//bc
    String自定义方法
       //去除字符串两端的空格。
       function trim(str){    
        var start,end;
        start=0;
        end=str.length-1;
        while(start<=end && str.charAt(start)==' '){
         start++;
        }
        while(start<=end && str.charAt(end)==" "){
         end--;
        }
        return str.substring(start,end+1); 
       }
    原型
     
      (1)给string的原型中添加一个属性。
        String.prototype.myLen = 199;
        alert("abc".myLen );//199

      
      
      
      
      给string的原型中添加一个方法。

       * 字符串对象新功能,去除字符串两端的空格。
      String.prototype.trim = function(){  
       var start,end;
       start=0;
       end=this.length-1;
       while(start<=end && this.charAt(start)==' '){
        start++;
       }
       while(start<=end && this.charAt(end)==" "){
        end--;
       }
       return this.substring(start,end+1);
      }
      alert("-"+"     ab cd     ".trim()+"-");//-ab cd-
      
       * 字符串新功能,添加一个将字符串转成字符数组,返回一个数组
      String.prototype.toCharArray = function(){
       //定义一个数组。
       var chs = [];
       //将字符串中的每一位字符存储到字符数组中。
       for(var x=0; x<this.length; x++){
        chs[x] = this.charAt(x);
       }
       return chs; 
      }
      
       * 添加一个,将字符串进行反转的方法。
      String.prototype.reverse = function(){ 
       var arr = this.toCharArray();
       //将数组位置置换功能进行封装。并定义到了反转功能内部。
       for(var x=0,y=arr.length-1;  x<y ; x++,y--){
        swap(arr,x,y);
       }
       return arr.join("");//将字符数组转换为字符串
      }
      function swap(arr,a,b){
       var temp = arr[a];
       arr[a] = arr[b];
       arr[b] = temp;
      }
      
      
    数组Array对象常用方法
    function println(param){
     document.write(param+"<br/>");
    }
       var arr = ["nba","haha","cba","aaa","abc"];
       var arr2 = ["qq","xiaoqiang",70];
       println(arr);
       println(arr2);
       var newArr = arr.concat("mm",arr2);//将mm作为新数组中的元素,将arr2数组中的元素也作为新数组中的元素。
       println(newArr);//nba,haha,cba,aaa,abc,mm,qq,xiaoqiang,70
      println(arr.join("-"));//nba-haha-cba-aaa-abc//join()默认是join(",")
              println(arr.pop());//abc//删除并返回最后一个元素。
              println(arr.shift());//nba//删除并返回第一个元素。
      println(arr2.reverse());//70,xiaoqiang,qq//逆置
           println(arr2.sort());//70,qq,xiaoqiang//排序
             
      var arr3 = ["nba","haha","cba","aaa","abc"];
      var temp = arr3.splice(1,3,8080,9527,"xixixi","wangcai");//删除元素并可以进行元素的替换。
           println(temp);//haha,cba,aaa
      println(arr3);//nba,8080,9527,xixixi,wangcai,abc
      println(arr3.unshift("uuuu"));//7//插入首部返回新数组的长度
      println(arr3);//uuuu,nba,8080,9527,xixixi,wangcai,abc
      
    使用原型自定义数组Array对象的方法

    Array.prototype.getMax = function(){
     var temp = 0;
     for(var x=1; x<this.length; x++){
      if(this[x]>this[temp]){
       temp = x;
      }
     }
     return this[temp];
    }
     * 数组的字符串表现形式。
     * 定义toString方法。 相当于java中的复写。
    Array.prototype.toString = function(){
     return "["+this.join(", ")+"]";
    }

       var array = ["nba","haha","cba","aaa","abc"];
       var maxValue = array.getMax();
       println("maxValue:"+maxValue);//maxValue:nba
       println(array.toString());//[nba, haha, cba, aaa, abc]

    Date对象常用方法
    1、获得当前时间 2012-10-17 16:19:32 星期三
    function getCurrentTime(){
     var d=new Date();
     var month = add_zero(d.getMonth()+1);
     var days = add_zero(d.getDate());
     var hours = add_zero(d.getHours());
     var minutes = add_zero(d.getMinutes());
     var seconds = add_zero(d.getSeconds());
        var week = getWeek(d.getDay());
     var currentTime=d.getFullYear()+"-"+month+"-"+days+"  "
                      +hours+":"+minutes + ":"+seconds + "  "+week ;
     return currentTime;
    }

    function getWeek(num){
     var weeks = ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];
     return weeks[num];
    }

    function add_zero(temp)
    {
     if(temp<10){ return "0"+temp;}
     else{ return temp;}
    }

    document.write(getCurrentTime());

    2、日期对象和毫秒值之间的转换。
    var date2 = new Date();//获取毫秒值。日期对象-->毫秒值。
    var time = date2.getTime();
    println(time);//1350462546374
    //将毫秒值转成日期对象。方法:new Date(time);
    var date3 = new Date(1230462546374);
    document.write(date3);//Sun Dec 28 19:09:06 UTC+0800 2008

    3、将日期对象和字符串之间进行转换。
    //日期对象转成字符串。toLocaleString 日期和时间  toLocaleDateString 日期
    //将字符串转成日期对象。具备指定格式的日期字符串-->毫秒值--->日期对象。
       var str_date = "9/28/2017";
       var time2 = Date.parse(str_date);
       var date3 = new Date(time2);
       println(date3.toLocaleDateString());//2017年9月28日

    4、with()用法
           * 为了简化对象调用内容的书写。
        * 可以使用js中的特有语句with来完成。
        * 格式:
        * with(对象)
        * {
        *   在该区域中可以直接使用指定的对象的内容。不需要写“对象.”
        * }
       with(date){
        var year = getFullYear();
        var month = getMonth()+1;
        var day = getDate();
        var week = getWeek(getDay());
       }

    Math对象
        * 演示Math对象。该对象的中的方法都是静态的。不需要new,直接Math调用即可。
        */
       var num1 = Math.ceil(-12.34);//返回大于等于指定参数的最小整数。//-12坐标轴往上
       var num2 = Math.floor(-12.34);//返回小于等于指定数据的最大整数//-13坐标轴往下
       var num3 = Math.round(-12.54);//四舍五入//-13
       
       var num4 = Math.pow(10,2);//100

  • 相关阅读:
    flash 语法 入门
    flash 代码 雪花飘落
    test windows live writer
    网站索引
    [转]jquery入门简介
    forcast iframe 及 四款播放器
    flash
    flash 备忘
    浏览器默认HTML的CSS样式属性
    简单多线程拷贝单文件示例
  • 原文地址:https://www.cnblogs.com/hanxue53/p/4203159.html
Copyright © 2020-2023  润新知