- 浏览: 390182 次
- 性别:
- 来自: 上海
文章分类
- 全部博客 (309)
- xaml C# wpf (0)
- scala java inner clas (1)
- Tools UML Eclipse UML2 (1)
- Timer .NET Framework (1)
- perl (6)
- python function paramter (1)
- Python Docstring (1)
- Python how to compare types (1)
- Python (8)
- java (5)
- C# (76)
- C# WPF (0)
- p4 (0)
- WPF (46)
- .net (6)
- xaml (1)
- javascript (40)
- windows (10)
- scala (4)
- winform (1)
- c++ (48)
- tools (12)
- cmd (1)
- os (0)
- CI (0)
- shell (0)
- C (2)
- haskell (49)
- functional (1)
- tool (1)
- gnu (1)
- linux (1)
- kaskell (0)
- svn (0)
- wcf (3)
- android (1)
最新评论
Javascript is featured of something that is special among other object oriented or object based language, where you do not have class, and there is some mechanism which is called the prototype inheritance that can help you achieve something that fimiliar with most OO programmer.
With object inheritance, it is quite possilbe to simulate the class like code with the use of closures and prototype inheritance.
let's first see an example of what will become after we have the class like code implemented.
var Person = Object.subClass({ init: function(isDancing) { this.dancing = isDancing; }, dance : function() { return this.dancing } }); var Ninja = Person.subClass({ init : function() { this._super(false); }, dacne : function() { // call hte inherited version of the dance() return this._super(); }, swingSword: function() { return true; } }); var n = new Ninja(); assert(n.swingSword(), "Get true, as we expected"); assert(!n.dance(), "The inverse of the super method's value - false."); // Should all be true assert(p instanceof Person && n instance Ninja && n instanceof Person, "the objects inherit functionalities from the correct sources.");
and below is the code that has the library implementation.
/************************************** *@Summary * With the help of object singleton inheritance, we achieve something that we are faimiliar with in some strong typed language * * this utilize this feature to extend the element in the HTML * * @Usage: * var Person = Object.subClass({ init: function(isDancing) { this.dancing = isDancing; }, dance : function() { return this.dancing } }); var Ninja = Person.subClass({ init : function() { this._super(false); }, dacne : function() { // call hte inherited version of the dance() return this._super(); }, swingSword: function() { return true; } }); var n = new Ninja(); assert(n.swingSword(), "Get true, as we expected"); assert(!n.dance(), "The inverse of the super method's value - false."); // Should all be true assert(p instanceof Person && n instance Ninja && n instanceof Person, "the objects inherit functionalities from the correct sources."); * @TODO: * test it ***************************************/ /** *@Comment: class like instance * point 1: this is to test the browser compatability. since ew need to test if function can be serialized, if a functin can be serialized, the n it is possible to test if the function has used _super */ (function () { var initializing = false, // determine if functions can be serialized // Comment point 1 fnTest = /xyz/.test(function () { xyz; }) ? /\b_super\b/ : /.*/; Object.subClass = function (prop) { var _super = this.prototype; // Initialize a base class (but only create the instantiate, // don't run the init constructor initializing = true; // so given the code sample // var Ninja = Person.subClass(...) // this will correspond to the object of 'Person' var proto = new this(); initializing = false; // Copy the properties over onto the new prototype for (var name in prop) { // check if we 're overwriting an existing function proto[name] = typeof prop[name] == "function" && typeof _super[name] == "function" && fnTest.test(prop[name]) ? (function (name, fn) { return function () { var tmp = this._super; // add a new ._super() method that is the same but on the super-class this._super = _super[name]; // the method only need to be bound temporarily, so we remove it when we're done execting var ret = fn.apply(this, arguments); this._super = tmp; return ret; }; })(name, prop[name]) : prop[name]; } // we create a dummy class that can both act as the constructor as well as the class type as well function Class() { // All construction is actually done in the init method if (!initializing && this.init) { this.init.apply(this, arguments); } } // populate our constructed prototype objet Class.prototype = proto; // Enforce the constructor to be what we expect Class.constructor = Class; // and make it extensible so that we can do things like // var Person = Object.subClass(...) // var Ninja = Person.subClass(...) // and that is because the first Object.subClass() will return Class, and we want to allow user to call // subClass further on this function object // you need this because it the function's prototype is not directly the Object itself? Class.subClass = arguments.callee; return Class; }; })();
and below is the code that we used to test the function.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script src="classlike.js" type="text/javascript"></script> <script src="../unit.js" type="text/javascript"></script> <script type="text/javascript"> window.onload = function () { test("classlike test", function () { var Person = Object.subClass({ init: function(isDancing) { this.dancing = isDancing; }, dance: function() { return this.dancing } }); var Ninja = Person.subClass({ init : function() { this._super(false); }, dacne : function() { // call hte inherited version of the dance() return this._super(); }, swingSword: function() { return true; } }); var n = new Ninja(); assert(n.swingSword(), "Get true, as we expected"); assert(!n.dance(), "The inverse of the super method's value - false."); // Should all be true assert(p instanceof Person && n instanceof Ninja && n instanceof Person, "the objects inherit functionalities from the correct sources."); } ); }; </script> <style type="text/css"> #results li.pass { color: Green } #results li.fail { color: Red } </style> </head> <body> <ul id="results" /> </body> </html>
发表评论
-
javascript - trick to cross browser DOM ready event
2012-08-24 08:23 903the "ready" event ... -
javascript - trick to simulate mouseenter and mouseleave
2012-08-23 08:31 2229Previously we discussed javasc ... -
javascript - trick to simulate the change event
2012-08-22 08:51 1615In the previous discussion a ... -
javascript - trick to simulate bubbling submit event
2012-08-22 08:03 885In the previous discussion abou ... -
javascript - trick to implement bubbling submit event
2012-08-23 07:55 674Following up to the javascrip ... -
javascript - trick to detect bubbling supportability
2012-08-20 22:22 934Event delegation is oe of the b ... -
javascript - trigger event and custom events
2012-08-20 21:58 2046In the previous post - javascri ... -
javascript - trick to handlers management
2012-08-20 08:19 996We have discussed "javascr ... -
javascript - trick to centralized store
2012-08-20 07:52 787For a number of reasons it's ... -
javascript - trick to fix the event object
2012-08-20 07:47 850Many browsers, especially In ... -
javascript - tricks to deal with colors
2012-08-15 08:34 745There are a couple of ways to r ... -
javascript - trick to manipulate the opacity
2012-08-15 08:26 745All other browsre may have supp ... -
javascript - trick to test visibility of an element
2012-08-15 08:15 499though there is a visible prope ... -
javascript - trick to get and set height and width
2012-08-15 08:05 525when looking at properties t ... -
javascript - trick to set/get attributes that expects px values
2012-08-16 11:00 496When setting a number into a ... -
javascript - trick to get and set CSS style
2012-08-16 11:00 719while it will not be so much tr ... -
javascript - trick to normalize href for IE
2012-08-16 10:59 509IE is again the only browser th ... -
javascript - trick IE form and its expando attribute
2012-08-16 10:59 1012there is a known issue that if ... -
javascript expando and attributes
2012-08-14 08:15 1012expando is something like this ... -
javascript - trick to getText and setText
2012-08-14 07:40 1108it is not as simple as you thin ...
相关推荐
Compiler, Templates, testing framework, and Inspector -- including how to minify JavaScript code with the Compiler, and why the combination of the Compiler and the Library is what sets Closure apart ...
Prototype Section 3.6. Reflection Section 3.7. Enumeration Section 3.8. Delete Section 3.9. Global Abatement Chapter 4. Functions Section 4.1. Function Objects Section 4.2. Function Literal ...
JavaScript闭包(closure).pdf
–js:javascript文件名,可以指定多个 –js_output_file:主要输出文件,如果没有指定,压缩后的文件将用标准输出输出 –compilation_level[WHITESPACE_ONLY | SIMPLE_OPTIMIZATIONS
- Corrected bugs which caused occasional crashes on port closure. - Corrected bugs which caused unnecessary exceptions when sending data at low baud rates with CheckAllSends = false. - Fixed ...
理解javascript函数式编程中的闭包(closure)_.docx
2 JavaScript 與 NodeJS 11 2.1 Event Loop . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11 2.2 Scope 與 Closure . . . . . . . . . . . . . . . . . . . . . . . . . . 12 2.3 Callback . . . ...
closure-compiler-v20170521.jar,以及一个.chm使用说明:‘Getting Started with the Closure Compiler Application’,‘Advanced Compilation and Externs’,‘Understanding the Restrictions Imposed by the ...
fixed with placement – the designer has to go back to their RTL code and re-write it to fix the problem. Code it correctly from the beginning, anticipating implementation roadblocks and barriers, ...
Closure: the definitive guide, by Michael Bolin
Bulletproof SSL and TLS by Ivan Ristić Table of Contents Preface . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ...
主要完成了数据库存储概念中Closure-Table 存储,写了一个SSM简单的项目 项目是github上的,github也是我自己的项目
当我们从github上下载了blockly之后,打卡demos下的index.html时,选择blockly-developer-tools时会弹出一个对话框(大体内容是closure dependency not found),此时我们需要下载这个文件,解压并且命名为closure-...
javascript Javascript 代码 其中很多都是伪代码的写法,便有回顾和总结。参考资料 包含 javascript 的基础语法 面向对象的实现 设计模式实现 模块化开 javascript 常见的疑问 jQuery NodeJs html5 Javascript ...
4.5 Mergesort: Sorting by Divide-and-Conquer . . . . . . . . . . . . 120 4.6 Quicksort: Sorting by Randomization . . . . . . . . . . . . . . . 123 4.7 Distribution Sort: Sorting via Bucketing . . . . ...
The Closure Library is a broad, well-tested, modular, and cross-browser JavaScript library. You can pull just what you need from a large set of reusable UI widgets and controls, and from lower-level ...
Google_Closure官方教程中文版.pdf
google closure compiler js混淆压缩工具方便无法访问google的朋友们下载
1.8 Customers and Users....................................................................................................- 10 - 1.9 A Code of Practice for IT Service Management – PD0005...............
要学好JavaScript,有几个基本概念必须搞清楚:prototype,executing,context,closure。Prototype 在JavaScript语言中,通常使用Prototype来实现OO。在这里,我们不对JavaScript的OO实现进行过多的探讨,着重来看...