【TypeScript】TypeScript+Ionic的Component文件里（ts文件）如何创建对象

在Ionic文件中，有以下几个步骤：

1.import导包；

import {Component} from '@angular/core';import {IonicPage, NavParams, ToastController, AlertController, LoadingController, Platform, App} from "ionic-angular";import {DatabaseService} from "../database.service";import {TransferObject, Transfer} from "@ionic-native/transfer";import {File} from "@ionic-native/file";import {FileOpener} from "@ionic-native/file-opener";import {InAppBrowser} from "@ionic-native/in-app-browser";import pinyin from 'js-pinyin';

2.导入组件Component

@IonicPage()@Component({    selector: 'databaseData',    templateUrl: './databaseData.html',    providers:  [DatabaseService,TransferObject]})

这里@IonicPage()是因为下面有分页模式；
selector:选择器，就是我这个页面的方法对应的html页面名字，去掉后缀之后的名字；
templateUrl：表示对应的页面的全称；
providers：提供者，表示由那个服务者提供的；我们可以这么类比

支付宝支付方法提供者（providers）:[阿里巴巴有限公司,手机，服务商，商铺]；义务教育提供者（providers）:[政府，法律，学校，父母，老师]

3.创建主类Component

export class DatabaseDataComponent {}

如果是主方法，需要加*Component来命名；原则上一个ts文件中只有一个Component为主类；
在主类中有以下几个模块：
①初始化：就是给各个变量一个初始化的值：

    pdfList:any ={};    pageIndex=1;    profession:string;    id:number;    tempUrl:any;    type:any;    state:any;    searchingItems = []; //搜索显示的数组    fileDataList=[];    allSearchFileDataList = [];  //未排序供搜索的数组    formatFileDataList: Array<FileDataList> = new Array();    searchQuery: string = '';    items: string[];    isSearching = false;    searchInput:string;

这里：
初始化的格式为：变量名：数据类型；
大括号{ }：表示对象：类似于Java中的实体类pojo；
中括号[ ]:表示数组；
如果不知道写什么类型，可以写any；TypeScript，简称ts（ts是JavaScript的超集，ts可以兼容js，你全部当js来写也没有问题）；如果可以确定，可以写具体点；string即JavaScript中的String；在ts或js中，没有明确字符概念，可以全部理解为字符串；所以，一般情况下，单引号和双引号没有太大区别；声明一个字符串可以用单引号‘’也可以用双引号“”；

②构造；

    /*warn service，插件，控制器，对象等的构造*/    constructor(private databaseService:DatabaseService,                private inAppBrowser: InAppBrowser,                private navParams:NavParams,                private transfer: Transfer,                private fileTransfer:TransferObject,                private toastCtrl:ToastController,                private loadingCtrl:LoadingController,                private alertCtrl:AlertController,                private fileOpener: FileOpener,                private app:App,                private file:File,                private platform: Platform,                ){        this.profession=this.navParams.get('profession');        this.searchInput = "";    }

小括号里定义构造变量的作用域修饰符，变量名，变量类型；一般是【重量级】的嘉宾才可以登场：比如官方的一些默认对象；还有你自己定义的Service；

3.方法：这里方法比较简单，不需要用

function(){}

这种定义方法，直接方法名+小括号+大括号即可；

    ngOnInit() {        this.pageChange(this.pageIndex);    }

例如上面的官方的初始化方法，初始化加载的一些方法；ngOnInit是方法名，小括号内放参数，大括号内放逻辑代码；方法内也可以引用方法；例如上面的pageChange(this.pageIndex);也是一个方法；如果该方法在本文件中，直接用this引用；这里用了this引用，所以，pageChange()这个方法一定在本文件（本页面）；对比内外这两个方法，我们知道，第一个方法是无参的，因为ngOnInit()小括号里没有参数；里面的方法pageChange(this.pageIndex)里面有this.pageIndex，所以，pageChange方法是有参方法；

而且，这个参数是在本文件（本页面）初始化，并且在本文件（本页面）定义的，因为用的是this引用的；到了这里，大家对this的作用也明确了；this就是引用本文件（本页面）的参数，方法；翻译为中文可以是：“这个”参数，“这个”方法；既然翻译成“这个”，必然是附近的，或者是不久前刚提到，刚用过的；只能是这个页面的东西；水浒里说“这厮”，就是指面前的这人，或者和别人谈话中提起到的人物；刚发生不久的；

4.创建分类

第一个类：

/*warn 搜索框——创建列表KV键值对 */export class FileDataList {    key: string;    value: Array<any> ;}

第二个类：

/*warn 搜索框——创建文件对象*/export class FileDataObj {    name: string;    lastupdateby: string;    pinyinName: string;    profession:string;    url:string;    query_startDate:string;    query_endDate:string;    trainId:string;    state:string;}