+++ /dev/null
-<!DOCTYPE html><html><head><title>Ext.Class | Ext JS 4.0 Documentation</title><script type="text/javascript" src="../ext-all.js"></script><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../scrollbars.css" type="text/css"><link rel="stylesheet" href="../docs.css" type="text/css"><link id="styleCss" rel="stylesheet" href="../style.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script><link rel="stylesheet" href="../prettify.css" type="text/css"><!-- link(rel: 'stylesheet', href: req.baseURL + '/css/ext4.css', type: 'text/css')--><link rel="shortcut icon" type="image/ico" href="../favicon.ico"><!--[if IE]>
-<style type="text/css">.head-band { display: none; }
-.header { border: 0; top: 0; left: 0px; background: url(../header.gif) repeat-x; }
-.doc-tab .members .member a.more { background-color: #efefef; }
-</style><link rel="stylesheet" href="/new/css/ie.css" type="text/css"><![endif]-->
-</head><body id="ext-body" class="iScroll"><div id="notice" class="notice">For up to date documentation and features, visit
-<a href="http://docs.sencha.com/ext-js/4-0">http://docs.sencha.com/ext-js/4-0</a></div><div class="wrapper"><div class="head-band"></div><div class="header"><h2><a href="../index.html">Sencha Documentation</a></h2></div><div id="search"><form><input type="text" placeholder="Search" id="search-field" autocomplete="off" name="q"></form><div id="search-box"></div></div><div id="treePanel"></div><div id="container"><script type="text/javascript">
-
- req = {
- liveURL: '.',
- standAloneMode: true,
- origDocClass: 'Ext.Class',
- docClass: 'Ext.Class',
- docReq: 'Ext.Class',
- version: '4.0',
- baseURL: '.',
- baseDocURL: '.',
- baseProdURL: '.'
- };
-
- clsInfo = {};
-
-
-
-</script>
-
-<script type="text/javascript" src="../search.js"></script>
-<!--script type="text/javascript" src="/new/javascripts/app/examples.js"></script-->
-<script type="text/javascript" src="../class_tree.js"></script>
-<script type="text/javascript" src="../class_doc.js"></script>
-<script type="text/javascript">
- req.source = 'Class.html#Ext-Class';
- clsInfo = {"methods":["getDefaultPreprocessors","getPreprocessor","registerPreprocessor","setDefaultPreprocessorPosition","setDefaultPreprocessors"],"cfgs":[],"properties":[],"events":[],"subclasses":[]};
- Ext.onReady(function() {
- Ext.create('Docs.classPanel');
- });
-</script><div id="top-block" class="top-block"><h1 id="clsTitle" class="cls"><a href="../source/Class.html#Ext-Class" target="_blank">Ext.Class</a></h1></div><div id="docContent"><div id="doc-overview-content"><div class="lft"><p>Handles class creation throughout the whole framework. Note that most of the time <a href="Ext.html#define" rel="Ext#define" class="docClass">Ext.define</a> should
-be used instead, since it's a higher level wrapper that aliases to <a href="Ext.ClassManager.html#create" rel="Ext.ClassManager#create" class="docClass">Ext.ClassManager.create</a>
-to enable namespacing and dynamic dependency resolution.</p>
-
-<h1>Basic syntax:</h1>
-
-<pre class="prettyprint"><code>Ext.define(className, properties);
-</code></pre>
-
-<p>in which <code>properties</code> is an object represent a collection of properties that apply to the class. See
-<a href="Ext.ClassManager.html#create" rel="Ext.ClassManager#create" class="docClass">Ext.ClassManager.create</a> for more detailed instructions.</p>
-
-<pre class="prettyprint"><code>Ext.define('Person', {
- name: 'Unknown',
-
- constructor: function(name) {
- if (name) {
- this.name = name;
- }
-
- return this;
- },
-
- eat: function(foodType) {
- alert("I'm eating: " + foodType);
-
- return this;
- }
-});
-
-var aaron = new Person("Aaron");
-aaron.eat("Sandwich"); // alert("I'm eating: Sandwich");
-</code></pre>
-
-<p>Ext.Class has a powerful set of extensible <a href="Ext.Class.html#registerPreprocessor" rel="Ext.Class#registerPreprocessor" class="docClass">pre-processors</a> which takes care of
-everything related to class creation, including but not limited to inheritance, mixins, configuration, statics, etc.</p>
-
-<h1>Inheritance:</h1>
-
-<pre class="prettyprint"><code>Ext.define('Developer', {
- extend: 'Person',
-
- constructor: function(name, isGeek) {
- this.isGeek = isGeek;
-
- // Apply a method from the parent class' prototype
- this.callParent([name]);
-
- return this;
-
- },
-
- code: function(language) {
- alert("I'm coding in: " + language);
-
- this.eat("Bugs");
-
- return this;
- }
-});
-
-var jacky = new Developer("Jacky", true);
-jacky.code("JavaScript"); // alert("I'm coding in: JavaScript");
- // alert("I'm eating: Bugs");
-</code></pre>
-
-<p>See <a href="Ext.Base.html#callParent" rel="Ext.Base#callParent" class="docClass">Ext.Base.callParent</a> for more details on calling superclass' methods</p>
-
-<h1>Mixins:</h1>
-
-<pre class="prettyprint"><code>Ext.define('CanPlayGuitar', {
- playGuitar: function() {
- alert("F#...G...D...A");
- }
-});
-
-Ext.define('CanComposeSongs', {
- composeSongs: function() { ... }
-});
-
-Ext.define('CanSing', {
- sing: function() {
- alert("I'm on the highway to hell...")
- }
-});
-
-Ext.define('Musician', {
- extend: 'Person',
-
- mixins: {
- canPlayGuitar: 'CanPlayGuitar',
- canComposeSongs: 'CanComposeSongs',
- canSing: 'CanSing'
- }
-})
-
-Ext.define('CoolPerson', {
- extend: 'Person',
-
- mixins: {
- canPlayGuitar: 'CanPlayGuitar',
- canSing: 'CanSing'
- },
-
- sing: function() {
- alert("Ahem....");
-
- this.mixins.canSing.sing.call(this);
-
- alert("[Playing guitar at the same time...]");
-
- this.playGuitar();
- }
-});
-
-var me = new CoolPerson("Jacky");
-
-me.sing(); // alert("Ahem...");
- // alert("I'm on the highway to hell...");
- // alert("[Playing guitar at the same time...]");
- // alert("F#...G...D...A");
-</code></pre>
-
-<h1>Config:</h1>
-
-<pre class="prettyprint"><code>Ext.define('SmartPhone', {
- config: {
- hasTouchScreen: false,
- operatingSystem: 'Other',
- price: 500
- },
-
- isExpensive: false,
-
- constructor: function(config) {
- this.initConfig(config);
-
- return this;
- },
-
- applyPrice: function(price) {
- this.isExpensive = (price > 500);
-
- return price;
- },
-
- applyOperatingSystem: function(operatingSystem) {
- if (!(/^(iOS|Android|BlackBerry)$/i).test(operatingSystem)) {
- return 'Other';
- }
-
- return operatingSystem;
- }
-});
-
-var iPhone = new SmartPhone({
- hasTouchScreen: true,
- operatingSystem: 'iOS'
-});
-
-iPhone.getPrice(); // 500;
-iPhone.getOperatingSystem(); // 'iOS'
-iPhone.getHasTouchScreen(); // true;
-iPhone.hasTouchScreen(); // true
-
-iPhone.isExpensive; // false;
-iPhone.setPrice(600);
-iPhone.getPrice(); // 600
-iPhone.isExpensive; // true;
-
-iPhone.setOperatingSystem('AlienOS');
-iPhone.getOperatingSystem(); // 'Other'
-</code></pre>
-
-<h1>Statics:</h1>
-
-<pre class="prettyprint"><code>Ext.define('Computer', {
- statics: {
- factory: function(brand) {
- // 'this' in static methods refer to the class itself
- return new this(brand);
- }
- },
-
- constructor: function() { ... }
-});
-
-var dellComputer = Computer.factory('Dell');
-</code></pre>
-
-<p>Also see <a href="Ext.Base.html#statics" rel="Ext.Base#statics" class="docClass">Ext.Base.statics</a> and <a href="Ext.Base.html#self" rel="Ext.Base#self" class="docClass">Ext.Base.self</a> for more details on accessing
-static properties within class methods</p>
-<div class="members"><div class="m-methods"><a name="methods"></a><div class="definedBy">Defined By</div><h3 class="mth p">Methods</h3><div id="method-getDefaultPreprocessors" class="member f ni"><a href="Ext.Class.html#method-getDefaultPreprocessors" rel="method-getDefaultPreprocessors" class="expand more ar"><span> </span></a><div class="title"><div class="meta"><a href="Ext.Class.html" class="definedIn docClass">Ext.Class</a><br/><a href="../source/Class.html#Ext-Class-method-getDefaultPreprocessors" class="viewSource">view source</a></div><a name="getDefaultPreprocessors"></a><a name="method-getDefaultPreprocessors"></a><a href="Ext.Class.html#" rel="method-getDefaultPreprocessors" class="cls expand">getDefaultPreprocessors</a> : Function</div><div class="description"><div class="short"><p>Retrieve the array stack of default pre-processors</p>
-</div><div class="long"><p>Retrieve the array stack of default pre-processors</p>
-<h3 class="pa">Returns</h3><ul><li><span class="pre">Function</span> <p>defaultPreprocessors</p>
-</li></ul></div></div></div><div id="method-getPreprocessor" class="member ni"><a href="Ext.Class.html#method-getPreprocessor" rel="method-getPreprocessor" class="expand more ar"><span> </span></a><div class="title"><div class="meta"><a href="Ext.Class.html" class="definedIn docClass">Ext.Class</a><br/><a href="../source/Class.html#Ext-Class-method-getPreprocessor" class="viewSource">view source</a></div><a name="getPreprocessor"></a><a name="method-getPreprocessor"></a><a href="Ext.Class.html#" rel="method-getPreprocessor" class="cls expand">getPreprocessor</a>(
-<span class="pre">String name</span>)
- : Function</div><div class="description"><div class="short"><p>Retrieve a pre-processor callback function by its name, which has been registered before</p>
-</div><div class="long"><p>Retrieve a pre-processor callback function by its name, which has been registered before</p>
-<h3 class="pa">Parameters</h3><ul><li><span class="pre">name</span> : String<div class="sub-desc">
-</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Function</span> <p>preprocessor</p>
-</li></ul></div></div></div><div id="method-registerPreprocessor" class="member ni"><a href="Ext.Class.html#method-registerPreprocessor" rel="method-registerPreprocessor" class="expand more ar"><span> </span></a><div class="title"><div class="meta"><a href="Ext.Class.html" class="definedIn docClass">Ext.Class</a><br/><a href="../source/Class.html#Ext-Class-method-registerPreprocessor" class="viewSource">view source</a></div><a name="registerPreprocessor"></a><a name="method-registerPreprocessor"></a><a href="Ext.Class.html#" rel="method-registerPreprocessor" class="cls expand">registerPreprocessor</a>(
-<span class="pre">String name, Function fn, Object always</span>)
- : Ext.Class</div><div class="description"><div class="short"><p>Register a new pre-processor to be used during the class creation process registerPreprocessor</p>
-</div><div class="long"><p>Register a new pre-processor to be used during the class creation process registerPreprocessor</p>
-<h3 class="pa">Parameters</h3><ul><li><span class="pre">name</span> : String<div class="sub-desc"><p>The pre-processor's name</p>
-</div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>The callback function to be executed. Typical format:</p>
-
-<pre><code>function(cls, data, fn) {
- // Your code here
-
- // Execute this when the processing is finished.
- // Asynchronous processing is perfectly ok
- if (fn) {
- fn.call(this, cls, data);
- }
-});
-</code></pre>
-
-<p>Passed arguments for this function are:</p>
-
-<ul>
-<li><code>{Function} cls</code>: The created class</li>
-<li><code>{Object} data</code>: The set of properties passed in <a href="Ext.Class.html" rel="Ext.Class" class="docClass">Ext.Class</a> constructor</li>
-<li><code>{Function} fn</code>: The callback function that <b>must</b> to be executed when this pre-processor finishes,
-regardless of whether the processing is synchronous or aynchronous</li>
-</ul>
-
-</div></li><li><span class="pre">always</span> : Object<div class="sub-desc">
-</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Ext.Class</span> <p>this</p>
-</li></ul></div></div></div><div id="method-setDefaultPreprocessorPosition" class="member ni"><a href="Ext.Class.html#method-setDefaultPreprocessorPosition" rel="method-setDefaultPreprocessorPosition" class="expand more ar"><span> </span></a><div class="title"><div class="meta"><a href="Ext.Class.html" class="definedIn docClass">Ext.Class</a><br/><a href="../source/Class.html#Ext-Class-method-setDefaultPreprocessorPosition" class="viewSource">view source</a></div><a name="setDefaultPreprocessorPosition"></a><a name="method-setDefaultPreprocessorPosition"></a><a href="Ext.Class.html#" rel="method-setDefaultPreprocessorPosition" class="cls expand">setDefaultPreprocessorPosition</a>(
-<span class="pre">String name, String offset, String relativeName</span>)
- : Ext.Class</div><div class="description"><div class="short">Insert this pre-processor at a specific position in the stack, optionally relative to
-any existing pre-processor. For...</div><div class="long"><p>Insert this pre-processor at a specific position in the stack, optionally relative to
-any existing pre-processor. For example:</p>
-
-<pre><code>Ext.Class.registerPreprocessor('debug', function(cls, data, fn) {
- // Your code here
-
- if (fn) {
- fn.call(this, cls, data);
- }
-}).insertDefaultPreprocessor('debug', 'last');
-</code></pre>
-<h3 class="pa">Parameters</h3><ul><li><span class="pre">name</span> : String<div class="sub-desc"><p>The pre-processor name. Note that it needs to be registered with
-<a href="Ext.html#registerPreprocessor" rel="Ext#registerPreprocessor" class="docClass">registerPreprocessor</a> before this</p>
-</div></li><li><span class="pre">offset</span> : String<div class="sub-desc"><p>The insertion position. Four possible values are:
-'first', 'last', or: 'before', 'after' (relative to the name provided in the third argument)</p>
-</div></li><li><span class="pre">relativeName</span> : String<div class="sub-desc">
-</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Ext.Class</span> <p>this</p>
-</li></ul></div></div></div><div id="method-setDefaultPreprocessors" class="member ni"><a href="Ext.Class.html#method-setDefaultPreprocessors" rel="method-setDefaultPreprocessors" class="expand more ar"><span> </span></a><div class="title"><div class="meta"><a href="Ext.Class.html" class="definedIn docClass">Ext.Class</a><br/><a href="../source/Class.html#Ext-Class-method-setDefaultPreprocessors" class="viewSource">view source</a></div><a name="setDefaultPreprocessors"></a><a name="method-setDefaultPreprocessors"></a><a href="Ext.Class.html#" rel="method-setDefaultPreprocessors" class="cls expand">setDefaultPreprocessors</a>(
-<span class="pre">Array preprocessors</span>)
- : Ext.Class</div><div class="description"><div class="short"><p>Set the default array stack of default pre-processors</p>
-</div><div class="long"><p>Set the default array stack of default pre-processors</p>
-<h3 class="pa">Parameters</h3><ul><li><span class="pre">preprocessors</span> : Array<div class="sub-desc">
-</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Ext.Class</span> <p>this</p>
-</li></ul></div></div></div></div></div></div></div><div id="pageContent"></div></div></div></div></body></html>
\ No newline at end of file