Js入门学习总结

来源:互联网 发布:mkdir linux 编辑:程序博客网 时间:2024/06/05 00:42

1.JavaScript(js)对象的创建方法与使用

  //对象创建

        varperson ={};

        //在对象外面给对象添加属性

        person.name= 'jack';

        person.age= '23';

        person.weight= '76';

 

        varstate ={

            //在对象里面给对象添加属性

            title:'标题',

            subTitle:'副标题',

            //属性的对象可是个数组,数组里还可有对象

            buttons:[

                {text:'专科',style:'positive'},

                {text:'本科',style:'balance'}

            ],

            //属性的对象可是个函数

            onClickedButton:function (index) {

                console.log (index);

            },

            //属性的对象可是个对象

            cancelText:{text:'取消'},

            onClickedCancel:function (index) {

                console.log (index);

            }

        }

 

        //操作对象

        var$ionicPopover = {

            show:function (obj) {

                document.write ('你看,要显示对象的标题是:' +obj.buttons[1].text+ '<br>');

                document.write ('再看,取消按钮的名字是:' +obj.cancelText.text+ '<br>');

            }

        }

 

        //调用

        $ionicPopover.show (state)


1.JavaScript(js中的this到底指向什么?

JS中, this的值取决于调用的模式, 而JS中共有4中调用模式

(1)方法调用模式

当一个函数被保存为对象的一个属性时, 我们称它为一个方法, 当一个方法被调用时, this指向该对象,:

var obj= {

value:1,

getValue:function() {

alert(this.value);

}

};

obj.getValue();// 输出1, 此时的this指向obj  

注意: 该模式中, this到对象的绑定发生在方法被调用的时候.

 

(2)函数调用模式

当一个函数并非一个对象的属性时, 它被当作一个函数来调用, 此时的this指向全局对象(window), 如:

window.value = 1;

    functiongetValue() {

    alert(this.value);

    }

    getValue(); // 输出1, 此时的this指向window. 

 

(3)构造器调用模式

结合new前缀调用的函数被称为构造器函数, 此时的this指向该构造器函数的实例对象, 如:

       functionshow(val) {  

     this.value= val;  

    };  

    show.prototype.getVal= function() {  

    alert(this.value);  

    };  

    varfunc = newshow(1);  

    func.getVal();// 输出1  

    alert(func.value)// 输出1  

   // 从上面的结果, 可以看出, 此时的this指向了func对象.

 

(4)apply/call调用模式

     apply和call方法可以让我们设定调用者中的this指向谁, 如:

    varfun = function(str) {  

        this.status = str;  

    }  

    fun.prototype.getStatus= function() {  

     alert(this.status);  

    }  

    varobj ={  

     status:"loading"  

    };  

fun.prototype.getStatus.apply(obj);

// 输出"loading", 此时getStatus方法中的this指向了obj   

3.JavaScript(js)构造器的应用(求数组中平均数及大于平均数的人数)

//构造器

        functionCreatePerson (name,age,score) {

            this .name= name;

            this .age= age;

            this .score= score;

        }

        //创建对象4个

        varstu1 = newCreatePerson ('ZhangSan',23,87);

        varstu2 = newCreatePerson ('LiSi',23,8);

        varstu3 = newCreatePerson ('WangEr',25,90);

        varstu4 = newCreatePerson ('MaZi',23,60);

        //stu1,stu10是同一个,对象是引用类型,变量是赋值类型,所以打印的score是97

        varstu10 =stu1;

        stu10.score = 97;

        document.write ("score:" +stu1.score + "<br>");

 

        //求数组中大于平均分的学生的人数

        varstus =[stu1, stu2, stu3, stu4];

        varsum =0;

        varavg =0, count=0;

        for(vari instus) {

           sum += stus[i].score;

        }

        avg =sum /stus.length;

        for(vari instus) {

            if(stus[i].score > avg) {

                count++;

            }

        }

        document.write ('avg:' +avg  +"<br>");

        document.write ('count:' +count);

2 0