README
JsKlass简介
JsKlass是基于Javascript实现的OOP代码结构的JS库；具有类、继承、协议、类常量、类静态、final类型修饰、property特性、内置安全校验等功能特征
website: www.jsklass.com
使用前言
JsKlass不依懒任何第三方库，是一个独立基于Javascript的库，兼容IE8+以上的所有主流浏览器；在使用它前仅仅只需要有Javascript基础并且对OOP有所了解
Browser版本: https://github.com/liangwengao/jsklass-browser
Import版本: https://github.com/liangwengao/jsklass-import
Require版本: https://github.com/liangwengao/jsklass-require
安装方式
Bower模块
bower install liangwengao/jsklass-browser --save
Import模块
npm install liangwengao/jsklass-import --save dev
或者
npm install jsklass-import --save dev
Require模块
npm install liangwengao/jsklass-require --save dev
或者
npm install jsklass-require --save dev
JsKlass特性:
支持无入侵式定义类
支持类继承/多继承
支持类构造
支持类实例化多个独立的类对象
支持类对象encoder/decoder
支持类、类对象、协议的安全校验
支持属性setter/getter
支持属性final类型修饰
支持协议的遵循约束/多重实现/多重继承
支持类常量定义
支持类静态数据共享
支持类原型与其他Function类型进行绑定
兼容浏览器环境(major)，兼容node环境
JsKlass 全局API:
JK.DefClass: 定义类
JK.DefProtocol: 定义协议
JK.ProtocolType: 指定协议对应的类型，用于约束类定义属性的类型
JK.Global: 用于保存全局模块，只有浏览器版本才拥有
一、JsKlass的语法
1.定义类语法
const 类名 = DefClass('类名', function (sl) {
// ...
})
2.类继承语法
const 类名 = DefClass('类名', function (sl) {
// ...
}, 被继承的类)
3.定义协议
const 协议名 = DefProtocol('协议名', {
// 对self指向约束
'self': {
// 例如：在类遵循此协议时，对username属性进行“字符串”类型的约束
username: ProtocolType.string()
},
// 对const指向约束
'const': {
},
// 对static指向约束
'static': {
}
})
4.类遵循协议语法
const 类名 = DefClass('类名', function (sl) {
// ...
}, null, 被遵循的协议)
二、使用JsKlass
< Script > 标签式使用JsKlass
在浏览器版本中使用 'JsKlass' 或 'JK' 两者是等价的
<script type='text/javascript' src='/bower_components/jsklass/lib/jsklass.js'></script>
<script type='text/javascript'>
/**
* @description Demo类
* @class Demo
*/
const Demo = JK.DefClass('Demo', function (sl) {
// todo...
})
</script>
或使用自动执行匿名函数包装简化
<script type='text/javascript' src='/bower_components/jsklass/lib/jsklass.js'></script>
<script type='text/javascript'>
(function(DefClass, DefProtocol, ProtocolType, Global){
/**
* @description Demo类
* @class Demo
*/
const Demo = DefClass('Demo', function (sl) {
// todo...
})
})(JK.DefClass,
JK.DefProtocol,
JK.ProtocolType,
JK.Global)
</script>
Require方式使用JsKlass
const JK = require('jsklass-require')
/**
* @description Demo类
* @class Demo
*/
const Demo = JK.DefClass('Demo', function (sl) {
// todo...
})
Import方式使用JsKlass
import * as JK from 'jsklass-import'
/**
* @description Demo类
* @class Demo
*/
const Demo = JK.DefClass('Demo', function (sl) {
// todo...
})
或者
import {
DefClass,
DefProtocol,
ProtocolType
} from 'jsklass-import'
/**
* @description Demo类
* @class Demo
*/
const Demo = DefClass('Demo', function (sl) {
// todo...
})
三、类的指向
DefClass(..., function (sl, co, st, su, po) { ... })
| Name | Pointer | Describe |
|---|---|---|
| sl | self或this | 实例指向 |
| co | const | 常量指向 |
| st | static | 静态指向 |
| st | super | 父类指向 |
| po | prototype | 原型指向 |
四、类实例
在定义一个类时，如果在类中的 'sl' 指向声名了 '_construct' 构造函数，在类实例化对象时则会自动调用一次
/**
* @description Demo类
* @class Demo
*/
const Demo = DefClass('Demo', function (sl) {
/**
* @description 构造函数
* @function _construct
*/
sl._construct = function (name) {
console.log('Demo._construct():' + name)
}
/**
* @description show方法
* @function Demo#show
*/
sl.show = function () {
console.log('Demo.show()')
}
/**
* @description hide方法
* @function Demo#hide
*/
sl.hide = function () {
console.log('Demo.hide()')
}
})
let demo = new Demo('awen')
demo.show()
demo.hide()
/**运行结果：
> Demo._construct():awen
> Demo.show()
> Demo.hide()
*/
五、类继承
一个类在定义时可以去继承另一个类的属性或方法，支持多态继承（即一次只可继承一个类），不支持多重继承
/**
* @description DemoA类
* @class DemoA
*/
const DemoA = DefClass('DemoA', function (sl) {
/**
* @description show方法
* @function DemoA#show
*/
sl.show = function () {
console.log('DemoA.show()')
}
})
/**
* @description DemoB类
* @class DemoB
*/
const DemoB = DefClass('DemoB', function (sl) {
sl._construct = function () {
console.log('DemoB._construct()')
}
/**
* @description hide方法
* @function DemoB#hide
*/
sl.hide = function () {
console.log('DemoB.hide()')
}
}, DemoA)
let demo = new DemoB
demo.show()
demo.hide()
/**运行结果：
> DemoB._construct()
> DemoA.show()
> DemoB.hide()
*/
六、类覆写
当一个类去继承另外一个类时，父类的方法或属性可以在子类中使用相同的名称去声明覆写
/**
* @description DemoA类
* @class DemoA
*/
const DemoA = DefClass('DemoA', function (sl) {
/**
* @description show方法
* @function DemoA#show
*/
sl.show = function () {
console.log('DemoA.show()')
}
/**
* @description hide方法
* @function DemoA#hide
*/
sl.hide = function () {
console.log('DemoA.hide()')
}
})
/**
* @description DemoB类
* @class DemoB
*/
const DemoB = DefClass('DemoB', function (sl) {
sl._construct = function () {
console.log('DemoB._construct()')
}
/**
* @description hide方法
* @function DemoB#hide
*/
sl.hide = function () {
console.log('DemoB.hide()')
}
/**
* @description display方法
* @function DemoB#display
*/
sl.display = function () {
console.log('DemoB.display()')
}
}, DemoA)
let demo = new DemoB()
demo.show()
demo.hide()
demo.display()
/**运行结果：
> DemoB._construct()
> DemoA.show()
> DemoB.hide()
> DemoB.display()
*/
七、super父类
子类继承父类时被覆盖的方法或属性，子类可通过 'su' 指向去访问
/**
* @description DemoA类
* @class DemoA
*/
const DemoA = DefClass('DemoA', function (sl) {
sl._construct = function () {
console.log('DemoA._construct()')
}
/**
* @description show方法
* @function DemoA#show
*/
sl.show = function () {
console.log('DemoA.show()')
}
/**
* @description hide方法
* @function DemoA#hide
*/
sl.hide = function () {
console.log('DemoA.hide()')
}
})
/**
* @description DemoB类
* @class DemoB
*/
const DemoB = DefClass('DemoB', function (sl, co, st, su) {
sl._construct = function () {
console.log('DemoB._construct()')
su._construct()
}
/**
* @description hide方法
* @function DemoB#hide
*/
sl.hide = function () {
console.log('DemoB.hide()')
su.hide()
}
}, DemoA)
let demo = new DemoB()
demo.show()
demo.hide()
/**运行结果：
> DemoB._construct()
> DemoA._construct()
> DemoA.show()
> DemoB.hide()
> DemoA.hide()
*/