prototype 笔记01 – 有爱前端

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>prototype -demo-01</title> <meta charset="utf-8" /> <link rel="stylesheet" href="http://static.xcabc.com/css/bootstrap.min.css" /> </head> <body> <div class="container"> <div class="panel panel-default"> <div class="panel-heading">echo panel</div> <div id="echo_body" class="panel-body"> </div> </div> </div> <script type="text/javascript"> Date.prototype.toHHmmssSSS = function () { return this.getHours() + ':' + this.getMinutes() + ':' + this.getSeconds() + '.' + this.getMilliseconds(); }; var echo_body = document.getElementById('echo_body'); var echo = function (msg) { var item = document.createElement('p'); item.innerHTML = '<mark>'+(new Date().toHHmmssSSS())+'</mark> ' + msg; echo_body.appendChild(item); }; </script> <script type="text/javascript"> (function () { var obj = function () { this.a = 1; this.c = 'c'; }; obj.prototype = { show: function () { echo('prototype.show'); }, a: 2, b:'b' }; obj.show = function () { echo('obj.show'); } var a = new obj(); var Base = function (name) { this.name = name; }; Base.prototype = { show: function () { echo('show:'+this.name); }, hide: function () { echo('hide:' + this.name); } }; Base.prototype.switch = function () { console.log(this); echo('switch:' + this.name); }; var xiaozhi = function () { this.name = '小志'; }; xiaozhi.prototype = new Base(); var sigua = function () { }; sigua.prototype = new Base('丝瓜'); sigua.prototype.switch = function () { echo('我是丝瓜'); }; var b = new Base(); var sg = new sigua(); sg.show(); sg.switch(); echo(Base.prototype.switch.call(sg)); var ajax = function (func) { setTimeout(func,200); } var aa = { a: 1, show: function() { console.log(this); ajax((data) => { this.a = 2; echo(this.a); }); } }; aa.show(); var aaa = (name) => { echo(name); }; aaa('xxxx'); })(); </script> </body> </html>

提示：你可以先修改部分代码再运行。

转载请注明：有爱前端 » prototype 笔记01