이 기사는 JavaScript 연산자 우선 순위에 대한 자세한 분석을 제공합니다(예제 포함). 도움이 필요한 친구들이 참고할 수 있기를 바랍니다.
저는 2년 동안 문법의 함정에 빠지지 않을 줄 알았는데, 사실 최근 제품 개발팀에 한 잘생긴 남자가 뺨을 맞았습니다. 문제에 대해 논의해 보겠습니다. 모든 사람이 더 쉽게 읽을 수 있도록 이 문제의 모델을 추상화했습니다.
var provider = { test: { $get: function(){ return function anonymous(config){ }; } } }; var type = "test"; var config = {}; new provider[type].$get()(config);
함수에 이>가 있는 이유는 무엇입니까? 위 명령문이 실행될 때 <code>anonymous
? code>는 new
대신 window
에 의해 생성된 새 객체를 가리킵니다. 이 질문을 들었을 때 제가 가장 먼저 생각한 것은: Nani! new
연산자에 해당하는 생성자의 this
가 새로 생성된 객체를 가리키지 않는다는 것이 어떻게 가능합니까? ? 예는 어떻습니까? 당시에는 사업에 대한 문제를 주의깊게 추상화하지 않았기 때문에 사실 조금 혼란스러웠습니다. 그런데 곰곰이 생각해보면 이 문장은 정확히 무엇을 표현한 것일까요? anonymous
中的this
指向的是window
而不是new
创建的新对象。我当时听到这个问题的第一时刻想的是: 纳尼 !怎么可能new
操作符对应的构造函数中的this
指向的不是新创建的对象实例呢?当时由于并没有仔细地将问题从业务中抽象出来,其实我也有点迷糊,但仔细一想,这个语句到底要表达什么呢?
思考
在说这个表达式所要表达的含义之前,先说一个关于new操作符的几个小知识:
构造函数的返回
JavaScript构造函数中可以返回值,也可以不返回值,比如:
function Person(){ } var person = new Person()
我们知道这个时候构造函数返回的是创建的实例对象,也就是构造函数中this
Thinking
이 표현의 의미에 대해 이야기하기 전에 새 연산자에 대한 약간의 지식에 대해 이야기해 보겠습니다.# 🎜🎜## 🎜🎜#Constructor return
JavaScript 생성자는 다음과 같은 값을 반환하거나 반환하지 않을 수 있습니다.function Person(){ return function(){} } var person = new Person() typeof person // "function"#🎜 🎜#현재로서는 생성자는 생성자의
this
가 가리키는 개체인 생성된 인스턴스 개체를 반환합니다. 하지만 생성자에 반환 값이 있는 경우 상황에 따라 차별화해야 합니다. 비참조 유형 값이 반환되는 경우 실제로 반환되는 것은 여전히 새로 생성된 인스턴스 개체입니다. 그러나 참조 유형의 값이 반환되면 참조 개체 자체가 반환됩니다. 예: new constructor[([arguments])]
JavaScript에서 함수는 일급 시민으로서 본질적으로 참조 유형이므로 person은 반환된 익명 함수입니다. new 연산자의 두 가지 형태
사실 MDN의 new 연산자 설명에서 구문은new provider[type].$get()(config);#🎜 🎜#입니다. ([인수])는 대괄호로 둘러싸여 있으며 이는 기본값이 될 수 있음을 의미합니다. 따라서 매개변수가 없는 생성자에 대해 new Person()과 new Person 사이에 차이가 없다면 다음 질문에 대해 생각해 보겠습니다. . 이전에 함수를 반환한 Person의 경우 new Person()이 실행될 때 (new Person)() 대신 new Person()이 실행되는 이유는 무엇입니까? 이전 기사 중 하나를 읽어보셨다면 매개변수가 있는 new 연산자가 매개변수 목록이 없는 new 연산자보다 우선순위가 높다는 것을 아실 것입니다. 따라서 항상 두 번째 대신 첫 번째가 실행됩니다. #위의 단계를 이해한 후 문제의 본질에 가까워졌습니다. #
(new provider[type].$get())(config);
JavaScript 엔진이 다음으로 구문 분석하는지 여부:
new (provider[type].$get())(config);
또는
var str = "Hello" + true ? "World" : "JavaScript";첫 번째 양식의 경우 (new 공급자[type].$get()) 무엇 반환되는 것은 익명 함수이므로 익명(config)의 내부 this 지점은 window입니다. 두 번째 모드에서 공급자[type].$get()은 익명 함수를 반환하므로 new anonymous(config)를 실행할 때 내부 this 포인터는 새로 생성된 인스턴스 this를 가리킵니다. 물론 이것이 왜 new로 생성된 새로운 객체 대신 window를 가리키는지 보면 알 수 있습니다. 사실 작가가 당시에 표현하고 싶었던 것은 두 번째 의미였지만, 사실은 두 번째 의미였습니다. 왜? 그 이유는 매우 간단합니다. 첫 번째 실행 방법에서는 JavaScript 엔진이 먼저 new 연산자를 매개변수 목록으로 구문 분석하는 반면, 두 번째 방법에서는 함수 호출이 먼저 실행된 후 new 연산자가 실행됩니다. 레벨 다이어그램에서 볼 수 있듯이 매개변수 목록이 있는 new는 함수 호출보다 우선순위가 높으므로 첫 번째 방법으로 실행해야 합니다.
사실 이 글에는 유용한 정보가 별로 없지만, 그래도 두 가지 인사이트가 있습니다. 먼저, 이전 유사한 글에서 이렇게 모호한 표현은 사용하지 말 것을 강조했습니다. 예를 들어 일부 학생들은 다음과 같이 작성할 것입니다.
그렇다면 str의 내용은 무엇입니까? 어떤 사람들은 Hello World라고 생각할 수도 있습니다. Hello World입니다. 실제로 연산 결과는 World입니다.
+ 연산자가 조건 연산자보다 우선순위가 높기 때문에 이때 괄호를 추가하면 코드를 더 쉽게 읽을 수 있습니다. 둘째, 기술에 대한 경외심을 가지십시오. 모든 것을 알고 있다고 생각하지만 실제로는 아무것도 모른다는 것입니다. #🎜🎜##🎜🎜##🎜🎜##🎜🎜##🎜🎜##🎜🎜##🎜🎜# #🎜🎜#위 내용은 JavaScript 연산자 우선 순위에 대한 자세한 분석(예제 포함)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!