Skip to content

Instantly share code, notes, and snippets.

@yashikagarg13
Last active March 18, 2017 06:39
Show Gist options
  • Save yashikagarg13/98c9edc64a303a4b742bb103ca2243a4 to your computer and use it in GitHub Desktop.
Save yashikagarg13/98c9edc64a303a4b742bb103ca2243a4 to your computer and use it in GitHub Desktop.
Changing object props without mutating it
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="https://npmcdn.com/expect/umd/expect.min.js"></script>
<script src="https://wzrd.in/standalone/deep-freeze@latest"></script>
</head>
<body>
<script id="jsbin-javascript">
"use strict";
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var toggleTodo = function toggleTodo(todo) {
return _extends({}, todo, { completed: !todo.completed });
return Object.assign({}, todo, { completed: !todo.completed });
// out of multiple sources having same prop, the last one wins
// Object.assign is new method in ES6. Not native to JS. Use polyfill
};
var testToggleTodo = function testToggleTodo() {
var todoBefore = {
id: 1,
text: "Item 1",
completed: false
};
var todoAfter = {
id: 1,
text: "Item 1",
completed: true
};
deepFreeze(todoBefore);
expect(toggleTodo(todoBefore)).toEqual(todoAfter);
};
testToggleTodo();
console.log("Tests Passed!!");
</script>
<script id="jsbin-source-javascript" type="text/javascript">const toggleTodo = (todo) => {
return {...todo, completed: !todo.completed};
return Object.assign({}, todo, {completed: !todo.completed});
// out of multiple sources having same prop, the last one wins
// Object.assign is new method in ES6. Not native to JS. Use polyfill
}
const testToggleTodo = () => {
let todoBefore = {
id: 1,
text: "Item 1",
completed: false,
};
let todoAfter = {
id: 1,
text: "Item 1",
completed: true,
};
deepFreeze(todoBefore);
expect(toggleTodo(todoBefore)).toEqual(todoAfter);
}
testToggleTodo();
console.log("Tests Passed!!");</script></body></script>
</html>
"use strict";
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
var toggleTodo = function toggleTodo(todo) {
return _extends({}, todo, { completed: !todo.completed });
return Object.assign({}, todo, { completed: !todo.completed });
// out of multiple sources having same prop, the last one wins
// Object.assign is new method in ES6. Not native to JS. Use polyfill
};
var testToggleTodo = function testToggleTodo() {
var todoBefore = {
id: 1,
text: "Item 1",
completed: false
};
var todoAfter = {
id: 1,
text: "Item 1",
completed: true
};
deepFreeze(todoBefore);
expect(toggleTodo(todoBefore)).toEqual(todoAfter);
};
testToggleTodo();
console.log("Tests Passed!!");
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment