1. 程式人生 > >函數調用模式,this指向

函數調用模式,this指向

nbsp 函數的調用 test for 傳遞 back [1] 函數 fun

## 函數的四種調用模式 1.函數模式
this--->window
 function test(){
            console.log(this);
        }
        test();

2.方法模式
this---->調用方法的對象
var obj1 = {
            test:function(){
                console.log(this);
            }
        }
        obj1.test();

3.構造函數模式
this----->new出來的對象
function
Person(){ console.log(this); } var obj =new Person();

工廠模式
function Person(name,age){
            var o = {
                name:name,
                age:age,
                sayHello:function(){

                }
            }
            return o;
        }

        
var p = Person("張三", 18); console.log(p); //object //簡單工廠模式的構造函數 創建出來的對象 跟該構造函數無關 //簡單工廠模式的構造函數,實際的調用模式是 函數模式

寄生模式

function Person(name,age){
            var o = {
                name:name,
                age:age,
                sayHello:function(){

                }
            }
            
return o; } var p = new Person();

4.上下文模式(context執行環境的意思)
this----->指定的是誰就是誰 此模式下可以修改this的值,也就是說可以修改函數的調用方式。
修改方式: call 函數.call(對象,arg1,arg2,arg3,...argn)
apply 函數.apply(對象,數組)
都可以用來改變this的指向為參數的第一個值
call是使用單獨的每一個參數來傳參
apply是使用數組進行傳參的,這個數組在調用的時候,會被意義拆解,當做函數的每一個采參數 call在函數的形參個數確定的情況下使用
apply在函數的形參個數不確定的情況下使用 技術分享圖片

上下文:

//案例:求一個數組中的最大值
        var arr = [9, 1, 4, 10, 7, 22, 8];
        //apply方法和call方法第一個參數傳遞null的時候,都表示為函數調用模式
        //也就是將this指向window
        var max = Math.max.apply(null, arr);
        console.log(max);

//案例:將傳入的參數打印,參數之間用-相互連接
        function foo() {
//            return arguments.join("-");

            //偽數組不具有join方法,所以這個時候就要考慮去借用一下數組的join方法
//            var str = Array.prototype.join.apply(arguments,["-"]);
            var str = [].join.apply(arguments,["-"]);
            return str;
        }
        var str = foo(1, 3, "abc", "ffff", 99) // 1-3-abc-ffff-99
        console.log(str);


        //        var arr = [1,2,3,4];
//        console.log(arr.join("-"));

        window.onload = function () {
            //案例:給頁面上所有的 div 和 p 標簽添加背景色
            var divs = document.getElementsByTagName("div");//divs是偽數組
            var ps = document.getElementsByTagName("p");

            var arr = [];
            //little tip:  push方法可以傳多個參數
            //arr.push(1,2,3,4,4,5)

            arr.push.apply(arr,divs);
            arr.push.apply(arr,ps);

            //如果使用arr.push()直接把divs傳進來
            //那麽相當於在arr中的第一個元素中存儲了一個divs數組
            //但是我們需要把divs中的每一個元素單獨的存入arr中
            //所以需要調用push方法的如下形式  push(1,2,4,4,5)
            //要實現這個形式的調用,就用到了apply方法的第二個參數的特性
            //在調用的時候,會第二個參數的數組,拆成每一個元素以(a,b,c,d,e,f,g) 傳入函數

            //相當於 arr.push(divs[0],divs[1],divs[..])
//            arr.push(divs)
              for (var k = 0; k < arr.length; k++) {
                var ele = arr[k];
                ele.style.backgroundColor = "yellow";
            }

函數調用模式,this指向