Skip to content

Instantly share code, notes, and snippets.

View Williammer's full-sized avatar

William He Williammer

View GitHub Profile
@Williammer
Williammer / jsPatterns.constantFactory.js
Last active August 29, 2015 14:02
jsPatterns.constantFactory.js
var constant = (function () {
var constants = {},
ownProp = Object.prototype.hasOwnProperty,
allowed = {
string: 1,
number: 1,
boolean: 1
},
prefix = (Math.random() + "_").slice(2);
@Williammer
Williammer / jsPatterns.chainedMethod.js
Created June 7, 2014 02:56
jsPatterns.chainedMethod.js - add new methods for an class-like object.
if (typeof Function.prototype.method !== "function") {
Function.prototype.method = function (name, implementation) {
this.prototype[name] = implementation;
return this; // enable chaining function.
};
}
var Person = function (name) {
this.name = name;
}.
@Williammer
Williammer / javaScript.stylesheet.html
Created June 7, 2014 03:28
javaScript.stylesheet.html - dynamically create and modify stylesheet with javaScript.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Lab</title>
<link rel="shortcut icon" href="../favicon.ico">
</head>
<body>
@Williammer
Williammer / jsPatterns.inherit.js
Last active August 29, 2015 14:02
jsPatterns.inherit.js -- including the use of prototype, call/apply, constructor to implement the best solution.
function inherit(Child, Parent) {
Child.prototype = new Parent(); //this is the prototype inhert magic!
}
var holyInherit = (function () {
var F = function () {};
return function (C, P) {
F.prototype = P.prototype;
C.prototype = new F();
C.uper = P.prototype;
@Williammer
Williammer / jsPatterns.klass.js
Created June 7, 2014 13:45
jsPatterns.klass.js - the ultimate imitation for class.
var klass = function (Parent, props) {
var Child, F, i;
// 1.
// new constructor
Child = function () {
if (Child.uber && Child.uber.hasOwnProperty("__construct")) {
Child.uber.__construct.apply(this, arguments);
}
if (Child.prototype.hasOwnProperty("__construct")) {
Child.prototype.__construct.apply(this, arguments);
@Williammer
Williammer / jsPatterns.deepExtendObject.js
Last active August 29, 2015 14:02
jsPatterns.deepExtendObject.js - deeply copy property from the parent. (merely the object property)
function extendDeep(parent, child) {
var i,
toStr = Object.prototype.toString,
astr = "[object Array]";
child = child || {};
for (i in parent) {
if (parent.hasOwnProperty(i)) {
if (typeof parent[i] === "object") {
child[i] = (toStr.call(parent[i]) === astr) ? [] : {};
extendDeep(parent[i], child[i]);
@Williammer
Williammer / jsPatterns.borrowAndBindProp.js
Last active August 29, 2015 14:02
jsPatterns.borrowAndBindProp.js - use apply/call and prototype to implement the function to bind and borrow property from other object.
/* # bind() function - 3 impls that works
* @ sample:
* var newFunc = obj.someFunc.bind(myobj, 1, 2, 3);
*/
//pre ECMA5 bind function:
// 《js Pattern》 version
if (typeof Function.prototype.bind === "undefined") {
Function.prototype.bind = function (thisArg) {
@Williammer
Williammer / jsPerform.domPract.js
Created June 9, 2014 01:33
jsPerform.domPract.js - several performance efficient ways to manipulate dom.
//use ECMA5 selector api.
document.querySelector("ul .selected");
document.querySelectorAll("#widget .class");
//use documentFragment to cache dom elements
var p, t, frag;
frag = document.createDocumentFragment();
p = document.createElement('p');
t = document.createTextNode('first paragraph');
p.appendChild(t);
@Williammer
Williammer / javaScriptPlayEvent.js
Created June 9, 2014 01:48
javaScriptPlayEvent.js - Event practices on a variety of things compatible with different browsers.
//change "Click me: + count" : count add 1
function myHandler(e) {
var src, parts;
// get event and source element
e = e || window.event;
src = e.target || e.srcElement;
// actual work: update label
parts = src.innerHTML.split(": ");
parts[1] = parseInt(parts[1], 10) + 1;
src.innerHTML = parts[0] + ": " + parts[1];
@Williammer
Williammer / javaScript.remoteReq.html
Last active February 22, 2016 17:43
javaScript.remoteReq.js - @t t t game #jsonp - script tag injection, remote request example. By the way, the way it organize the game code is worth learning.
<!-- html -->
<button id="new">New game</button>
<button id="server">Server play</button>
<table>
<tr>
<td id="cell-1">&nbsp;</td>
<td id="cell-2">&nbsp;</td>
<td id="cell-3">&nbsp;</td>
</tr>
<tr>