>  기사  >  웹 프론트엔드  >  JavaScript의 함수에서 이것이 가리키는 값을 변경하는 방법은 무엇입니까?

JavaScript의 함수에서 이것이 가리키는 값을 변경하는 방법은 무엇입니까?

伊谢尔伦
伊谢尔伦원래의
2017-07-20 13:34:061519검색

fun.apply(context,[argsArray])

fun을 즉시 호출하고, 동시에 fun 함수의 원본 this를 전달된 새 컨텍스트 객체에 지정하여 동일한 메소드가 다른 환경에서도 재사용될 수 있도록 합니다. 사물.

context: fun 함수의 원래 this를 대체하는 전달된 객체입니다.

argsArray: 배열 매개변수가 확장되어 별도의 실제 매개변수로 fun 함수에 전달되는 배열 또는 배열 유사 객체입니다. 매개변수의 순서에 주의를 기울여야 합니다.

fun.call(context,[arg1],[arg2],[…])

매개변수 목록이 다르다는 점을 제외하면 적용과 동일합니다. 호출의 매개변수는 하나씩 전달되어야 합니다. 매개변수 개수를 모르는 경우 적용을 사용하세요.

용도:

Math.max() //개별 매개변수만 수신하며, 다음 방법을 통해 배열에 대해 max 메소드를 사용할 수 있습니다.
Math.max.apply(null, array) //배열 배열 매개변수 별도의 매개변수로 확장한 다음
Array.prototype.push.apply(arr1, arr2)에 전달합니다. //배열을 분할하고 적용하지 않고 다른 배열로 푸시합니다. 후속 배열 매개변수는 하나의 요소로 푸시됩니다.
Array.prototype.slice.call(arguments); //분류자 객체에 슬라이스 메소드를 사용합니다


function isArray(obj){
  return Object.prototype.toString.call(obj) === '[object Array]' ;
}  //验证是否是数组

fun.bind(context,[arg1],[arg2],[…])

Fun 메소드로 실행되는 컨텍스트는 절대 변하지 않도록 하세요.

arg1: 새 함수에 전달될 매개변수 목록

후속 호출에 대한 함수를 반환합니다. 해당 함수 본문은 원래 함수 fun과 동일하지만 새 함수의 this는 새로 전달된 컨텍스트 개체를 가리킵니다. . 새 함수에는 바인드 메소드에 의해 지정된 초기 매개변수 arg1/arg2...가 있습니다. 이후에 새 함수를 호출할 때 실제 매개변수는 기존 매개변수 뒤에 정렬됩니다.


//原来的函数有4个参数
var displayArgs = function (val1, val2, val3, val4) {
  console.log(val1 + " " + val2 + " " + val3 + " " + val4);
}
var emptyObject = {};
// 生成新函数时bind方法指定了2个参数,则新函数会带着这个两个实参
var displayArgs2 = displayArgs.bind(emptyObject, 12, "a");
// 调用时传入另2个参数,要在bind方法传入的2个实参后面
displayArgs2("b", "c");
// Output: 12 a b c

이벤트 처리 기능에 바인드 사용:


var obj = {
  arg1 : 1,
  attach: function(){
    //var self = this; 普通传入this 的方法
    $('xxx').on('click',function (event) {
      console.log(this.arg1);//若不绑定this,回调函数中的this常指目标元素
     }.bind(this));  //使用bind方法绑定this
  }
}

bind() 메서드를 사용하여 슬라이스() 메서드 다시 작성:


var _Slice = Array.prototype.slice;
var slice = Function.prototype.call.bind(_Slice);
slice(…);

bind()는 Ie5~ie8 처리와 호환됩니다


if (!Function.prototype.bind) {
  Function.prototype.bind = function(context) {
    var self = this, // 调用bind方法的目标函数
    args = arguments;
    return function() {
      self.apply(context, Array.prototype.slice.call(args, 1));//参数个数不确定时用apply
    }
  }
}

일반적으로 setTimeout()의 this는 창이나 전역 객체를 가리킵니다. 클래스 메서드를 사용하고 클래스 인스턴스를 가리키는 데 이것이 필요한 경우 self를 전달하는 대신 바인딩()을 사용하여 이를 호출 개체에 바인딩할 수 있습니다.

this

이 개체는 함수가 실행될 때 함수의 실행 환경에 따라 바인딩됩니다. 전역 함수에서는 this와 같고 개체의 메서드로 함수를 호출할 때는 this입니다. 해당 객체와 동일합니다.

판단 방법: 함수가 실행 중일 때 . 연산자가 있으면 이전 개체를 참조합니다. 그렇지 않으면 창을 참조합니다. new 키워드가 호출되면 새 개체를 참조합니다. Apply/call/bind가 있을 경우 첫 번째 파라미터를 참조합니다.


/*例1*/
function foo() {
  console.log( this.a );
} 
var obj2 = {
  a: 42,
  foo: foo
};
var obj1 = {
  a: 2,
  obj2: obj2
};
obj1.obj2.foo(); // 42;当foo函数被调用时,其本身是归obj2所拥有
/*例2*/
function foo() {
  console.log( this.a );
} 
var obj = {
  a: 2,
  foo: foo
};
var bar = obj.foo;   // bar引用foo函数本身
var a = "global";   // 全局对象的属性
bar();        // "global" ;

HTML DOM 이벤트 핸들러에서 이는 항상 핸들러가 바인딩된 DOM 노드를 가리킵니다.

위 내용은 JavaScript의 함수에서 이것이 가리키는 값을 변경하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.