创建DOM元素的构造函数

Question

我想使用构造函数来帮助创建DOM元素，但是我想知道是否有首选的方法来做到这一点。我知道我可以使用框架来处理这个问题，但我想用vanilla JavaScript来实现它。

下面显示的两种方式似乎工作，但我还没有使用功能非常多的new运算符。两种方式有什么区别吗？在这种情况下，我会更好地使用简单的旧功能，而不是使用new？

// First way 
function Title(text){ 
    this.element = document.createElement('h2'); 
    this.element.innerText = text; 
    return this.element; 
} 

// Second way 
function Title(text){ 
    var element = document.createElement('h2'); 
    element.innerText = text; 
    return element; 
} 

var title = new Title("Hello"); 
document.body.appendChild(title); 

Answer 1

你的第一条路似乎是不正确的。虽然它起作用，但你似乎还没有理解new如何在JavaScript中工作。当您使用new与功能，采取以下步骤：创建

• 一个空的对象，像{}。
• 所有this引用里面的函数引用那个空对象。
• this用于根据需要填充该空对象。
• 含蓄地this被返回。 （如果您明确回报，this将被忽略。）

注意，在一个构造函数，如果你明确比this其他一些回报，返回值是不是该instanceof构造函数。只有this是instanceof的构造函数。

因此，第一种方式与new的逻辑无关。它在逻辑上与第二个相同。