TypeScript 对象

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

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

以上对象包含了标量,函数,集合(数组或元组)。

对象实例

TypeScript

var sites = { site1:"Runoob", site2:"Google" }; // 访问对象的值 console.log(sites.site1) console.log(sites.site2)

编译以上代码,得到以下 JavaScript 代码:

JavaScript

var sites = { site1:"Runoob", site2:"Google" }; // 访问对象的值 console.log(sites.site1) console.log(sites.site2)

输出结果为:

Runoob
Google

TypeScript 类型模板

假如我们在 JavaScript 定义了一个对象:

var sites = { site1:"Runoob", site2:"Google" };

这时如果我们想在对象中添加方法,可以做以下修改:

sites.sayHello = function(){ return "hello";}

如果在 TypeScript 中使用以上方式则会出现编译错误,因为Typescript 中的对象必须是特定类型的实例。

TypeScript

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

编译以上代码,得到以下 JavaScript 代码:

JavaScript

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

输出结果为:

hello Runoob

此外对象也可以作为一个参数传递给函数,如下实例:

TypeScript

var sites = { site1:"Runoob", site2:"Google", }; var invokesites = function(obj: { site1:string, site2 :string }) { console.log("site1 :"+obj.site1) console.log("site2 :"+obj.site2) } invokesites(sites)

编译以上代码,得到以下 JavaScript 代码:

JavaScript

var sites = { site1: "Runoob", site2: "Google" }; var invokesites = function (obj) { console.log("site1 :" + obj.site1); console.log("site2 :" + obj.site2); }; invokesites(sites);

输出结果为:

site1 :Runoob
site2 :Google

鸭子类型(Duck Typing)

鸭子类型(英语:duck typing)是动态类型的一种风格,是多态(polymorphism)的一种形式。

在这种风格中,一个对象有效的语义,不是由继承自特定的类或实现特定的接口,而是由"当前方法和属性的集合"决定。

可以这样表述:

"当看到一只鸟走起来像鸭子、游泳起来像鸭子、叫起来也像鸭子,那么这只鸟就可以被称为鸭子。"

在鸭子类型中,关注点在于对象的行为能做什么,而不是关注对象所属的类型。例如,在不使用鸭子类型的语言中,我们可以编写一个函数,它接受一个类型为"鸭子"的对象,并调用它的"走"和"叫"方法。在使用鸭子类型的语言中,这样的一个函数可以接受一个任意类型的对象,并调用它的"走"和"叫"方法。如果这些需要被调用的方法不存在,那么将引发一个运行时错误。任何拥有这样的正确的"走"和"叫"方法的对象都可被函数接受的这种行为引出了以上表述,这种决定类型的方式因此得名。

interface IPoint { x:number y:number } function addPoints(p1:IPoint,p2:IPoint):IPoint { var x = p1.x + p2.x var y = p1.y + p2.y return {x:x,y:y} } // 正确 var newPoint = addPoints({x:3,y:4},{x:5,y:1}) // 错误 var newPoint2 = addPoints({x:1},{x:4,y:3})

TypeScript 对象的更多相关文章

  1. [TypeScript] TypeScript对象转JSON字符串范例

    [TypeScript] TypeScript对象转JSON字符串范例 Playground http://tinyurl.com/njbrnrv Samples class DataTable { ...

  2. [TypeScript] JSON对象转TypeScript对象范例

    [TypeScript] JSON对象转TypeScript对象范例 Playground http://tinyurl.com/nv4x9ak Samples class DataTable { p ...

  3. TypeScript入门三:TypeScript函数类型

    TypeScript函数类型 TypeScript函数的参数 TypeScript函数的this与箭头函数 TypeScript函数重载 一.TypeScript函数类型 在上一篇博客中已经对声明Ty ...

  4. JcApiHelper 简单好用的.Net ApiHelper

    一 背景 随着前端技术的不断发展,各种框架逐渐成熟,前端 Angular,React,Vue 三分天下.再加上移动端的崛起,前后端分离开发成为主流,前端后端代码混合开发的方式沦为被淘汰的局面.如今 M ...

  5. 用TypeScript开发Vue——如何通过vue实例化对象访问实际ViewModel对象

    用TypeScript开发Vue--如何通过vue实例化对象访问实际ViewModel对象 背景 我个人很喜欢TypeScript也很喜欢Vue,但在两者共同使用的时候遇到一个问题. Vue的实例化对 ...

  6. typeScript面对对象篇二

    接口 接触过面向对象的后端语言的应该对接口很熟悉,只接触过前端的对接口会有点陌生,在维基百科中对OOP中接口的定义是这样的: 在面向对象的语言中,术语interface经常被用来定义一个不包含数据和逻 ...

  7. typeScript面对对象篇一

    面向对象是typescript的核心部分,这里先介绍下面向对象的七大原则: 单一原则:一个类子负责一个职责. 里氏替换原则:子类可以在任何地方替换它的父类. 依赖倒置原则:代码要依赖于抽象的类,而不要 ...

  8. 在TypeScript中扩展JavaScript基础对象的功能

    最近工作中用到,记录一下:假设我们需要一个功能,把一个数字比如10000输出为下面的字符串格式“10,000”,一般是写一个方法,那么我希望更方便一点,直接向Number类型添加一个格式化方法,比如叫 ...

  9. Angular2中实现基于TypeScript的对象合并方法:extend()

    TypeScript里面没有现成的合并对象的方法,这里借鉴jQuery里的$.extend()方法.写了一个TypeScript的对象合并方法,使用方法和jQuery一样. 部分代码和jQuery代码 ...

  10. TypeScript 中限制对象键名的取值范围

    当我们使用 TypeScript 时,我们想利用它提供的类型系统限制代码的方方面面,对象的键值,也不例外. 譬如我们有个对象存储每个年级的人名,类型大概长这样: type Students = Rec ...

随机推荐

  1. 浅谈 web3

     web3--互联网的未来? web3,很多人觉得是个骗局,是在割韭菜.   因为大部分介绍 web3 的文章都离不开 NFT.数字货币.区块链.比特币.以太坊.元宇宙等概念,玄之又玄,脱离我们的生活 ...

  2. js-惰性函数

    1. 需求:我们现在需要写一个 foo 函数,这个函数返回首次调用时的 Date 对象,注意是首次. 使用场景:当我们每次都需要进行条件判断,其实只需要判断一次,接下来的使用方式都不会发生改变的时候, ...

  3. ubuntu测网速speedometer

    下载安装speedometer sudo apt-get install speedometer 查询需要测速的网卡 ifconfig 测速 speedometer -rx enp2s0 执行效果图如 ...

  4. locust自定义负载策略。

    1.时间峰值策略 每运行一分钟启动100个用户,总运行时间为10分钟 class CustomShape(LoadTestShape): # 设置时限 time_limit = 600 # 设置产生率 ...

  5. linux run/media/wang/centos_磁盘爆满

    在使用iso安装了linux系统后,会有个 /run/media/wang/CentOS 7 x86_64 无法删除,这个是我们安装程序时的安装驱动, 登陆用户后将他卸载就可

  6. vite实现element-plus按需配置,自定义主题和读取/修改系统主题色

    项目地址 vite.config.ts 插件和vite配置 import { defineConfig } from "vite"; import vue from "@ ...

  7. URLDecoder.decode() 特殊字符的处理

    在网络get请求中,如果存在特殊字符 比如  "+,/,%,&,= " ,如果没有被转义就直接使用 发现 + 号 仍然是 + 号,初看上去是没什么问题  这样在我们在后台接 ...

  8. java使用apache-commons-lang3生成随机字符串(可自定义规则)

    在日常开发中,我们经常会遇到生成随机字符串的需求.可能是大小写字母+数字,也可能是其他各种字符.作为一个常用功能,我们完全没必要自己实现,有很多优质的类库已经做的很完善了.本文介绍的就是apache- ...

  9. 【服务器数据恢复】VSAN节点容量盘故障离线的数据恢复案例

    VSAN简介:VSAN是以vSphere内核为基础开发,可以扩展使用的分布式存储架构.该架构在vSphere集群主机中安硬盘及闪存构建VSAN存储层,通过存储进行管理与控制,最终形成一个共享存储层.V ...

  10. 【Java学习Day03】JDK的卸载和JDK8的安装过程

    卸载JDK 右键单击此电脑+R+高级系统设置+N 双击JAVA_HOME+F,删除子文件,再返回删除JAVA_HOME 双击Path,删除有关JAVA_HOMED变量,一直点击确定直至返回 打开CMD ...