广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >一篇文章带你了解JavaScript-对象
  • 419
分享到

一篇文章带你了解JavaScript-对象

2024-04-02 19:04:59 419人浏览 薄情痞子
摘要

目录创建对象对象直接量通过new创建对象原型Object.create()属性的查询和设置继承属性访问错误删除属性检测属性序列化对象总结创建对象 对象直接量 对象直接量是由若干名/值

创建对象

对象直接量

对象直接量是由若干名/值对组成的映射表,名/值对中间用冒号分隔,名/值对之间用逗号分隔,整个映射表用花括号括起来。


var empty = {};
var point = { x:0, y:0};
var point2 = {x:point.x, y:point.y+1};
var book = {
	"main title":"javascript",
	//属性名字里有空格,必须用字符串表示
	"sub-title":"The",
	//属性名字里有连字符,必须用字符串表示
	"for":"all",
	//"for"是保留字,必须用字符串表示
	author:{
	//这个属性的值是一个对象
		name:"123"
		//注意,在里的属性名都没有引号
	}
};

通过new创建对象


var o = new Object();
//创建一个空对象,和{}一样
var a = new Array();
//创建一个空数组,和[]一样
var d = new Date();
//创建一个表示当前时间的Date对象
var r = new RegExp("js");
//创建一个可以进行匹配的RegExp对象

原型

所有通过对象直接量创建的对象都具有同一个原型对象,并可以通过JavaScript代码Object.prototype获得对原型对象的引用。通过关键字new和构造函数调用创建的对象的原型就是构造函数的prototype属性的值。因此,同使用{}创建对象一样,通过new Object()创建的对象也继承自Object.prototype。同样,通过new Array()创建的对象的原型就是Array.prototype,通过new Date()创建的对象的原型就是Date.prototype。

没有原型的对象为数不多,Object.prototype就是其中之一。它不继承任何属性。其他原型对象都是普通对象,普通对象都具有原型。所有的内置构造函数(以及大部分自定义的构造函数)都具有一个继承自Object.prototype的原型。例如,Date.prototype的属性继承自Object.prototype,因此由new Date()创建的Date对象的属性同时继承自Date.prototype和Object.prototype。这一系列链接的原型对象就是所谓的“原型链”(prototype chain)。

Object.create()

创建一个新对象,其中第一个参数是这个对象的原型。Object.create()提供第二个可选参数,用以对对象的属性进行进一步描述。

Object.create()是一个静态函数,而不是提供给某个对象调用的方法。使用它的方法很简单,只须传入所需的原型对象即可:


var AB = Object.create({x:1,y:2});

属性的查询和设置


var a = book.author;
//得到book的"author"属性
book.edition = 6;
//给book创建一个名为"edition"的属性并赋值
book["main title"] = "123"
//给"main title"属性赋值

继承

假设要查询对象o的属性x,如果o中不存在x,那么将会继续在o的原型对象中查询属性x。如果原型对象中也没有x,但这个原型对象也有原型,那么继续在这个原型对象的原型上执行查询,直到找到x或者查找到一个原型是null的对象为止。


var o = {}
o.x = 1;//给o定义一个属性x
var p = inherit(o);//p继承o
p.y = 2;//给p定义一个属性y
var q = inherit(p);//q继承p
q.z = 3;//给q定义一个属性z
q.x + q.y // 3 x和y分别继承自o和p

属性赋值操作首先检查原型链,以此判定是否允许赋值操作。如果允许属性赋值操作,它也总是在原始对象上创建属性或对已有的属性赋值,而不会去修改原型链。


var u = { r:1 };
var c = inherit(u);
c.x = 1; c.y =1;
c.r =2;
u.r;  // 1 原型对象没有修改

属性访问错误

当book没有a属性


book.a // undefined
var l = book.a.length;
//抛出一个类型错误异常,undefined没有属性

删除属性

delete运算符可以删除对象的属性。


delete book.author;
//book不再有属性author
delete book["main title"];
//book不再有属性"main title"

delete运算符只能删除自有属性,不能删除继承属性(要删除继承属性必须从定义这个属性的原型对象上删除它,而且这会影响到所有继承自这个原型的对象)。

当delete表达式删除成功或没有任何副作用(比如删除不存在的属性)时,它返回true。如果delete后不是一个属性访问表达式,delete同样返回true:


o = {x:1};
delete o.x; //删除x,返回true
delete o.x; //什么都没做(x已经不存在了),返回true
delete  o.toString; //什么也没做(toString是继承来的),返回true
delete 1; //无意义,返回true

delete不能删除那些可配置性为false的属性
在这些情况下的delete操作会返回false:


delete Object.prototype;//不能删除,属性是不可配置的
var x = 1; //声明一个全局变量
delete this.x; //不能删除这个属性
function f (){}//声明一个全局函数
delete this.f; //也不能删除全局函数

检测属性

in运算符的左侧是属性名(字符串),右侧是对象。如果对象的自有属性或继承属性中包含这个属性则返回true:


var o = { x:1 }
"x" in o; //true "x"是o的属性
"y" in o; //false "y"不是o的属性
"toString" in o; //true o继承toString属性

对象的hasOwnProperty()方法用来检测给定的名字是否是对象的自有属性。对于继承属性它将返回false:


var o = { x:1 }
o.hasOwnProperty("x");//true o有一个自有属性x
o.hasOwnProperty("y");//false o中不存在属性y
o.hasOwnProperty("toString");//false toString是继承属性

propertyIsEnumerable()是hasOwnProperty()的增强版,只有检测到是自有属性且这个属性的可枚举性(enumerable attribute)为true时它才返回true。


var o = inherit({ y:2});
o.x = 1;
o.propertyIsEnumerable("x"); //true o有一个可枚举的自有属性x
o.propertyIsEnumerable("y"); //false y是继承来的
Object.propertyIsEnumerable("toString"); //false 不可枚举

除了使用in运算符之外,另一种更简便的方法是使用“!==”判断一个属性是否是undefined:


var o = { x:1 }
o.x !== undefined; //true o中有属性x
o.y !== undefined; //false o中没有属性y
o.toString !== undefined; //true o继承了toString属性

序列化对象

对象序列化(serialization)是指将对象的状态转换为字符串,也可将字符串还原为对象。ECMAScript 5提供了内置函数JSON.stringify()和JSON.parse()用来序列化和还原JavaScript对象。这些方法都使用JSON作为数据交换格式,JSON的全称是“JavaScript Object Notation”


o = {x:1, y:{z:[false,null,""]}};
s = JSON.stringify(o);
//s是'{"x":1,"y":{"z":[false,null,""]}}'
p = JSON.parse(s);
// p == o

总结

本篇文章就到这里了,希望能给你带来帮助,也希望您能够多多关注编程网的更多内容!

--结束END--

本文标题: 一篇文章带你了解JavaScript-对象

本文链接: https://www.lsjlt.com/news/132634.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 一篇文章带你了解JavaScript-对象
    目录创建对象对象直接量通过new创建对象原型Object.create()属性的查询和设置继承属性访问错误删除属性检测属性序列化对象总结创建对象 对象直接量 对象直接量是由若干名/值...
    99+
    2022-11-12
  • 一篇文章带你了解JAVA面对对象应用
    目录常用APIString类关于String为啥不可改变StringBuilder类String、StringBuffer 和 StringBuilder 的区别:ArrayList...
    99+
    2022-11-12
  • 一篇文章带你了解JavaScript-语句
    目录表达式语句复合语句和空语句复合语句空语句声明语句varfunction条件语句ifif/elseelse ifswitch循环whiledo/whileforfor/in跳转标签...
    99+
    2022-11-12
  • 一篇文章带你深入了解Java对象与Java类
    目录1.面向对象是什么?2.Java类1.什么是类2.Java类类的结构Java类的格式3.java对象4.类和对象5.类中的变量,方法1.变量分类成员变量:局部变量:2.方...
    99+
    2022-11-12
  • 一篇文章带你了解Java基础-抽象
    目录Java基础知识(抽象)抽象抽象定义abstract的使用定义抽象类抽象类的一些注意点总结Java基础知识(抽象) 抽象 抽象是从众多的事物中抽取出共同的、本质性的特征,而舍弃...
    99+
    2022-11-12
  • 一篇文章带你详细了解JavaScript数组
    目录一、数组的作用:二、数组的定义:1.通过构造函数创建数组2.通过字面量的方式创建数组三、数组元素四、数组长度五、数组索引(下标)六、数组注意的问题1.数组中存储的数据可以是不一样...
    99+
    2022-11-12
  • 一篇文章带你了解C++面向对象编程--继承
    目录C++ 面向对象编程 —— 继承总结C++ 面向对象编程 —— 继承 "Shape" 基类 class Shape { public: Shape() { // 构造函数...
    99+
    2022-11-12
  • 一篇文章带你了解JavaScript的解构赋值
    目录1. 什么是解构赋值 ?2. 数组的解构赋值2.1) 数组解构赋值的默认值2.2) 数组解构赋值的应用类数组中的应用交换变量的值3. 对象的解构赋值...
    99+
    2022-11-13
  • 一篇文章带你了解JavaScript的包装类型
    目录1、简介2、String1、创建语法2、常用方法3、更多方法3、Number1、语法2、属性3、常用方法4、Boolean总结1、简介 【解释】: 在 JavaScri...
    99+
    2022-11-13
  • 一篇文章带你了解初始Spring
    目录为什么要使用SpringSpring概述Spring容器使用流程1.启动容器2.完成bean的初始化3.注册bean到容器中4.装配bean的属性bean的注册bean属性注入总...
    99+
    2022-11-12
  • 一篇文章带你了解Java SpringBoot Nacos
    目录1、什么是Nacos 1.1与eureka对比1.2与zookeeper对比1.3与springcloud config 对比 2、Spring Cloud Alibaba 套件...
    99+
    2022-11-12
  • 一篇文章带你了解Java Stream流
    目录一、Stream流引入现有一个需求:1.用常规方法解决需求2.用Stream流操作集合,获取流,过滤操作,打印输出二、Stream流的格式三、获取流四、Stream流的常用方法方...
    99+
    2022-11-12
  • 一篇文章带你了解XGBoost算法
    目录1. 什么是XGBoost1.1 XGBoost树的定义1.2 正则项:树的复杂度1.3 树该怎么长1.4 如何停止树的循环生成2. XGBoost与GBDT有什么不同3. 为什...
    99+
    2022-11-12
  • 一篇文章带你了解jQuery动画
    目录1.控制元素的显示与隐藏 show() hide()2.控制元素的透明度 fadeIn() fadeOut()3:控制元素的高度 slideUp() slideDown()总结 ...
    99+
    2022-11-12
  • 一篇文章带你了解vue路由
    目录概念Vue Router简介Vue Router的特性Vue Router的使用步骤分类嵌套路由动态路由命名路由编程式导航总结概念 路由的本质就是一种对应关系,比如说我们在url...
    99+
    2022-11-13
  • 一篇文章带你了解JAVA面对对象三大特征之封装
    目录面对对象的三大特征: 封装、继承、多态封装继承多态类和对象关于类关于对象三大特征第一封装关于封装思想 :private关键字this关键字构造方法构造方法注意事项总结面对对象的三...
    99+
    2022-11-12
  • 一篇文章带你了解JAVA面对对象之继承与修饰符
    目录Java面向对象之继承与修饰符继承1.含义2.实现3.好处4.短处5.成员变量的访问特点6.super () 方法7.继承中结构方法的访问特点8.方法重写9.java继承的注意事...
    99+
    2022-11-12
  • 一篇文章带你入门java面向对象
    目录一、继承示例:二、重载三、接口1、接口与类相似点:2、接口与类的区别:3、语法四、枚举1、定义2、迭代枚举元素3、在 switch 中使用枚举类总结一、继承 继承就是子类继承父类...
    99+
    2022-11-12
  • 一篇文章带你了解C语言内存对齐
    目录内存对齐三、在内存对齐话题下的sizeof与offsetof宏3.1、sizeof3.2、offsetof宏3.3、Debug总结内存对齐 先看如下代码: 结构体Test1...
    99+
    2022-11-12
  • 一篇文章带你了解SpringBoot Web开发
    目录SpringBoot Web开发静态资源定制首页thymeleaf模板引擎1、导入依赖2、controller书写源码分析Thymeleaf语法基本语法:MVC配置原理总结Spr...
    99+
    2022-11-12
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作