JSFiddle - React, Tailwind, and code Playground
by darul75
JavaScript
var a = {
name: 'darul',
children: []
};
var cacheChildren = [];
function displayChildren() {
if (a.children === cacheChildren) {
console.log('no changes');
return;
}
// doRender
// doUpdateCache
cacheChildren = a.children;
console.log('cache updated');
}
console.log('********** START *********');
console.log('REFERENCE');
a.children.push("baby");
displayChildren();
displayChildren();
a.children.push("titi");
displayChildren();
console.log('COPY ?');
function displayChildren2() {
if (a.children === cacheChildren) {
console.log('no changes');
return;
}
// doRender
// doUpdateCache
cacheChildren = a.children.slice();
console.log('cache updated');
}
a.children = [];
cacheChildren = [];
a.children.push("baby");
displayChildren2();
displayChildren2();
a.children.push("titi");
displayChildren2();
console.log('COPY WITH EQUALS');
function arrayEqual(a, b) {
if (a.length !== b.length) return false;
for (var i = 0; i < a.length; i++) {
if (a[i] !== b[i]) return false;
}
return true;
}
function displayChildren3() {
if (arrayEqual(a.children, cacheChildren)) {
console.log('no changes');
return;
}
// doRender
// doUpdateCache
cacheChildren = a.children.slice();
console.log('cache updated');
}
a.children = [];
cacheChildren = [];
a.children.push("baby");
displayChildren3();
displayChildren3();
a.children.push("titi");
displayChildren3();
displayChildren3();
console.log('COPY WITH EQUALS NO DETECTION');
a.children = [];
cacheChildren = [];
a.children.push({name:'baby'});
displayChildren3();
displayChildren3();
a.children[0].name = 'darul';
displayChildren3();
displayChildren3();
/** `Object#toString` result references. */
var argsTag = '[object Arguments]',
arrayTag = '[object Array]',
boolTag = '[object Boolean]',
dateTag = '[object Date]',
errorTag = '[object Error]',
funcTag = '[object Function]',
mapTag = '[object Map]',
numberTag =...