tangram.js库实现js类的方式实例分析


Posted in Javascript onJanuary 06, 2018

本文实例讲述了tangram.js库实现js类的方式。分享给大家供大家参考,具体如下:

前面一篇https://3water.com/article/25781.htm对tangram.js库做了较为详细的介绍,这里结合实例分析一下tangram.js库实现js类的方式。代码如下:

/*
 * Tangram
 * Copyright 2010 Baidu Inc. All rights reserved.
 *
 * @author: meizz
 * @namespace: baidu.lang.createClass
 * @version: 1.6.0
 */
///import baidu.lang;
///import baidu.lang.Class;
///import baidu.lang.Event;
/**
 * 创建一个类,包括创造类的构造器、继承基类Class
 * @name baidu.lang.createClass
 * @function
 * @grammar baidu.lang.createClass(constructor[, options])
 * @param {Function} constructor 类的构造器函数
 * @param {Object} [options]
 * @config {string} [type] 类名
 * @config {Function} [superClass] 父类,默认为baidu.lang.Class
 * @version 1.2
 * @remark
 *
      使用createClass能方便的创建一个带有继承关系的类。同时会为返回的类对象添加extend方法,使用obj.extend({});可以方便的扩展原型链上的方法和属性
 * @see baidu.lang.Class,baidu.lang.inherits
 *
 * @returns {Object} 一个类对象
 */
baidu.lang.createClass = /**@function*/function(constructor, options) {
  options = options || {};
  var superClass = options.superClass || baidu.lang.Class;
  // 创建新类的真构造器函数
  var fn = function(){
    var me = this;
    // 20101030 某类在添加该属性控制时,guid将不在全局instances里控制
    options.decontrolled && (me.__decontrolled = true);
    // 继承父类的构造器
    superClass.apply(me, arguments);
    // 全局配置
    for (i in fn.options) me[i] = fn.options[i];
    constructor.apply(me, arguments);
    for (var i=0, reg=fn["\x06r"]; reg && i<reg.length; i++) {
      reg[i].apply(me, arguments);
    }
  };
  // [TODO delete 2013] 放置全局配置,这个全局配置可以直接写到类里面
  fn.options = options.options || {};
  var C = function(){},
    cp = constructor.prototype;
  C.prototype = superClass.prototype;
  // 继承父类的原型(prototype)链
  var fp = fn.prototype = new C();
  // 继承传参进来的构造器的 prototype 不会丢
  for (var i in cp) fp[i] = cp[i];
  // 20111122 原className参数改名为type
  var type = options.className || options.type;
  typeof type == "string" && (fp.__type = type);
  // 修正这种继承方式带来的 constructor 混乱的问题
  fp.constructor = cp.constructor;
  // 给类扩展出一个静态方法,以代替 baidu.object.extend()
  fn.extend = function(json){
    for (var i in json) {
      fn.prototype[i] = json[i];
    }
    return fn; // 这个静态方法也返回类对象本身
  };
  return fn;
};

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JS Range HTML文档/文字内容选中、库及应用介绍
May 12 Javascript
分页栏的web标准实现
Nov 01 Javascript
json数据与字符串的相互转化示例
Sep 18 Javascript
script不刷新页面的联动前后代码
Sep 18 Javascript
jQuery实现气球弹出框式的侧边导航菜单效果
Sep 22 Javascript
javascript 动态样式添加的简单实现
Oct 11 Javascript
微信小程序后台解密用户数据实例详解
Jun 28 Javascript
jQuery实现列表的增加和删除功能
Jun 14 jQuery
vue实现文字横向无缝走马灯组件效果的实例代码
Apr 09 Javascript
vue使用recorder.js实现录音功能
Nov 22 Javascript
京东优选小程序的实现代码示例
Feb 25 Javascript
vue-cli3项目升级到vue-cli4 的方法总结
Mar 19 Javascript
JavaScript寄生组合式继承实例详解
Jan 06 #Javascript
基于jquery trigger函数无法触发a标签的两种解决方法
Jan 06 #jQuery
JS实现非首屏图片延迟加载的示例
Jan 06 #Javascript
jQuery中库的引用方法
Jan 06 #jQuery
基于JavaScript中标识符的命名规则介绍
Jan 06 #Javascript
js生成word中图片处理方法
Jan 06 #Javascript
详解webpack中的hash、chunkhash、contenthash区别
Jan 05 #Javascript
You might like
Laravel6.0.4中将添加计划任务事件的方法步骤
2019/10/15 PHP
为JavaScript提供睡眠功能(sleep) 自编译JS引擎
2010/08/16 Javascript
javascript奇异的arguments分析
2010/10/20 Javascript
javascritp添加url参数将参数加入到url中
2014/09/25 Javascript
js实现进度条的方法
2015/02/13 Javascript
详解JavaScript的Polymer框架中的通知交互
2015/07/29 Javascript
网页收藏夹显示ICO图标(代码少)
2015/08/04 Javascript
jQuery实现的网页左侧在线客服效果代码
2015/10/23 Javascript
jQuery密码强度检测插件passwordStrength用法实例分析
2015/10/30 Javascript
jquery彩色投票进度条简单实例演示
2020/07/23 Javascript
详解AngularJS过滤器的使用
2016/03/11 Javascript
Jquery实现select multiple左右添加和删除功能的简单实例
2016/05/26 Javascript
angularJS 如何读写缓冲的方法(推荐)
2016/08/06 Javascript
在Docker快速部署Node.js应用的详细步骤
2016/09/02 Javascript
JS实现选定指定HTML元素对象中指定文本内容功能示例
2017/02/13 Javascript
ES6新数据结构Map功能与用法示例
2017/03/31 Javascript
利用jQuery实现简单的拖曳效果实例代码
2017/10/20 jQuery
elementui实现预览图片组件二次封装
2020/12/29 Javascript
Django 添加静态文件的两种实现方法(必看篇)
2017/07/14 Python
Python使用matplotlib绘图无法显示中文问题的解决方法
2018/03/14 Python
numpy 进行数组拼接,分别在行和列上合并的实例
2018/05/08 Python
python中ASCII码字符与int之间的转换方法
2018/07/09 Python
Python递归函数实例讲解
2019/02/27 Python
Python常用类型转换实现代码实例
2020/07/28 Python
localstorage和sessionstorage使用记录(推荐)
2017/05/23 HTML / CSS
浅析HTML5:'data-'属性的作用
2018/01/23 HTML / CSS
BIBLOO波兰:捷克的一家在线服装店
2018/03/09 全球购物
Foot Locker德国官方网站:美国运动服和鞋类零售商
2018/11/01 全球购物
CK巴西官方网站:Calvin Klein巴西
2019/07/19 全球购物
澳大利亚在线性感内衣商店:Fantasy Lingerie
2021/02/07 全球购物
国窖1573广告词
2014/03/21 职场文书
计算机软件专业求职信
2014/06/10 职场文书
法制演讲稿
2014/09/10 职场文书
解除劳动合同协议书
2014/09/17 职场文书
努力工作保证书
2015/02/28 职场文书
欢送领导祝酒词
2015/08/12 职场文书