JavaScript-02

Web前端 来源:qq_21434959 6230℃ 0评论

JavaScript 中对象的使用

1. 对象的功能

        Function 对象=>    特殊=>   相当于java中的方法

2.对象的创建
function fun1(a, b) {
            alert("大西瓜");
        }
        var fun2 = new function(a, b) {
            alert("冬瓜");
        }
        var fun3 = new Function("alert('南瓜');");
3.对象的属性

    alert(fun2.length);//length属性代表函数的参数个数

4.对象的方法

    alert(fun2.toString()); //打印函数的定义

JavaScript中函数的进阶

函数的进阶

  1. js中的函数在调用时,只看函数名称.不看参数.
function fun1(a ,b){
            alert(a+b);
        }
        //fun1();           ---NAN
        //fun1(1,2);         ----3
        fun1(1,2,3,4);      ----- 3
  1. arguments => 函数运行时,参数的封装
function fun1(){

            alert(arguments.length);//打印实际传递的参数个数
            var count = 0;
            for(var i =0; i<arguments.length ; i++){

                count += arguments[i];
            }
            alert(count);
        }
        //调用
        fun1(1,2);//3
        fun1(1,2,3,4);//10
        fun1();//0
  1. 函数的返回值

与java一样,使用return 关键字,return 也可以结束方法的调用

    f
unction fun2() {
            alert("haha");
            return;
            alert("heihei");
        }
        alert(fun2()); //undefined 因为其没有返回值

void运算符: 用于拦截方法的返回值.

<srcipt type="text/javascript">
            function fun1(a, b) {
                alert(a + b);
                return a + b;
            }
        </srcipt >
        <body>
          <a href="javaScript:void(fun1(1,2))" >点我</a><br>

            加void ,3只在alert中显示
            不加,3还会在弹出的新窗口中显示
        </body>

4.instanceof 运算符

    与java中的用法一样,用于判断是否为该数据类型
var str = "Hello,world";  
        var str1 = new String (str);
        alert(str instanceof String);   //false
        alert(str1 instanceof String);  //true

5.三个对象的封装

对比 包装类对象的类型

        java 中  8个
        javaScript 3个
            |-------Number String Boolean   
        ----------------------------------------------------------
        java中       有自动拆装箱的机制方便基本数据类型的转换,已经包装方法的调用
        javaScript  有伪对象的概念,原始数据可以直接调用,对应包装类型的属性或函数.

相关信息

 String 
            1.创建   
                var str = new String("hello world");
            2.属性
                alert(str.length);
                alert("hello world".length);
            3.方法
                一:没有用的 => 帮助生成 HTML标签的方法
                    alert("str.anchor("haha")); 二:有用的=> 与java一样 str.charAt(); str.indexOf(""); str.lastindexOf(""); str.endWith(""); str.startWith(""); str.wubString(0,2); str.toLowerCase /toUpperCase 大小写
            三:有用的=> 与正则结合使用的
                str.split
                str.replace
                str.match
                str.search

Number Boolean使用方法与String 大体一致

实例如下:

 var str = new String("hello world");
         //简单演练 -----获取 h o 字段的位置
         var start = str.indexOf("h", 0);
         var end = str.indexOf("o", 0);
         alert(str.substring(start, end+1));
         //alert(str.anchor("haha"));

6.Global对象

  • 转义

    半转义: encodeURI / decodeURI 可以将中文转化成Url编码  
                例如 : 汤姆=>%E6%B1%A4%E5%A7%86
    全转义: encodeURIComponent / decodeURIComponent  转换的范围更大,包括一些url中的字符. & : /
                例如 : http://www.baidu.com?wd=&汤?姆"的转化
    

    实例:

var str1 = "汤姆!!!!!&&&";
        var str2 = " http://www.baidu.com?wd=&汤?姆";
        var encodeStr = encodeURI(str1);
        /* alert(encodeStr); alert(decodeURI(encodeStr)); */

        var encodeStr2 = encodeURIComponent(str2);
        alert(encodeStr2);
        alert(decodeURIComponent(encodeStr2));
  • 基本数据类型的转换
// parseInt 转换成整数 => 从左到右依次转换.转换到遇到不能转换的字符为止
        // parseFloat 转换成浮点数

        var str = "123";
        var num1 = parseInt(str); //123
        var num2 = +str; //123
        var num3 = new Number(str); //123

        var st = "123.123";
        var num4 = parseInt(st); //123
        var str3 = "a123";     //NaN

        var str4= "3.14";

        alert(parseFloat(str4));//3.14
        alert(parseInt(str4));//3
  • 判断一个值是否为NaN(isNaN)
var num = NaN;
         if(isNaN(num)){
            alert("是NaN");
        }else{
            alert("不是NaN");
        } 
  • 解析运行方法(eval())

    alert(eval("1+1"));     //2
    alert(eval("new String('abc')"));   // abc
    

7.Math对象

//math 数学工具类 
    //属性
    //PI 圆周率
    //方法
    // random 随机数
    var num = Math.random();
    //alert(num);
    // round 四舍五入
    var num2 = Math.round(3.54);
    //alert(num2);
    //pow 计算幂
    var num3 = Math.pow(2, 3);
    //alert(num3);8
    // min/max 返回最小/最大数
    var num4 = Math.min(1, 2, 3);
    alert(num4);
    var num5 = Math.max(1, 2, 3);
    alert(num5);

8.Array对象

  • 对象的功能

    表达数组,类似于java中的数组. 可以存取值
    
  • 对象的创建

    var arr1 = [1,2,3,4];
    var arr2 = new Array(1,2,3,4);
    var arr3 = new Array(4);// 如果调用数组构造,只传递一个参数,并且参数的值是数字.那么该值将作为数组初始化长度
    
  • 对象的属性

    length  长度
    alert(arr1.length);//4
    alert(arr2.length);//4
    alert(arr3.length);//4
    
  • 对象的方法

    pop 弹栈  将0索引 的变量移除并返回
    push 压栈 将一个值放入数组的0索引位置
    reverse 将数组反转 => 会对数组本身顺序进行调整
        //alert(arr1.reverse());
    sort 排序 => 默认会按照字符串比较的方式排序.而不是数字.
    
    var arr5 = [100,1,5,9,2,3,8,7];
    
    alert(arr5.sort(abc));
    
    sort 可以传入一个比较器 => 比较器决定排序规则
    
function abc(a,b){
            return a-b;
        }
  • 进阶

    js中的array没什么原则
                        1. 数组中元素的类型可以任意
                        2. 数组的长度是可以随时变化的.
    
var arr6 = ["haha",3.14,true,null,undefined,new Object()];

        alert(arr6.length);

        arr6[10] = "itcast";
        alert(arr6[10]);    //itcast
        alert(arr6.length);  //11

        alert(arr6[9]);     //undefined

9.Data对象

//日期类对象的 使用 
    var date1 = new Date();
    alert(date1.toLocaleDateString());

    //w由毫秒值计算当前的时间
    var date2 = new Date(12983798123121);

    //2.getFullYear() 获取年份
    alert(date2.getFullYear());

    //3.getMonth() 获取月份注意 1月份结果为0
    alert(date2.getMonth());

    //4.getHours() 小时
    alert(date2.getHours());

    //5.getDate() 日期
    alert(date2.getDate());

    //6.getMinutes() 分钟
    alert(date2.getMinutes());

    //7.getSeconds() 获取秒
    alert(date2.getSeconds());

    //8.getTime() 获取毫秒值.
    alert(date2.getTime());

    //9.toLocaleString() 获取本地的时间格式字符串.
    alert(date2.toLocaleString());

10.RegExp对象

  • 基本介绍:

        正则对象    =>   使用正则匹配字符串
        表单校验时会用到正则
    
        参数1: 正则表单式
            参数2:匹配模式 
                        g:全局
                        i:忽略大小写
    
  • 创建

        var reg1 = new RegExp("e","g");
        var reg2 = /o/g;        //z要匹配的东东       g格式
        //alert(reg2.test("hello"));
    
  • String 与正则结合的 4 个方法

var str = "hello world";

        //split 切割 将匹配到的替换成 逗号
        alert(str.split(/or/g));     

        //replace 替换
        alert(str.replace(/l/g, "z"));  //将l替换成z

        match 匹配并获取          ==== 到不到  null       改动
        //alert(str.match(/hello/g));

        // search 查询索引
        alert(str.search(/w/g));        //返回查询的 东东 所在的位置索引(开头)