Javascript의 "+" 연산자 이해
- 巴扎黑원래의
- 2017-04-15 09:06:011592검색
<p>온라인이나 인터뷰 질문에서 </p>
<pre class="brush:php;toolbar:false">{}+{}
// "[object Object][object Object]"
{}+[]
// 0
[]+{}
// "[object Object]"
[]+[]
// ""</pre>
<p>와 같은 "이상한" 진술을 자주 볼 수 있습니다. Javascript에서 <code>+</code> 연산자는 문자열과 두 개의 "숫자"를 연결하는 데 사용할 수 있는 오버로드된 연산자입니다. 추가됩니다. 어떤 경우인지는 연산자 양쪽의 매개변수 유형에 따라 다릅니다. <br>일상적인 개발에서는 이렇게 번거로운 일이 발생하지 않지만, 이를 알아내는 것은 항상 좋습니다. 사양에는 다음과 같은 많은 내용이 언급되어 있습니다. </p>
<p>1. 기본 유형의 경우 매개변수 중 하나가 문자열이면 문자열 연결로 처리되고 그렇지 않으면 처리됩니다. 숫자가 아닌 것은 먼저 숫자로 변환된 후 추가됩니다. </p>
<p>기본 유형은 정의되지 않음, null, 부울, 숫자, 문자열입니다. </p>
<p>몇 가지 예는 다음과 같습니다. </p>
<pre class="brush:php;toolbar:false">0 + '1' // '01'
null + 1 // 1
true + 1 // 2
false + 1 // 0
undefined + 2 // NaN, 因为undefined转成Number是NaN</pre>
<p>2. 참조 유형의 경우 먼저 기본 유형으로 변환한 후 위의 규칙에 따라 추가해야 합니다. 변환하는 방법은 스펙에 자세히 나와 있는데 스펙이 좀 힘든 것 같습니다. 간단히 말하면 기본적으로 문자열로 변환됩니다. 특별한 작업을 수행하려면 <code>valueOf()</code> 메서드를 재정의하세요. </p>
<p>예를 들어보겠습니다: </p>
<pre class="brush:php;toolbar:false">function Complex(a, b) {
this.a = a;
this.b = b;
}
Complex.prototype.valueOf() {
return this.a;
}
new Complex(2, 3) + new Complex(4, 5);
// 6</pre>
<p>그러나 JS는 실제 연산자 오버로딩을 지원하지 않기 때문에, 즉 사용자 정의 유형 객체를 얻기 위해 추가할 수 없으므로 위의 예는 거의 사용되지 않습니다. 실용적인 코드. </p>
<p>그러나 현재의 지식만으로도 원래 질문에 답할 수 있습니다. 그런데 <code>{}+[]</code>는 <code>[]+{}</code>과 왜 다른가요? 이것은 실제로 문법적인 문제입니다. 전자는 다음과 같습니다. </p>
<pre class="brush:php;toolbar:false">{}
+[]</pre>
<p>는 실제로 두 문장이고 <code>[]</code>를 숫자로 변환하면 0입니다. <code>({}+[]) === '[object Object]'</code></p>
<pre class="brush:php;toolbar:false">+[] // 0</pre>
<p> 확인하기 쉽습니다. <code>new Date()</code>의 <code>valueOf()</code>를 숫자로 변환한거 아닌가요? 덧셈 결과가 여전히 문자열 유형인 이유는 무엇입니까? </p>
<pre class="brush:php;toolbar:false">new Date().valueOf();
// 1491904757087
1 + new Date();
// "1Tue Apr 11 2017 18:02:16 GMT+0800 (CST)"</pre>
<p>특수 처리된 @@toPrimitive Date 클래스입니다. 기본적으로 <code>Date</code>의 추가는 문자열 모드로 연결되지만 비교 시 숫자로 변환됩니다. </p>
<pre class="brush:php;toolbar:false">new Date() < new Date('2018-01-01')
// true, 现在是2017</pre><p> 참조 유형을 기본 유형으로 변환하는 것은 <code><</code>, <code>> 등 많은 연산자에서 사용되므로 이에 대한 학습이 필요합니다. 다음 js 코드는 해당 동작을 대략적으로 설명합니다. <pre class="brush:php;toolbar:false">/**
* @param input 即要转换的对象
* @preferredType 期望转换成的类型，可以是string或number
*/
function ToPrimitive(input, preferredType) {
if (typeof input !== 'object') {
return input; // 本来就是原生类型
}
var hint = preferredType || 'default';
if (typeof input['@@toPrimitive'] === 'function') { // @@toPrimitive是个内部方法，这里只是示例说明其工作原理
return input['@@toPrimitive'](input, hint); // 这就是为什么Date能特殊处理的原因
}
if (hint === 'string') {
return input.toString();
}
return input.valueOf();
}</pre><p>자세한 내용은 사양을 참조하세요</p><p class="article fmt article__content"><br></p><p>온라인이나 면접 질문에서 </p><pre class="brush:php;toolbar:false">{}+{}
// "[object Object][object Object]"
{}+[]
// 0
[]+{}
// "[object Object]"
[]+[]
// ""</pre>Javascript에서 <p> 연산자는 문자열을 연결하고 두 개의 "숫자"를 추가하는 데 사용할 수 있는 오버로드된 연산자입니다. 어떤 경우인지는 연산자 양쪽의 매개변수 유형에 따라 다릅니다. <code>+</code>일상적인 개발에서는 이렇게 번거로운 일이 발생하지 않지만, 이를 알아내는 것은 항상 좋습니다. 사양에는 다음과 같은 많은 내용이 언급되어 있습니다. <br></p>1. 기본 유형의 경우 매개변수 중 하나가 문자열이면 문자열 연결로 처리되고 그렇지 않으면 처리됩니다. 숫자가 아닌 것은 먼저 숫자로 변환된 후 추가됩니다. <p></p>기본 유형은 정의되지 않음, null, 부울, 숫자, 문자열입니다. <p></p>몇 가지 예는 다음과 같습니다. <p></p><pre class="brush:php;toolbar:false">0 + '1' // '01'
null + 1 // 1
true + 1 // 2
false + 1 // 0
undefined + 2 // NaN, 因为undefined转成Number是NaN</pre>2. 참조 유형의 경우 먼저 기본 유형으로 변환한 후 위의 규칙에 따라 추가해야 합니다. 변환하는 방법은 스펙에 자세히 나와 있는데 스펙이 좀 힘든 것 같습니다. 간단히 말하면, 기본적으로 문자열로 변환됩니다. 특별한 작업을 수행하려면 <p> 메서드를 재정의하세요. <code>valueOf()</code></p>예를 들어보겠습니다: <p></p><pre class="brush:php;toolbar:false">function Complex(a, b) {
this.a = a;
this.b = b;
}
Complex.prototype.valueOf() {
return this.a;
}
new Complex(2, 3) + new Complex(4, 5);
// 6</pre>그러나 JS는 실제 연산자 오버로딩을 지원하지 않기 때문에, 즉 사용자 정의 유형 객체를 얻기 위해 추가할 수 없으므로 위의 예는 거의 사용되지 않습니다. 실용적인 코드. <p></p>그러나 현재의 지식만으로도 원래 질문에 답할 수 있습니다. 그런데 <p>는 <code>{}+[]</code>과 왜 다른가요? 이것은 실제로 문법적인 문제입니다. 전자는 다음과 같습니다. <code>[]+{}</code></p><pre class="brush:php;toolbar:false">{}
+[]</pre>는 실제로 두 문장이고 <p>를 숫자로 변환하면 0입니다. <code>[]</code><code>({}+[]) === '[object Object]'</code></p><pre class="brush:php;toolbar:false">+[] // 0</pre> 확인하기 쉽습니다. <p>의 <code>new Date()</code>를 숫자로 변환한거 아닌가요? 덧셈 결과가 여전히 문자열 유형인 이유는 무엇입니까? <code>valueOf()</code></p><pre class="brush:php;toolbar:false">new Date().valueOf();
// 1491904757087
1 + new Date();
// "1Tue Apr 11 2017 18:02:16 GMT+0800 (CST)"</pre>특수 처리된 @@toPrimitive Date 클래스입니다. 기본적으로 <p>의 추가는 문자열 모드로 연결되지만 비교 시 숫자로 변환됩니다. <code>Date</code></p><pre class="brush:php;toolbar:false">new Date() < new Date('2018-01-01')
// true, 现在是2017</pre></p> 참조 유형을 기본 유형으로 변환하는 것은 <p>, <code><</code> 등 많은 연산자에서 사용되므로 이에 대한 학습이 필요합니다. 다음 js 코드는 해당 동작을 대략적으로 설명합니다. <code>>아아앙<p class="col-md-8"><br></p><p class="comments-box-content"><br></p></pre></pre>
위 내용은 Javascript의 "+" 연산자 이해의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.