<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
</body>
</html>
/* Inheritance Helper*/
var base = (function baseConstructor() {
var obj = {
create: function instantiation() {
if (this != base) {
var instance = Object.create(this.pub);
this.init.apply(instance, arguments);
this.instances.push(instance);
return instance;
} else {
throw new Error("You can't create instances of base");
}
},
inherit: function inheritation() {
var sub = Object.create(this);
sub.pub = Object.create(this.pub);
sub.sup = this;
return sub;
},
initclosure: function initiation() {},
instances: [],
pub: {}
};
Object.defineProperty(obj, "init", {
set: function (fn) {
if (typeof fn != "function") throw new Error("init has to be a function");
if (!this.hasOwnProperty("initclosure")) this.initclosure = fn;
},
get: function () {
var that = this;
//console.log(that)
return function () {
if (that.pub.isPrototypeOf(this)) //!(obj.isPrototypeOf(this) || that == this))
that.initclosure.apply(this, arguments);
else throw new Error("init can't be called directly");
};
}
});
Object.defineProperty(obj, "create", {
configurable: false,
writable: false
});
Object.defineProperty(obj, "inherit", {
configurable: false,
writable: false
});
return obj;
})();
/*Helpers*/
function merge(obj) {
if (arguments.length < 2) throw new Error({
msg: "At least 2 parameters needed"
});
for (var i = 1, ilen = arguments.length; i < ilen; i++)
for (var k in arguments[i])
obj[k] = arguments[i][k];
}
/*Helpers for workarounds*/
function tieProp(prop, obj) {
if (arguments.length < 3) throw new Error({
msg: "At least 2 Objects are needed"
});
var ref = obj[prop];
for (var i = 1, ilen = arguments.length; i < ilen; i++)
Object.defineProperty(arguments[i], prop, {
set: function (val) {
ref = val;
},
get: function () {
return ref;
}
});
}
/*Example Code*/
var Series = base.inherit();
Series.init = function (specs) {
var _Series = this;
specs = specs || {};
this.seasons = [];
var Season = Series.inherit();
Season.init = function (specs) {
var _Season = this;
specs = specs || {};
_Series.seasons.push(this);
merge(this, specs);
};
merge(this, specs);
Season.pub.score = this.score; // First way
Season.pub.stats = this.stats; // Second Way
tieProp("scoreTied", this, Season.pub); //Third Way
Season.pub.scoreSetter = this.scoreSetter; // Second Way
this.updateScore = function (score) { // Forth Way
this.scoreSetter = score;
Season.pub.scoreSetter = score;
};
tieProp("someObj", this, Season.pub); //Obj Example
this.addSeason = function (specs) {
Season.create(specs);
};
};
Series.pub.toString = function () {
return this.title + " has a score of " + this.scoreTied;
};
var Futurama = Series.create({
title: "Futurama",
score: 1, // 1.
scoreTied: 2, // 2.
stats: { //3.
score: 3
},
scoreSetter: 4,
someObj: {
a: "b"
}
});
Futurama.addSeason();
console.log("BeforeChange", Futurama.score + " - " + Futurama.seasons[0].score); //"1 - 1"
console.log(Futurama.scoreTied + " - " + Futurama.seasons[0].scoreTied); // "2 - 2"
console.log(Futurama.stats.score + " - " + Futurama.seasons[0].stats.score); // "3 - 3"
console.log(Futurama.scoreSetter + " - " + Futurama.seasons[0].scoreSetter); //"4 - 4"
console.log(JSON.stringify(Futurama.someObj) + " - " + JSON.stringify(Futurama.seasons[0].someObj)); //"{"a":"b"} - {"a":"b"}"
Futurama.score = 2; //TFirst way // This will fail
Futurama.scoreTied = 3; //Second way
Futurama.stats.score = 4; // Third way
Futurama.updateScore(5); // Forth Way
Futurama.someObj = {
b: "a"
}; // Object replacement
console.log("After Change", Futurama.score + " - " + Futurama.seasons[0].score); // 2 - 1
console.log(Futurama.scoreTied + " - " + Futurama.seasons[0].scoreTied); // 3 - 3
console.log(Futurama.stats.score + " - " + Futurama.seasons[0].stats.score); //4 -4
console.log(Futurama.scoreSetter + " - " + Futurama.seasons[0].scoreSetter); //5 - 5
console.log(JSON.stringify(Futurama.someObj) + " - " + JSON.stringify(Futurama.seasons[0].someObj)); //"{"b":"a"} - {"b":"a"}"
Output
You can jump to the latest bin by adding /latest
to your URL
Keyboard Shortcuts
Shortcut | Action |
---|---|
ctrl + [num] | Toggle nth panel |
ctrl + 0 | Close focused panel |
ctrl + enter | Re-render output. If console visible: run JS in console |
Ctrl + l | Clear the console |
ctrl + / | Toggle comment on selected lines |
ctrl + ] | Indents selected lines |
ctrl + [ | Unindents selected lines |
tab | Code complete & Emmet expand |
ctrl + shift + L | Beautify code in active panel |
ctrl + s | Save & lock current Bin from further changes |
ctrl + shift + s | Open the share options |
ctrl + y | Archive Bin |
Complete list of JS Bin shortcuts |
JS Bin URLs
URL | Action |
---|---|
/ | Show the full rendered output. This content will update in real time as it's updated from the /edit url. |
/edit | Edit the current bin |
/watch | Follow a Code Casting session |
/embed | Create an embeddable version of the bin |
/latest | Load the very latest bin (/latest goes in place of the revision) |
/[username]/last | View the last edited bin for this user |
/[username]/last/edit | Edit the last edited bin for this user |
/[username]/last/watch | Follow the Code Casting session for the latest bin for this user |
/quiet | Remove analytics and edit button from rendered output |
.js | Load only the JavaScript for a bin |
.css | Load only the CSS for a bin |
Except for username prefixed urls, the url may start with http://jsbin.com/abc and the url fragments can be added to the url to view it differently. |