Errata

I think there is a small mistake in the code given in the book. It throws an error when I execute it in Firefox browser console: "Uncaught ReferenceError: config is not defined."


// 4. If this feels a little difficult to read, a short-hand could
// be written as follows:

var defineProp = function ( obj, key, value ){
config.value = value;
Object.defineProperty( obj, key, config );
};

The code from the JSFiddle link in the last bullet point of the section "Anti-Patterns in JavaScript" is as follows:

```
function writeTest() {
var newHTML = "<div><h1>Hi there!</h1></div>";
document.write(newHTML);
document.close();
}

function elemTest() {
var newDiv = document.createElement("div");
newDiv.innerHTML = "<h1>Hi there!</h1>";
document.body.appendChild(newDiv);
}

writeTest();
```

Since the code executes before the page fully loads, both functions produce the same result, making it difficult to appreciate the difference between using document.write and document.createElement.

To better illustrate the intended point of the example, I have modified the code as follows:

```
function writeTest() {
var newHTML = "<div><h1>Hi there!</h1></div>";
document.write(newHTML);
document.close();
}

function elemTest() {
var newDiv = document.createElement("div");
newDiv.innerHTML = "<h1>Hi there!</h1>";
document.body.appendChild(newDiv);
}

window.addEventListener("load", (event) => {
writeTest();
});
```

With this adjustment, the difference between using document.write and document.createElement is clear. The writeTest function now overwrites the entire page content, in contrast to elemTest, which simply appends new content to the existing page.

I believe this change more accurately demonstrates the potential pitfalls of using document.write in modern web development.