【LayaBox笔记原创（1）】LayaBox引入自定义第三方包

【LayaBox笔记原创（1）】LayaBox引入自定义第三方包

 

前言

 首先说明一点博主写的原创文章，都是基于自己项目中使用到的，觉得实用的知识点进行分享

并不会解释过程中的原理，知识点解答之类的，博主希望每个看到文章的人，自己按照步骤实现一遍

慢慢掌握这些知识点，加上自己的理解，才能真正成为自己的知识，而不是作为一个参考文档，来学习理论知识。

博主博客很丑，排版也不好，毕竟也有自己的工作，分享重于传达知识，不是做得很花里花哨宣传自己。

以上，不爽的憋着，你也可以帮博主设计，万分感谢！

 

代码

1、创建Laya项目，选择ts语言

2、编写Laya类，例如我们创建一个com.company.Person类

/**
* 创建一个Person例子
* @author wls
* @date 2015-01-10
*/
module com.company {
    export class Person {
        public name: string;        //公有属性
        private id: number;        //私有属性
        private _age: number;        //私有属性，用于getset访问器
        private static _sex: string;    //静态属性, 用于get访问器

        //带参数构造函数
        constructor(id: number) {
            this.id = id;
        }

        public get age(): number {
            return this._age;
        }
        public set age(value: number) {
            this._age = value;
        }

        public static get sex(): string {
            return this._sex;
        }

        public static set sex(value: string) {
            this._sex = value;
        }

        public get Id(): number {
            return this.id;
        }
    }
}

Person.ts

3、保存、并编译，在bin目录下生成com.company.Person.js 和 com.company.Person.js.map

/**
* 创建一个Person例子
* @author wls
* @date 2015-01-10
*/
var com;
(function (com) {
    var company;
    (function (company) {
        var Person = /** @class */ (function () {
            //带参数构造函数
            function Person(id) {
                this.id = id;
            }
            Object.defineProperty(Person.prototype, "age", {
                get: function () {
                    return this._age;
                },
                set: function (value) {
                    this._age = value;
                },
                enumerable: true,
                configurable: true
            });
            Object.defineProperty(Person, "sex", {
                get: function () {
                    return this._sex;
                },
                set: function (value) {
                    this._sex = value;
                },
                enumerable: true,
                configurable: true
            });
            Object.defineProperty(Person.prototype, "Id", {
                get: function () {
                    return this.id;
                },
                enumerable: true,
                configurable: true
            });
            return Person;
        }());
        company.Person = Person;
    })(company = com.company || (com.company = {}));
})(com || (com = {}));
//# sourceMappingURL=Person.js.map

Person.js

4、复制 Person.js 到 bin\libs\ 目录下，并删除bin\com.company.Person.js 及其目录

5、删除Person.ts文件及其目录

6、编写Person.d.ts提示类

/**
* 创建一个Person例子
* @author wls
* @date 2015-01-10
*/
declare module com.company {
    export class Person {
        public name: string;        //公有属性

        //带参数构造函数
        constructor(id: number);

        public age: number;

        public static sex:string;
        //只有get方法的定义
        public readonly Id:number;

    }
}

Person.d.ts

7、bin\index.html中，引入Person.js，就可以完成整个自定义第三方库的实现

    <!--jsfile--Custom-->
    <script src="libs/Person.js"></script>
    <!--jsfile--Custom-->

index.html

8、最后我们用个例子来测试一下

//调用我们定义的第三方类库
        var person:com.company.Person = new com.company.Person(123);    //实例化一个Person，并传入ID
        person.name = "wls";    //设置名称，直接属性赋值
        person.age = 18            //设置年龄，get/set构造器赋值
        com.company.Person.sex = "安静的美男子";    //设置性别，静态get/set构造器赋值
        //输出结果
        console.log(">>>我是一个",com.company.Person.sex,"大名：",person.name,"年年都",person.age);

View Code

 

源码和对应操作图片下载：　

链接：https://pan.baidu.com/s/1DpqkTUH1iU9uHdFmDNptjA
提取码：39nr 

 

转载于:https://www.cnblogs.com/wls-blogs/p/Laya.html