This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* The hack es5 object.create() gives us. We make a shallow copy of the object | |
* passed in and returned the new object with prototype linked to the passed in | |
* object | |
* 1. still we have the shared reference problems | |
*/ | |
//simple version of object.create() | |
function objectCreate(obj) { | |
function F() {} | |
F.prototype = obj; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Combination inheritance. As the name says, we combine the two ways. | |
* 1. We have two copies of the superclass properties. One copied from the super | |
* class constructor. The other we copied from the prototype. | |
*/ | |
function superDaddy(name) { | |
this.name = name; | |
this.dogs = ['teddy', 'cookie', 'variable']; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Constructor stealing. As the name says, we steal the constructor from super | |
* class | |
* 1. We cant get values and methods from prototype | |
*/ | |
function daddy(name) { | |
this.name = name; | |
} | |
function son(name) { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* The most common and buggy prototype chain inheritance. | |
* You won't use this in production, you swear | |
* Problems: | |
* 1. The most famous shared referece bug | |
*/ | |
function father(name, age) { | |
this.name = name; | |
this.age = age; | |
this.family = ['tommy', 'buddy', 'kathy']; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Here comes the hardest parts. Have you considered if the function you are | |
* going to bind is a constructor function.In this scenario, the this value you | |
* bind should get ignored. | |
* | |
* @param {*} context | |
*/ | |
Function.prototype.bindUltimate = function(context) { | |
if (typeof this !== 'function') { | |
throw new Error('bind is only invoked on functions'); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* Concat the parameters passed in when binding and the parameters when the new | |
* binded function takes | |
* | |
* @param {*} context | |
* @returns | |
*/ | |
Function.prototype.bindWithParam = function(context) { | |
// take the function | |
let fn = this; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* By checking the passed in context, we add an wrapper to primitive types or | |
* reset the this object to global one if null is passed in | |
* | |
* @param {*} context | |
* @returns | |
*/ | |
Function.prototype.myOwnCallUltimate = function(context) { | |
// Object will tranform primitive value into wrapper Object,kind of Java. | |
context = context ? Object(context) : window; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* We could get the parameters with arguments in Javacript. With ES6 spread | |
* operator, you could transform it into a real list. Notes: the first | |
* parameter is the this object, so we slice it. | |
* Problems: | |
* 1. we ignore the case the context passed in is primitive type | |
* 2. we ignore the case the context passed in is null | |
* | |
* @param {Object} [context=window] | |
* @returns |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var domNodeArrays = Array.prototype.slice.call(domNodes); | |
// now domNodeArrays has the unshift methods | |
domNodeArrays.unshift("h1"); | |
let test = [1,2,3,4] | |
// we make a shallow copy of the orignal array, now we are isolated | |
let shallowCopy = [].slice.call(test) | |
test[1] = 4 | |
console.log(shallowCopy[1]) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const objectContructorUltimate = (...args) => { | |
let constructor = [].shift.call(args); | |
let obj = Object.create(constructor.prototype); | |
let result = constructor.apply(obj, args); | |
// ensure we return an object | |
return (typeof result === 'object' && result) || obj; | |
}; |
NewerOlder