| OOjs |
|---|
| Features |
| See also |
| v · d · e |
OOjs (short for "Object-oriented JavaScript") is a JavaScript library for working with objects. Features include inheritance, mixins, static inheritance and additional utilities for working with objects and arrays. It also provides an EventEmitter mixin for event-driven programming, and a factory pattern for decoupling consumers of functionality from any particular class's implementation.
Features
[edit]OO.inheritClass( childClass, parentClass )
Extend prototype and static methods and properties of child constructor from a parent constructor.
OO.mixinClass( childClass, parentClass )
Copy prototype and static methods and properties to a child constructor from a parent constructor.
Initialise a base class to be inherited by, or mixed into, a child class. Only required for classes that do not inherit or mixin other classes.
Allow event handlers to be attached, called when events occur, and detached.
Provide a simple map interface for associating arbitrary data with a symbolic name.
Registry of classes with instantiation abstraction.
Utilities
[edit]See the API documentation for a complete reference of available utilities.
Compatibility
[edit]OOjs is optimised for outdated ECMAScript 5 environments. The source code is compatible with the older ECMAScript 3 engine (such as in older versions of Internet Explorer, broadly speaking IE8 and before), but users need a polyfill to provide required ECMAScript 5 methods.
It is packaged to be run in either Web browsers or Node.js.
Extending OOjs classes in newer versions of ECMAScript
[edit]MediaWiki's ResourceLoader treats JavaScript code as ES6 by default since MediaWiki 1.41.
ES6 supports the class syntax, so you may declare your extensions of OOjs (and OOUI) classes using the new syntax.
For example:
classMyDialogextendsOO.ui.MessageDialog{ staticgetname(){ return'myDialog'; } constructor(config){ super(config); // ... } initialize(){ super.initialize(); // ... } }
However, you will then need to pass such a class through a helper function like this one:
functiones6ClassToOoJsClass(targetClass){ constoriginClass=Object.getPrototypeOf(targetClass); OO.initClass(originClass); targetClass.static=Object.create(originClass.static); Object.getOwnPropertyNames(targetClass) .filter((key)=>key!=='static') .forEach((key)=>{ constdescriptor=Object.getOwnPropertyDescriptor(targetClass,key); if(descriptor.enumerable||descriptor.get){ targetClass.static[key]=targetClass[key]; } }); targetClass.parent=targetClass.super=originClass; returntargetClass; }
It assumes that the class has no static properties with a getter whose output is not fixed (which is unlikely).
If you're building your JavaScript project with a transpiler like Babel, you can also use the most modern syntax, with static properties declared as such:
staticname='myDialog';
Namespace
[edit]In the presence of a module system, such as in Node.js, OOjs exports all of its classes and methods.
In other environments, such as Web browsers, a global variable is created named OO.
You may access OO the same way you would access jQuery or mediaWiki.
If you are using eslint, you should add the following to your .eslintrc.json file.
"globals":{ "OO":"readonly" }
See also
[edit]|
OOjs
|
External links
[edit]- Source code on phabricator.wikimedia.org/diffusion/ (GitHub mirror)
- Package on npmjs.org
- Phabricator project (issue tracker)
- API Documentation
- Community-created TypeScript definitions for OOjs (work in JavaScript projects as well in popular IDEs).
is maintained by Editing department.
Get help:
|
- WMF Projects 2013q4
- WMF Projects 2014q1
- WMF Projects 2014q2
- WMF Projects 2014q3
- WMF Projects 2014q4
- WMF Projects 2015q1
- WMF Projects 2015q2
- WMF Projects 2015q3
- WMF Projects 2015q4
- WMF Projects 2016q1
- WMF Projects 2016q2
- WMF Projects 2016q3
- WMF Projects 2016q4
- WMF Projects 2017q1
- WMF Projects 2017q2
- WMF Projects 2017q3
- WMF Projects 2017q4
- WMF Projects 2018q1
- WMF Projects 2018q2
- WMF Projects 2018q3
- WMF Projects 2018q4
- WMF Projects 2019q1
- WMF Projects 2019q2
- WMF Projects 2019q3
- WMF Projects 2019q4
- WMF Projects 2020q1
- WMF Projects 2020q2
- WMF Projects 2020q3
- WMF Projects 2020q4
- WMF Projects 2021q1
- WMF Projects 2021q2
- WMF Projects 2021q3
- WMF Projects 2021q4
- WMF Projects 2022q1
- WMF Projects 2022q2
- WMF Projects 2022q3
- WMF Projects 2022q4
- WMF Projects 2023q1
- WMF Projects 2023q2
- WMF Projects 2023q3
- WMF Projects 2023q4
- WMF Projects 2024q1
- WMF Projects 2024q2
- WMF Projects 2024q3
- WMF Projects 2024q4
- WMF Projects 2025q1
- WMF Projects 2025q2
- WMF Projects 2025q3
- WMF Projects 2025q4
- WMF Projects 2026q1
- WMF Projects 2026q2
