【TypeScript】Object、object和{}类型

2023-10-27


Object、object和{}(对象类型)

Object

Object类型是所有 Object 类的实例的类型。它由以下两个接口来定义:

  • Object 接口定义了 Object.prototype 原型对象上的属性;
  • ObjectConstructor 接口定义了 Object 类的属性。

如何理解上述两点呢?

Object是一个对象,但是是包含了js原始的所有公用的功能,这个需要去了解js的原型链(这里不过多进行讲述),从TypeScript源码进行分析:

interface Object {
   /** The initial value of Object.prototype.constructor is the standard built-in Object constructor. */
   constructor: Function;
   /** Returns a string representation of an object. */
   toString(): string;
   /** Returns a date converted to a string using the current locale. */
   toLocaleString(): string;
   /** Returns the primitive value of the specified object. */
   valueOf(): Object;
   /**
    * Determines whether an object has a property with the specified name.
    * @param v A property name.
    */
   hasOwnProperty(v: PropertyKey): boolean;
   /**
    * Determines whether an object exists in another object's prototype chain.
    * @param v Another object whose prototype chain is to be checked.
    */
   isPrototypeOf(v: Object): boolean;
   /**
    * Determines whether a specified property is enumerable.
    * @param v A property name.
    */
   propertyIsEnumerable(v: PropertyKey): boolean;
}
interface ObjectConstructor {
 /** Invocation via `new` */
 new(value?: any): Object;
 /** Invocation via function calls */
 (value?: any): any;
 readonly prototype: Object;
 getPrototypeOf(o: any): any;
 // ···
}
declare var Object: ObjectConstructor;

从中可以看出,Object的构造函数指向了Function,在学习js原型链时我们知道Object和Function是相互指向对方的

Object类型可以通过new进行创建;

注意:Object类型包含了所有的原始/基础类型,所以可以给Object类型赋值为基础类型;如果值对象属性名与 Object 接口中的属性冲突,则 TypeScript 编译器会提示相应的错误:如下例,对象中重写了toString方法,但是返回类型和Object中返回类型string冲突,所以报错;

let obj: Object; // 或者 let obj = new Object();
obj = "hell oworld";
obj = 1;
obj = true;
obj = undefined; //Error:Type 'undefined' is not assignable to type 'Object'.
obj = {
  	// Type 'number' is not assignable to type 'string'
    toString() {
        return 123;
    }
}

数组型Object => Object[]:因为Object包含原始类型,所以下面代码编译不会报错

let obj: Object[];
obj = [
    123,
    true,
    "hello world",
    [1, 'a', false]
];

object

object 类型是:TypeScript 2.2 引⼊的新类型,它⽤于表示⾮原始类型。object是键值对集合,特殊在值也必须是object

注意:object类型默认可以使用在 Object 类型上定义的所有属性和方法,这些属性和方法可通过 JavaScript 的原型链隐式地使用,但是如果在object中重写了原型链中的属性或者方法,那么会直接覆盖,不受原型链上的影响!

let obj: object; 
obj = 1; // Error:Type 'number' is not assignable to type 'object'.
obj = true; // Error: Type 'boolean' is not assignable to type 'object'.
obj = 'a'; // Error: Type 'string' is not assignable to type 'object'.
obj = undefined; //Error:Type 'undefined' is not assignable to type 'object'.
obj = {
    a : "hell oworld",
    b : 1,
    c : true,
}

obj = {
    toString() {
        return 123;
    }
}
console.log(obj.toString()) // 123

{}/空类型

空类型:{}。它描述了一个没有成员的对象,在typeScript中可以有以下方式生成空类型:

  • 1、没有声明变量类型,但是初始值为{}

    let obj = {}; 
    
  • 直接声明变量类型为{}

    let obj: {}; 
    

当你试图访问这样一个对象的任意属性时,TypeScript 会产生一个编译时错误;但是,你仍然可以使⽤在 Object 类型上定义的所有属性和⽅法,这些属性和⽅法可通过 JavaScript 的原 型链隐式地使⽤:

let obj: {}; 
obj = undefined; //Error:Type 'undefined' is not assignable to type '{}'.
obj = 'a';
obj = {
    a : "hell oworld",
    b : 1,
    c : true,
    toString() {
        return 123;
    }
}
console.log(obj) 
/*
{
  "a": "hell oworld",
  "b": 1,
  "c": true
} 
*/
console.log(obj.toString()) // 123;

总结(比较)

对于Object、object和{},三者都可以使⽤在 Object 类型上定义的所有属性和⽅法,这些属性和⽅法可通过 JavaScript 的原 型链隐式地使⽤;并且都不能被赋值为undefined、null类型;

Object vs object:

  • 1、两者原型上属性方法重写表现不一致;
  • 2、object类型值表示⾮原始类型,Object类型值可以为原始类型;
  • 3、Object可以通过new来定义类型;

Object vs {}:

  • 1、两者类型值可以为原始类型;
  • 2、两者原型上属性方法重写表现不一致;
  • 3、Object可以通过new来定义类型;

object vs {}:

  • 1、两者原型上属性方法重写表现一致;
  • 2、object类型值表示⾮原始类型,{} 类型值可以为原始类型;
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

【TypeScript】Object、object和{}类型 的相关文章

随机推荐

  • 安防摄像头已分别接入乐橙云、萤石云,如何实现私有云平台的统一管理与向上级联?

    一 背景分析 科技创新对社会发展的重要性不言而喻 对于安防行业来说 人工智能和5G等新技术的应用 已经成为推动智能安防发展的一块关键踏板 从技术维度来看 人工智能 云计算 大数据 物联网等技术在安防视频监控领域产生了较多的交汇与融合 新技术
  • 冲刺必会代码100题(1-31)

    说在前面 链表章节 22题之前 多处用到了二级指针 有些地方可以选择使用一级指针也可 题目目录 1 顺序表01 2023 08 19 1 题目描述 2 算法思想 3 代码示例 4 总结 2 顺序表02 2023 08 19 1 题目描述 2
  • matlab如何输入数值,如何将数据输入到训练的神经网络算法 - MATLAB

    这是很基本的 但我似乎无法在网上找到答案 如何将数据输入到训练的神经网络算法 MATLAB 我已经开发了使用MATLAB进行分类的神经网络 但是 我想以预期的方式向训练算法提供用于预测的新数据集 我似乎无法弄清函数myNeuralNetwo
  • protected 权限方法调用.

    在同一个包中 子类可以调用父类的protected方法 子类的对象也可以调用父类的protected 方法 在不同的包中 在子类的内部可以调用父类 超类的protected 方法 但是子类的对象无法调用父类 超类的protected方法
  • MD5 算法流程

    先通过下面的命令对 md5算法有个感性的认识 md5sum tmp 1 txt 1dc792fcaf345a07b10248a387cc2718 tmp 1 txt md5sum 从键盘输入 ctrl d 结束输入 hello world
  • Unity 运行时到处fbx-Autodesk FBX SDK for Unity

    参考链接
  • VMware 虚拟机快照、克隆、磁盘扩容

    1 快照 快照是虚拟机某个时间点上完整系统的镜像 可以在虚拟机内部通过快照文件恢复系统到之前的节点 拍摄快照 恢复快照 2 克隆 克隆是原始虚拟机全部状态的一个拷贝 是脱离原始虚拟机独立存在的 可以在宿主机或其他机器上通过克隆文件创建一个完
  • Python初级到高级调试

    Python初级到高级调试 什么是Python调试 为什么调试很重要 如何在python中执行调试 需要调试的编码错误是什么 常见的调试技术有哪些 什么是Python调试器 Python模块 参考 这篇博客通过示例介绍调试的一些基本和常见用
  • JavaWeb详讲

    JavaWeb内容 一 Servlet简介 Servlet 就是 Sun 公司开发动态 Web 的一门技术 Sun 在这些 API Application Programming Interface 应用程序接口 中提供一个接口叫做 Ser
  • 区块链 - 分布式账本技术的应用优势

    区块链技术正在改变世界各地的工业 它将组织 政府 金融机构和支付平台引入一个新的数字时代 它改变了我们周围的一切 但很多人仍然不知道区块链是什么或区块链技术如何工作 今天 我们为您具体解释什么是区块链和区块链技术的核心内容 什么是区块链 区
  • 如何写好一篇拆书稿?

    前段时间报名参加了知乎写作课 其中有一节课程 介绍如何写好拆书稿 之后不久 看到有人在知乎提问相关问题 便简单整理课程笔记 增加了一些自己的理解 作为回答 算是现学现卖吧 虽然拆书稿不是写作变现的最好渠道 但是刻意练习拆解图书内容 有助于提
  • 万字攻略全面了解selenium_selenium教程

    今天带大家一起学习下python爬虫4小分队 scrapy beautifulsoup selenium以及pyppeteer 之一的Selenium库 主要用于模拟浏览器运行 是一个用于web应用测试的工具 Selenium直接运行在浏览
  • 小程序评论回复功能

  • 超级详细!!!node.js中读写文件方法总结

    nodejs中所有与文件相关的操作都在fs模块中 而读写操作又是我们会经常用到的操作 nodejs的fs模块针对读操作为我们提供了readFile read createReadStream三个方法 针对写操作为我们提供了writeFile
  • 使用OpenSSL进行RSA加密和解密(非对称)

    1 RSA加密和解密基础概念 RSA是一种非对称加密 RSA秘钥 私钥和公钥 一对私钥和公钥就像夫妻一样是唯一的 用私钥加密后必须用对应的公钥才能解密 用公钥加密后必须用对应的私钥才能解密 加密和解密方式 公钥加密 私钥解密 私钥加密 公钥
  • 物联网Lora模块从入门到精通(七)串口通讯

    一 前言 在Lora模块的程序设计中 串口通信一定是一个极其重要且常用的通信方式 借助串口通信 我们不但可以向外传输我们获取的数据 还可以根据外部指令做出相应 同样的 在例程中 为我们提供了一个名为usart1 board c的库 帮助我们
  • Vue页面间数据传递

    Vue页面间数据传递 参考 https www cnblogs com dhui p 12926794 html 父页面
  • elementui el-form 默认不支持回车提交,怎么解决

    概念 1 在表单的提交按钮上添加 Vue 原生属性 native type submit 可以让按钮变为表单提交按钮 2 阻止表单默认提交事件 默认是阻止 在表单上 即
  • (简单课设)前端小白刚做的一个简单的移动端项目的分享和总结

    前端小白刚做的一个简单的移动端项目的分享和总结 所用技术为简单的div css 直接上图片 代码部分 小滴服务 接下来是企业项目部分 接下来是我的小滴部分 另外两个部分内容非常简单 没必要粘贴代码了 我遇到的问题和总结 所用技术为简单的di
  • 【TypeScript】Object、object和{}类型

    文章目录 Object object和 对象类型 Object object 空类型 总结 比较 Object object和 对象类型 Object Object类型是所有 Object 类的实例的类型 它由以下两个接口来定义 Objec