前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Js如何创建一个自定义对象

Js如何创建一个自定义对象

作者头像
itclanCoder
发布2023-02-26 15:07:02
4.6K0
发布2023-02-26 15:07:02
举报
文章被收录于专栏:itclanCoderitclanCoder

前言

JS中分两种数据类型,一种是基本数据类型,另外就是复杂数据类型,在描述一个事物对象,当比较复杂时,一般可以用数组和对象来存储

Js中的对象,指的是一系列互相嵌套的键值对,在做web开发时,大多数控件都是以对象或数组的形式来提供给开发人员使用

那如何创建一个对象呢,如何给对象添加属性和方法?在Js当中有一些方法,如下所示

01

方法1-使用文本字面量形式

这种方法创建对象是比较直接,常见的一种方式,就是使用大括号的方式,可以看做是js对象的本本标识,也就是说,可以通过输出字符串的形式来了解对象有哪些键值对,它也是JSON形式,用于js的数据存储和传递,给对象添加属性和添加方法

如下代码所示

代码语言:javascript
复制
// 用大括号创建对象的方法,这种方法最常见,使用最频繁
var obj1 = {};   // 使用大括号创建一个内容为空的对象
obj1.name = "itclanCoder"; // 给obj1对象添加一个name属性,值等于itclanCoder
obj1.outPut = funciton() {  // 给对象obj1添加了一个outPut方法,并提供实现了一个alert弹框
    alert('给obj1添加了一个outPut方法');
}
// 调用对象obj1下面的outPut方法
obj1.outPut();

当值为函数时,那么对象下面绑定的就是方法,使用函数的作用厉害之处,除了可以复用代码,另一个就是可以接收传递参数

02

方法2-使用构造器函数创建对象

创建构造器函数创建对象也是一种创建对象的方法,代码如下所示

代码语言:javascript
复制
// 使用function 创建一个对象
function CreateObj() {   // 声明创建对象的funciton,类似class,首字母大写 
   this.url = "itclan.cn";  
   this.webSite = function() {
      alert("我是通过构造器创建出来的方法");
   }
}

var obj2 = new CreateObj() // 通过new关键字,调用createObj(),实例化一个obj2对象
obj2.webSite();            // 调用构造器函数下面实例的方法

使用构造器函数创建对象,也是一种方式,其中,构造器函数内的this指向的是这个实例化对象obj2

03

方法3-使用new Object()

使用new Object()的形式创建对象,等价于{},Object是顶级对象

代码语言:javascript
复制
var obj3 = new Object()
obj3.age = 20;
obj3.webSite = function() {
    alert("我是通过new Object()创建出来的方法,被调用了的");
}

// 调用对象的函数/方法
obj3.webSite();

总结

创建对象,有三种方式,其中第一种字面量创建对象的方式最常见和简单,直观,每一种方式创建对象都有自己的好处,比如动态的设置参数,那么就只能用第二种和第三种的

本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2023-02-03,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 itclanCoder 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 前言
  • 总结
相关产品与服务
对象存储
对象存储(Cloud Object Storage,COS)是由腾讯云推出的无目录层次结构、无数据格式限制,可容纳海量数据且支持 HTTP/HTTPS 协议访问的分布式存储服务。腾讯云 COS 的存储桶空间无容量上限,无需分区管理,适用于 CDN 数据分发、数据万象处理或大数据计算与分析的数据湖等多种场景。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档