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. Nginx njs模块注入js

    如实现表单代填或者webvpn模式,后续待研究

  2. Python中Websocket的实现及基本原理

    一.什么是 WebSocket ? WebSocket 是一种标准协议,用于在客户端和服务端之间进行双向数据传输.但它跟 HTTP 没什么关系,它是基于 TCP 的一种独立实现. 以前客户端想知道服务 ...

  3. 设置view的圆角和阴影

    1.设置view圆角 self.backView.clipsToBounds = YES; self.backView.layer.cornerRadius = 6.f; 2.设置view阴影 sel ...

  4. Office2021专业增强版激活

    1.以管理员权限运行win+R输入CMD,进入命令行界面,输入以下命令 32位系统输入:cd /d %ProgramFiles(x86)%\Microsoft Office\Office16 64位系 ...

  5. 【坑】 centos 7.6 使用ssh 秘钥登录遇到的问题

    问题: 我在master1上面创建了一个ssh的秘钥文件,通过ssh-copy-id 传送四台主机,然后使用ansible all -m ping 发现有台机器就是有问题 这是怎么回事???一样的配置 ...

  6. ubuntu20.04开机自动运行脚本实例

    在 Ubuntu 20.04 中,/etc/rc.local 文件仍然存在,但不再默认启用,因为它已经被 systemd 代替.下面是使用systemd开机执行的脚本的实例: 1.编写脚本myscri ...

  7. vue自定义组件的总结(一)

    1.定义组件时 <template>   <input     class="input"     :type="type"     :pla ...

  8. PowerShell Regex

    PowerShell默认按每一行遍历去匹配模式 比如"aaa`nbbb"用"a.*b"是匹配不到的 需要用"(?s)a.*b"来匹配 1. ...

  9. Day20:update功能的实现

    今日完成的任务: 1.将最初设想的消息界面删除,删去message和chat等无参数跳转界面,并在物品详情中增加[联系方式]一栏供大家线下交易使用. 最终完成界面如下 2.实现本个小程序最后一个功能- ...

  10. 【笔记】Win7连接公司内网无法打开网页

    win7尝试使用VPN连接公司内网发现无法打开单点登录网页 DNS解析没问题 服务器也能ping通 查了半天才发现是MTU的问题 win7的默认值1400 公司的华为设备设置的比这个值小 要根据具体的 ...