One of the more common techniques in JavaScript is the use of an object to hold configuration values. The object might be accessed as a global or passed around as an argument. For example:
var artist = {
name: "Johnny Cash",
latestAlbum: "American V"
};
function announce (artist) {
if (artist.name == "Johnny Cash") {
console.log("Hello Johnny");
} else {
console.log(artist.name);
}
}
announce(artist);
console.log(artist);
// latestAlbum: "American V"
// }
But in either sort of situation, there is a problem. Functions that have access to the configuration object can modify the object, whether intentionally or accidentally. Suppose that you had a coworker modify the announce function above to highlight Elvis rather than Cash, but they mistyped the comparison.
var artist = {
name: "Johnny Cash",
latestAlbum: "American V"
};
function announce (artist) {
// Whoops! Assigning the name rather than testing equality!
if (artist.name = "Elvis Presley") {
console.log("The King");
} else {
console.log(artist.name);
}
}
announce(artist);
console.log(artist);
// latestAlbum: "American V"
// }
The Object.freeze method takes an object and renders it effectively immutable. Its existing properties may not be modified and new properties may not be added. In the example above this means that even though the logical error is still there, our artist object remains safe from modification and available for later use.
example:
var artist = {
name: "Johnny Cash",
latestAlbum: "American V"
};
Object.freeze(artist);
function announce (artist) {
// Whoops! Assigning the name rather than testing equality!
if (artist.name = "Elvis Presley") {
console.log("The King");
} else {
console.log(artist.name);
}
}
announce(artist);
console.log(artist);
// Outputs: {
// name: "Johnny Cash",
// latestAlbum: "American V"
// }
var artist = {
name: "Johnny Cash",
latestAlbum: "American V"
};
function announce (artist) {
if (artist.name == "Johnny Cash") {
console.log("Hello Johnny");
} else {
console.log(artist.name);
}
}
announce(artist);
// Outputs: "Hello Johnny"
console.log(artist);
// Outputs: {
// name: "Johnny Cash",// latestAlbum: "American V"
// }
But in either sort of situation, there is a problem. Functions that have access to the configuration object can modify the object, whether intentionally or accidentally. Suppose that you had a coworker modify the announce function above to highlight Elvis rather than Cash, but they mistyped the comparison.
var artist = {
name: "Johnny Cash",
latestAlbum: "American V"
};
function announce (artist) {
// Whoops! Assigning the name rather than testing equality!
if (artist.name = "Elvis Presley") {
console.log("The King");
} else {
console.log(artist.name);
}
}
announce(artist);
// Outputs: "The King"
console.log(artist);
// Outputs: {
// name: "Elvis Presley",// latestAlbum: "American V"
// }
The Object.freeze method takes an object and renders it effectively immutable. Its existing properties may not be modified and new properties may not be added. In the example above this means that even though the logical error is still there, our artist object remains safe from modification and available for later use.
example:
var artist = {
name: "Johnny Cash",
latestAlbum: "American V"
};
Object.freeze(artist);
function announce (artist) {
// Whoops! Assigning the name rather than testing equality!
if (artist.name = "Elvis Presley") {
console.log("The King");
} else {
console.log(artist.name);
}
}
announce(artist);
// Outputs: "The King"
console.log(artist);
// Outputs: {
// name: "Johnny Cash",
// latestAlbum: "American V"
// }
No comments:
Post a Comment