如何实现TypeScript对象动态添加属性的功能？

本文共计897个文字，预计阅读时间需要4分钟。

目录

1.定义

2.TypeScript 类型模板

3.为对象动态添加属性

3.1 解决方法 3.2 对象作为参数传递 3.3 方法返回对象 3.4 对象数组 总结

1.定义

TypeScript 对象是包含一组键值对的实例。值可以是基本数据类型或对象。例如：

typescriptlet person: { name: string; age: number }={ name: 'Alice', age: 30 };

2. TypeScript 类型模板在 TypeScript 中，可以使用类型模板来定义对象的类型。这有助于提高代码的可读性和可维护性。

typescriptinterface Person { name: string; age: number;}

3. 为对象动态添加属性

3.1 解决方法

可以通过直接修改对象来添加属性。

typescriptlet person={ name: 'Alice' };person.age=30;

3.2 对象作为参数传递可以将对象作为参数传递给函数，并在函数内部修改它。

typescriptfunction updatePerson(person: { name: string; age: number }) { person.age=31;}

3.3 方法返回对象可以在对象中定义方法，该方法返回一个新的对象。

typescriptlet person={ name: 'Alice' };person.getAge=function() { return this.age;};

3.4 对象数组可以使用对象数组来存储多个对象。

typescriptlet people=[ { name: 'Alice', age: 30 }, { name: 'Bob', age: 25 }];

总结TypeScript 对象是包含一组键值对的实例。可以通过直接修改、传递参数、定义方法或使用数组来动态添加属性。

目录

• 1.定义
• 2.TypeScript 类型模板
• 3.为对象动态添加属性
• 3.1 解决方法
• 3.2 对象作为参数传递
• 3.3 方法返回对象
• 3.4 对象数组
• 总结

1.定义

TypeScript 对象是包含一组键值对的实例。 值可以是标量、函数、数组、对象等，如下实例：

var object_name = { key1: "value1", // 标量 key2: "value", key3: function() { // 函数 }, key4:["content1", "content2"] //集合 } //访问对象 object_name.key1 // value1 object_name.key4 // ["content1", "content2"]

2.TypeScript 类型模板

var sites = { site1: "", site2: 0, sayHello: function () { } // 类型模板 }; sites.site1 = "site1" sites.site2 = 2 sites.sayHello = function () { console.log("hello " + sites.site1 + sites.site2); }; sites.sayHello(); // hello site1 2

3.为对象动态添加属性

如果我们使用以上的方法定义对象是无法做到为对象动态添加属性

let people = { name: "hwm", age: 18, sayHello: ()=> {} } people.sex = "man"

以上代码会报错：

3.1 解决方法

定义一个包含数组属性的接口，让对象实现该接口

interface obj { [idx: string]: any } let people: obj = {} people.name = "hwm" people.age = 18 console.log(people) // { name: 'hwm', age: 18 }

3.2 对象作为参数传递

方法一：

private ParamObj(objT: {name: string, age: number}) { let people = objT console.log(objT) } let people = {name: "hwm", age: 18} this.ParamObj(people) // {name: "hwm", age: 18}

方法二：

interface obj { [idx: string]: any } private ParamObj(objT: obj) { let people = objT console.log(objT) } let people:obj = {} people.name = "lll" people.age = 20 this.ParamObj(people) // {name: "lll", age: 20}

3.3 方法返回对象

private ReturnObj(): {name: string, age: number}{ let people = {name: "hwm", age: 18} return people } let res = this.ReturnObj() console.log(res) // {name: "hwm", age: 18}

3.4 对象数组

let tbl: {<!--{C}%3C!%2D%2D%20%2D%2D%3E-->name: string, age: number}[] = []

总结

到此这篇关于TypeScript为对象动态添加属性的文章就介绍到这了,更多相关TS对象动态添加属性内容请搜索自由互联以前的文章或继续浏览下面的相关文章希望大家以后多多支持自由互联！