You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

使用new关键字调用工厂函数实例化对象,是否会产生差异?

Does using new with a factory function that returns an object make any difference?

Great observation! On the surface, both snippets produce the exact same output—console.log(newObject.firstNumber) will log 'ONE' in both cases. But under the hood, there is a subtle difference in how JavaScript executes the code, even if it doesn’t affect your final result.

Let’s break down what’s happening:

First, what does new normally do?

When you use new with a function, JavaScript runs through these steps automatically:

  • Creates a brand new empty object
  • Links this new object to the function’s prototype (so newObj.__proto__ === YourFunction.prototype)
  • Sets the function’s internal this to point at this new object
  • If the function doesn’t explicitly return an object/array/function, it automatically returns the new object it created

In your specific code

Your testThis function explicitly returns middleStep—a plain object you created manually. This overrides the default behavior of new: instead of returning the temporary object that new created, it returns your custom middleStep object. The temporary object new made gets discarded immediately, which is why you don’t see any difference in the output.

The tiny (mostly irrelevant) differences

Even though the end result is the same, there are minor behind-the-scenes distinctions:

  • Extra object creation: Using new forces JavaScript to create that temporary object, which then gets thrown away. It’s a negligible performance hit, but it’s unnecessary work.
  • Semantic confusion: Factory functions are meant to be called without new—adding it can make other developers think this is meant to be a constructor function (like class or traditional constructor functions), which misaligns with your code’s intent.

What if your function didn’t return an object?

If you removed the explicit return statement from testThis, the difference would be huge:

function testThis(x) {
  this.firstNumber = x.firstNumber;
  this.secondNumber = x.secondNumber;
  // No return statement
}

// Without new: `this` points to the global object (non-strict mode) or undefined (strict mode)
let obj1 = testThis({firstNumber: 'ONE', secondNumber: 'TWO'});
console.log(obj1); // undefined (and you’d pollute the global scope in non-strict mode)

// With new: Returns the object `new` created, with properties set via `this`
let obj2 = new testThis({firstNumber: 'ONE', secondNumber: 'TWO'});
console.log(obj2.firstNumber); // 'ONE'

Final takeaway

In your exact scenario, the output is identical, but using new adds unnecessary overhead and can confuse readers. Since your function is a factory that returns its own object, you should stick to calling it without new for clarity and efficiency.

内容的提问来源于stack exchange,提问作者DR01D

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.27 04:25:26