RN学习-call实现继承以及自定义类

如下是自定义ListView，rowCell，以及对应的组模型，行模型，以及CommonGroupListViewHeader.js（前面提及到，用处是将该模块当做一个对象导出，属于一个整体）的文件结构体：

自定义类

组模型：CommonGroupItem.js 自定义类如下

/**
 * @providesModule CommonGroupItem
 */

// ES5自定义类
function CommonGroupItem(rowsData,sectionHeight) {
    this.rowsData = rowsData
    this.sectionHeight = sectionHeight

}

// 在JS中,每个文件相当于一个模块
module.exports = CommonGroupItem;

选择这种方式是因为需要支持初始化传值，比如Discover.js中需要对组模型进行传值，然后组模型再通过CommonGroupListViewHeader.js去给CommonRowCell.js赋值

var group1 = new CommonGroupListViewHeader.CommonGroupItem(allRowData,sectionData.height);
        groups.push(group1);

ES6之后自定义类，有如下方式，但是这种不支持初始化传值

// 自定义类,如果这个类需要初始化属性,一般不使用class方式,自定义类,这种定义不支持初始化传值
 export default class CommonGroupItem {
     // 定义成员属性
     rowsData = []
     sectionHeight = 0
 }

同理，行模型CommonRowItem.js，也就是cell模型

/**
 * @providesModule CommonRowItem
 */
// ES5自定义类
function CommonRowItem(image,title,subTitle) {
    this.image = image
    this.title = title
    this.subTitle = subTitle
    this.clickCell = null;
    this.route = null;

    // 自定义Cell
    this.customData = null;
    this.customCellType = null;
}
// 在JS中,每个文件相当于一个模块
module.exports = CommonRowItem;

call方法

那么行也即是cell有的后面带箭头，有的后面带开关，按道理说可以使用继承的方式，继承CommonRowItem，但是JS没有继承，但是可以使用call来实现
对应的模型CommonArrowRowItem.js

/**
 * @providesModule CommonArrowRowItem
 */
import CommonRowItem from 'CommonRowItem'

function CommonArrowRowItem(image,title,subTitle) {
    CommonRowItem.call(this,image,title,subTitle);
}
// 在JS中,每个文件相当于一个模块
module.exports = CommonArrowRowItem;

CommonSwitchRowItem.js

/**
 * @providesModule CommonSwitchRowItem
 */
import CommonRowItem from 'CommonRowItem'

function CommonSwitchRowItem(image,title,subTitle) {
    CommonRowItem.call(this,image,title,subTitle);
    this.disabled = true; // 新增加disabled属性代表开关状态
}
// 在JS中,每个文件相当于一个模块
module.exports = CommonSwitchRowItem;

• call交换方法
  比如CommonArrowRowItem function CommonArrowRowItem(image,title,subTitle)赋值其实调用“父类”的function CommonRowItem(image,title,subTitle)方法，这其实就交换方法，间接实现继承的功能