js 函数调用

JavaScript010

js 函数调用,第1张

js是事件驱动的,一个节点可以发生很多种事件,包括click事件。在js中,当节点发生某一个事件时,可以为该事件绑定一个处理函数。也就是类似的 document.getElementById("myBtn").onclick = function(){} 所要注意的是,这个节点的onclick属性,需要赋给一个函数类型的值,才可以处理事件。 但是displayDate()并不是一个函数,你可以说你定义了displayDate函数,但displayDate()也就是加了一对括号的displayDate,是函数执行了,displayDate()是等价于displayDate的返回值的。在displayDate函数里,只是给id为demo的节点重新设置了内容,没有返回值,所以默认的就是undefined。 那么如果写成 document.getElementById("myBtn").onclick = displayDate()实际上是等价于 document.getElementById("myBtn").onclick = undefined显然undefined是不能作为节点事件的处理函数的。 但是,也不是一定要加上function(){},你可以写成这样: document.getElementById("myBtn").onclick = displayDate虽然displayDate()不是函数,但displayDate却是函数,是可以作为节点事件的处理函数的。

JS函数的定义与调用方法

JS函数调用的四种方法:方法调用模式,函数调用模式,构造器调用模式,apply,call调用模式

1.方法调用模式:

先定义一个对象,然后在对象的属性中定义方法,通过myobject.property来执行方法,this即指当前的myobject

对象。

var blogInfo={

blogId:123,

blogName:"werwr",

showBlog:function(){alert(this.blogId)}

}

blogInfo.showBlog()

2.函数调用模式

定义一个函数,设置一个变量名保存函数,这时this指向到window对象。

var myfunc = function(a,b){

return a+b

}

alert(myfunc(3,4))

3.构造器调用模式

定义一个函数对象,在对象中定义属性,在其原型对象中定义方法。在使用prototype的方法时,必须实例化该对象才能调用其方法。

var myfunc = function(a){

this.a = a

}

myfunc.prototype = {

show:function(){alert(this.a)}

}

var newfunc = new myfunc("123123123")

newfunc.show()

4.apply,call调用模式

var myobject={}

var sum = function(a,b){

return a+b

}

var sum2 = sum.call(myobject,10,30)//var sum2 = sum.apply(myobject,[10,30])

alert(sum2)

JS函数调用的四种方法

1:方法调用模式

/*方法调用模式*/

    var myobject={

            value:0,

            inc:function(){

                    alert(this.value)

                }

        }

    myobject.inc()

请注意this此时指向myobject

2:函数调用模式

/*函数调用模式*/

    

    var add=function(a,b){

        alert(this)//this被绑顶到window

            return a+b

        }

    var sum=add(3,4)

    alert(sum)

请注意this此时指向window

3:构造器调用模式

/*构造器调用模式  摒弃*/

    

    var quo=function(string){

            this.status=string

        }

    quo.prototype.get_status=function(){

            return this.status

        }

    var qq=new quo("aaa")

    alert(qq.get_status())

javascript语言精粹一书建议摒弃这种方式

4:apply调用模式

/*apply*/

    //注意使用了上面的sum函数

    //与myobject

    //这中调用方式的优点在于可以指向this指向的对象。

    //apply的第一个参数就是this指针要指向的对象

    var arr=[10,20]

    var sum=add.apply(myobject,arr)

    alert(sum)

看这个apply真正应用。bind这是一个绑定时间的函数

var bind=function(object,type,fn){

            if(object.attachEvent){//IE浏览器

                    object.attachEvent("on"+type,(function(){

                                                           return function(event){

                                                               window.event.cancelBubble=true//停止时间冒泡

                                                               object.attachEvent=[fn.apply(object)]

                                                               //在IE里用attachEvent添加一个时间绑定以后。

                                                               //this的指向不是到object对象本身所以。我们绑定的function里的this.id是无法正常工作的。

                                                               //但是如果我们用fn.apply(object)

                                                               //这里可以看出我们是把apply的第一个对象也就是this的指向变更给了object所以this.id就变成了

                                                               //object.id 可以正常工作了。

                                                               

                                                               }

                                                           })(object),false)

                }else if(object.addEventListener){//其他浏览器

                        object.addEventListener(type,function(event){

                                                              event.stopPropagation()//停止时间冒泡

                                                              fn.apply(this)

                                                              })

                    }

            

        }

    bind(document.getElementById("aaa"),"click",function(){alert(this.id)})