{"id":3419,"date":"2016-03-15T23:27:32","date_gmt":"2016-03-15T23:27:32","guid":{"rendered":"http:\/\/www.garysieling.com\/blog\/?p=3419"},"modified":"2016-03-15T23:27:32","modified_gmt":"2016-03-15T23:27:32","slug":"lodash-extend-can-skip-properties","status":"publish","type":"post","link":"https:\/\/www.garysieling.com\/blog\/lodash-extend-can-skip-properties\/","title":{"rendered":"Why lodash “extend” or “assignTo” can skip properties"},"content":{"rendered":"

If you look at the prototype for an object in the browser console, you will see some proprties rendered in a light purple:<\/p>\n

\"\"<\/p>\n

If you run “_.extend” on an object that has these, they will also disappear, like so:<\/p>\n

\"\"<\/p>\n

However, you definitely can reference them directly (this one gives me an error, but obviously it’s actually there):
\n\"\"<\/p>\n

In the lodash source<\/a>, “extend” is also known as assignIn:<\/p>\n

  var assignIn = createAssigner(function(object, source) {\n    copyObject(source, keysIn(source), object);\n  });\n<\/pre>\n
You can call _.keysIn directly, and see that the interesting properties are not returned:<\/p>\n
_.keysIn(React.Component.prototype)\n[\"isReactComponent\", \"setState\", \"forceUpdate\"]\n<\/pre>\n
Suprisingly, “hasOwnProperty” returns true for one of the ‘missing’ functions:<\/p>\n
React.Component.prototype.hasOwnProperty(\"isMounted\")\ntrue\n<\/pre>\n
However, lodash will detect that an object is a prototype object by looking for a constructor:<\/p>\n
 var Ctor = object.constructor,\n          index = -1,\n          isProto = typeof Ctor == 'function' && Ctor.prototype === object,\n          result = Array(length),\n          skipIndexes = length > 0;\n<\/pre>\n
If it is a prototype object, it then skips the constructor automatically.<\/p>\n
The other missing properties are of a special class, called non-enumerable properties<\/a>.<\/p>\n
Armed with this knowledge, you can look into the React source, and find they use this all over the place, which explains the root problem:<\/p>\n
Object.defineProperty(element._store, 'validated', {\n  configurable: false,\n  enumerable: false,\n  writable: true,\n  value: false\n});\n<\/pre>\n","protected":false},"excerpt":{"rendered":"
If you look at the prototype for an object in the browser console, you will see some proprties rendered in a light purple: If you run “_.extend” on an object that has these, they will also disappear, like so: However, you definitely can reference them directly (this one gives me an error, but obviously it’s … <\/p>\n
Continue reading “Why lodash “extend” or “assignTo” can skip properties”<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"footnotes":""},"categories":[4],"tags":[302,343,455],"aioseo_notices":[],"aioseo_head":"\n\t\t\n\t\n\t\n\t\n\t\n\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t\n\t\t