Skip to content

Instantly share code, notes, and snippets.

@anthonybrown

anthonybrown/index.html

Created May 26, 2017 00:01
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save anthonybrown/1fcd7b7a66c17da40f0cad8e6839d7dc to your computer and use it in GitHub Desktop.
Save anthonybrown/1fcd7b7a66c17da40f0cad8e6839d7dc to your computer and use it in GitHub Desktop.
Download ZIP
JS Bin // source https://jsbin.com/hanolec
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<meta name='description' content='JavaScript Explicit Binding'>
<title>JS Bin</title>
</head>
<body>
<div id='msg'></div>
<script id="jsbin-javascript">
/*
- Implicate Binding
- Explicit Binding
- new Binding
- window Binding
*/
// Explicit Binding
// call, apply, bind
document.addEventListener("DOMContentLoaded", function(e) {
var languages = ['JavaScript', 'Ruby', 'Python'];
var msg = document.getElementById('msg');
var sayName = function (l1,l2,l3) {
'use strict';
msg.innerHTML = `My name is ${this.name} and I know ${l1}, ${l2}, ${l3} !
<br>How cool is that?`;
console.log(`My name is ${this.name} and I know ${l1}, ${l2} ${l3}!`);
};
var stacey = {
name: 'Stacey',
age: 34,
};
//sayName.call(stacey);
/* .apply works better for this */
sayName.call(stacey, languages[0], languages[1], languages[2]);
/* .apply works better */
//sayName.apply(stacey, languages);
//var newFn = sayName.bind(stacey, languages[0], languages[1], languages[2]);
//console.log('Here');
//newFn();
});
</script>
<script id="jsbin-source-javascript" type="text/javascript">/*
- Implicate Binding
- Explicit Binding
- new Binding
- window Binding
*/
// Explicit Binding
// call, apply, bind
document.addEventListener("DOMContentLoaded", function(e) {
var languages = ['JavaScript', 'Ruby', 'Python'];
var msg = document.getElementById('msg');
var sayName = function (l1,l2,l3) {
'use strict';
msg.innerHTML = `My name is ${this.name} and I know ${l1}, ${l2}, ${l3} !
<br>How cool is that?`;
console.log(`My name is ${this.name} and I know ${l1}, ${l2} ${l3}!`);
};
var stacey = {
name: 'Stacey',
age: 34,
};
//sayName.call(stacey);
/* .apply works better for this */
sayName.call(stacey, languages[0], languages[1], languages[2]);
/* .apply works better */
//sayName.apply(stacey, languages);
//var newFn = sayName.bind(stacey, languages[0], languages[1], languages[2]);
//console.log('Here');
//newFn();
});
</script></body>
</html>
Raw
jsbin.hanolec.js
/*
- Implicate Binding
- Explicit Binding
- new Binding
- window Binding
*/
// Explicit Binding
// call, apply, bind
document.addEventListener("DOMContentLoaded", function(e) {
var languages = ['JavaScript', 'Ruby', 'Python'];
var msg = document.getElementById('msg');
var sayName = function (l1,l2,l3) {
'use strict';
msg.innerHTML = `My name is ${this.name} and I know ${l1}, ${l2}, ${l3} !
<br>How cool is that?`;
console.log(`My name is ${this.name} and I know ${l1}, ${l2} ${l3}!`);
};
var stacey = {
name: 'Stacey',
age: 34,
};
//sayName.call(stacey);
/* .apply works better for this */
sayName.call(stacey, languages[0], languages[1], languages[2]);
/* .apply works better */
//sayName.apply(stacey, languages);
//var newFn = sayName.bind(stacey, languages[0], languages[1], languages[2]);
//console.log('Here');
//newFn();
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment