JS 함수 this_javascript 스킬 사용예 분석

이 글의 예시에서는 JS 함수의 사용법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 세부 내용은 다음과 같습니다.

js에서 함수를 작성할 때 많이 사용되는데요, 이게 정확히 무엇인가요? 실행 환경 범위를 가리키는 포인터이자 컨텍스트라고도 합니다.
먼저 함수에 대해 이야기해 보겠습니다. 제가 개인적으로 이해한 바는 함수는 언어에서 반복적으로 호출되는 코드 블록입니다.
JS에서는 객체의 속성에 함수를 할당하는 것을 메소드라고 합니다
예:

var m={};
m.title='title';
m.show=function(){
alert(this.title)
}
m.show()

객체 m의 메소드로 함수를 호출하는 것입니다
이 경우, 이는 객체 m을 가리킵니다.

함수 이름을 직접 호출하는 것을 함수라고 합니다.

var a=1212;
function show(){
alert(a)//1212
}
show()// 1212

글로벌 환경에서 글로벌 변수는 윈도우의 속성으로 이해될 수 있고, 글로벌 함수는 윈도우의 메소드로 이해될 수 있습니다
아래 예를 살펴보세요.

var m ={};
m.id='mmm';
m.show=function(){
  alert(this.id);
}
var a={};
a.id='aaa';
a.show=m.show;
a.show(); //aaa

a.show=m.show;  先理解这句话，因为函数是个对象，
m.show=function(){
  alert(this.id)
}

이 표현은
을 동시에 참조하는 a.show와 m.show와 동일합니다.

function(){
  alert(this.id)
}

은 실제로
과 동일합니다.

a.show=function(){
  alert(this.id)
}

따라서 a.show()를 호출하면 이는 a 객체를 가리킵니다.
다음 밤나무를 살펴보세요

var m ={};
m.id='mmm'
m.show=function(){
  alert(this.id)
}
var a={}
a.id='aaa'
a.show=function(){
  m.show()
};
a.show(); //mmm

따라서 a.show()를 호출하는 것은 m.show() 메서드를 호출하는 것과 동일하므로 이는 m 객체를 가리킵니다.

다음 예를 다시 보면 처음에는 아직 이해가 되지 않습니다.

var color='red';
var app = {};
app.color="green";
app.paint=function(node){
node.style.color=this.color;
  alert(this.color);
}
function findNode(callback){
  var btn =document.querySelector('.btn');
  callback(btn);//传进来，
}
findNode(app.paint);
alert(this.color); //red 而不是green

함수 매개변수가 전달될 때 매개변수는 참조가 아닌 값으로 전달됩니다

그래서 findNode(app.paint)가 전달되면 실제로는

function(node){
  node.style.color=this.color;
  alert(this.color);
}

참조이며 findNode가 전역적으로 정의되어 있으므로 이는 WINDOW 또는 UNDEFINED를 가리킵니다.

매개변수 전달에 대해서는 값으로 전달하세요

function show(a){
  alert(a)
}

매개변수가 기본 데이터형이면 이해하기 쉽습니다

var b=10;
show(b)//alert(10);

물체는

var c ={};
c.prop=true;
var showProp=function(obj){
obj.prop=false
}
showProp(c); //c.prop = false

어떤 사람들은 위의 예가 참조로 매개변수를 전달한다고 생각합니다

실제로 위의 매개변수는 여전히 값으로 전달됩니다. showProp(c)가 c를 함수에 전달하면 실제로 함수의 Obj.prop=false는 참조된 객체를 {prop: 거짓}

다음 예시를 보세요

var c ={};
c.prop=true;
var showProp=function(obj){
  obj = new Object();
  obj.prop=false
  return obj;
}
showProp(c);
alert(c.prop); //true

여기서 수신되는 obj가 수정되었습니다. 매개변수가 함수에 따라 참조로 전달되면 함수의 수정사항이 확실히 외부에 반영됩니다.

이 기사가 모든 사람의 JavaScript 프로그래밍 설계에 도움이 되기를 바랍니다.