JavaScript 对象(上)
简述:
1、是 JavaScript 的基本类型
2、是一种复合值,可通过名字访问这些值
3、可看作属性的无序集合,每个属性都是一个名/值对(属性名是字符串或标识符)
4、可以从一个称为原型的对象继承属性(核心特征)
5、是动态的,可新增或删除属性,操作对象是通过引用而不是值
6、属性名可以是包含空字符在内的任意字符串,但对象中不能存在两个或多个同名属性;非严格模式下允许,但后者会覆盖前者的值
注:除了字符串、数字、true、false、null 和 undefined 之外,JavaScript 中的值都是对象
原型:
1、大部分 JavaScript 对象都和另一个对象(原型)相关联,每个对象都从原型继承属性
2、可以通过 JavaScript 代码 Object.prototype 获得对其原型对象的引用
3、所有通过对象直接量创建的对象都具有同一个原型对象,使用相同构造函数的对象也具有同一个原型对象
4、所有的内置构造函数(以及大部分自定义的构造函数)都具有一个继承自 Object.prototype 的原型
5、一个普通对象的原型可能也有原型,而这一系列链接的原型对象就是”原型链“
创建对象:
1、对象直接量:由若干名/值对组成的映射表,名/值对中间用冒号分隔,名/值对之间用逗号分隔,整个映射表用花括号括起来
- // 对象里面的属性值可以是对象
- let obj = {"name": "Yam", "other": {"weight": "yyy", "high": "xxx"}, "age": 200};
- console.log(obj["other"]["high"]); // 输出 xxx
console.log(obj.other.high);
注:对象直接量是一个表达式,这个表达式的每次运算都创建并初始化一个新的对象
2、关键字 new:关键字后跟随一个函数(构造函数)调用,用以初始化一个新创建的对象
- let arr = new Array(); // 创建一个空数组
- let date = new Date(); // 创建一个表示当前时间的 Date 对象
3、Object.create(proto [, more]):创建一个新对象,第一个参数为这个对象的原型,第二个参数可对对象的属性进行进一步描述
- // ES5 定义的
- let obj = Object.create({"x": 1, "y": 2});
- console.log(obj.x); // 输出 1
属性查询和设置:
- // inherit 函数来自 JavaScript 权威指南
- function inherit(p) {
- if (p == null)
- throw TypeError();
- if (Object.create)
- return Object.create(p);
- let t = typeof p;
- if (t != "object" && t != "function")
- throw TypeError();
- function f() {}; // 定义一个空构造函数
- f.prototype = p;
- return new f(); // 使用 f() 创建 p 的继承对象
- }
- let o = {};
- o.x = 1;
- let p = inherit(o);
- p.y = 2;
- // 属性赋值操作首先会检查原型链,以此判断是否允许赋值
- // 赋值时也只是在原始对象上创建属性或对已有属性赋值,而不会修改原型链
- // 属性赋值要么失败,要么创建一个属性,要么在原始对象中设置属性
- p.x = 3;
- console.log(o.x); // 输出 1
- // 属性访问可以通过点或方括号来操作
- console.log(p["x"] + p.y); // 输出 5
- // 非严格模式下查询一个不存在的属性并不会报错
- console.log(p.z);
- // 但如果对象本身不存在,那么查询这个不存在的对象的属性就会报错(undefined、null)
- // console.log(p.z.i); // 报错
注: 1、不能给只读属性重新赋值
2、不能通过同名自有属性覆盖只读的继承属性
3、如果对象 obj 不可扩展,那么不能在 obj 中定义新属性
删除属性:
1、delete 运算符可以删除对象的属性,但只是断开属性和宿主对象的联系,而不会去操作属性中的属性
2、delete 运算符只能删除自有属性,而不能删除继承属性
3、delete 删除成功或者没有任何副作用时,它返回 true;若它后面不是一个属性访问表达式,同样会返回 true!!!
4、不能删除那些可配置性为 false 的属性,但可以删除不可扩展对象的可配置属性,非严格模式下返回 false,严格模式报错
- let par = {"q": 10};
- let a = Object.create(par);
- a.p = {"x": 1};
- let b = a.p;
- delete a.p; // delete 只断开属性和宿主对象的联系,而不会去操作属性中的属性,可能会造成内存泄漏
- console.log(b.x); // 输出 1
- console.log(delete a.q); // 什么也没做,输出 true
- console.log(a.q); // 输出 10
- console.log(delete a.t); // 输出 true
- console.log(delete 20); // 输出 true
- console.log(delete Object.prototype); // 输出 false
- console.log(delete b); // 删除一个通过变量声明或函数声明(var 和 let)的对象会返回 false
检测属性:
1、运算符 in:左侧为属性名,右侧为对象,若对象的自有属性或继承属性中包含这个属性,则返回 true
2、hasOwnProperty() 方法:检测给定属性是不是对象的自有属性
3、propertyIsEnumerable() 方法:检测属性是不是自有属性且可枚举
- // 若对象的自有属性或继承属性中包含这个属性,则返回 true
- let ino = {"x": 1};
- console.log("x" in ino); // true
- console.log("toString" in ino); // true
- console.log("y" in ino); // false
- // 检测给定属性是不是对象的自有属性
- console.log(ino.hasOwnProperty("toString")); // false
- // 检测属性是不是自有属性且可枚举
- console.log(ino.propertyIsEnumerable("x")); // true
- console.log(Object.prototype.propertyIsEnumerable("toString")); // 不可枚举,false
注:可以使用 "attr !== undefined;" 来判断属性是否存在,但若属性存在且值为 undefined,则只能使用 in
枚举属性:
1、for/in 循环可以在循环体中遍历对象中所有可枚举的属性(包括自有属性和继承属性),并把属性名赋值给循环变量
2、ES5 定义了 Object.keys(),它返回一个由对象中可枚举的自有属性的名称组成的数组
3、ES5 定义了 Object.getOwnPropertyNames(),它返回对象的所有自有属性的名称,而不仅仅是可枚举属性
- let foro = {"x": 1, "y": 2};
- for (let temp in foro)
- console.log(temp); // 输出 x y
- console.log(Object.keys(foro)); // 输出 ['x', 'y']
- console.log(Object.getOwnPropertyNames(Object.prototype));
JavaScript 对象(上)的更多相关文章
- 深入JavaScript对象(Object)与类(class),详细了解类、原型
JavaScript基于原型的对象机制 JavaScript原型上的哪些事 一.JavaScript基于原型的对象机制 JavaScript对象是基于原型的面向对象机制.在一定程度上js基于原型的对象 ...
- Javascript进阶篇——( JavaScript内置对象---上-Date,string,charAt,indexOf,split,substring,substr)笔记整理
什么是对象JavaScript 中的所有事物都是对象,如:字符串.数值.数组.函数等,每个对象带有属性和方法.对象的属性:反映该对象某些特定的性质的,如:字符串的长度.图像的长宽等:对象的方法:能够在 ...
- Effective JavaScript Item 51 在类数组对象上重用数组方法
Array.prototype对象上的标准方法被设计为也能够在其他对象上重用 - 即使不是继承自Array的对象. 因此,在JavaScript中存折一些类数组对象(Array-like Object ...
- 你不知道的JavaScript(上)this和对象原型(一)
第一章 关于this 1.this 既不指向函数自身也不指向函数的词法作用域 2.this 实际上是在函数被调用时发生的绑定,它指向什么完全取决于函数在哪里被调用(调用位置). 第二章 this全面 ...
- 你不知道的JavaScript(上)this和对象原型(二)
第三章 对象 1.语法 两种形式定义:声明(文字)形式和构造形式 (1)文字语法大概是这样 1 var myObj = { 2 key: value 3 // ... 4 }; (2)构造形式大概是这 ...
- 《你必须知道的javascript(上)》- 2.this与对象原型
1 关于this 1.1 为什么使用this 随着你的使用模式越来越复杂,显式传递上下文对象会让代码变得越来越混乱,使用this则不会这样.当我们介绍对象和原型时,你就会明白函数可以自动引用合适的上下 ...
- Effective JavaScript Item 36 实例状态仅仅保存在实例对象上
本系列作为EffectiveJavaScript的读书笔记. 一个类型的prototype和该类型的实例之间是"一对多"的关系.那么,须要确保实例相关的数据不会被错误地保存在pro ...
- javaScript对象-基本包装类型的详解
本人按书上的内容大致地把javaScript对象划分成“引用类型”.“基本包装类型”和“内置对象”三块内容. 我们这篇先了解下基本包装类型的详细用法吧! 一.我们先解下相关概念: 1.引用类型的值(对 ...
- 如何理解javaScript对象?
在我们生活中,常常会提到对象一词,如:你找到对象了吗?你的对象是谁呀?等等. 在我们家庭中,有男友的女青年都会说我有对象了,那么她的对象是XX(她的男友). 夫妻间呢?都会说我的爱人是谁谁谁,现在我们 ...
随机推荐
- log4j.properties配置与将异常输出到Log日志文件实例
将异常输出到 log日志文件 实际项目中的使用: <dependencies> <dependency> <groupId>org.slf4j</groupI ...
- laravel和lumen数据库链接错误_FatalErrorException Call to a member function connection
FatalErrorException in Model.php line 3339: Call to a member function connection() on null 挺简单的一个lum ...
- python3 第三十三章 - 标准库概览Part II
第二部分提供了更高级的模块用来支持专业编程的需要.这些模块很少出现在小型的脚本里. 1. 输出格式化reprlib 模块提供了一个用来缩写显示大型或深层嵌套容器的 定制版repr() . >&g ...
- ----constructor 与 object----
CONSTRUCTOR constructor是一种特殊的object,同样是用来创建和声明一个类 语法规则: constructor([arguments]) { ... } 注意: 1.在类中,只 ...
- Percona XtraBackup使用说明(转)
Percona XtraBackup使用说明 转载出自: https://blog.csdn.net/wfs1994/article/details/80396604 XtraBackup介绍 Per ...
- 从知乎首页用户操作入口学习到的CSS技巧 - 合理利用伪元素实现一些装饰样式
最近在模仿做一个静态的PC版知乎,在模仿的过程中,从知乎工程师的方法中学到了不少知识,比如CSS方面的,以下介绍一个今天学到的伪元素的技巧. 示例 DOM结构为: <div class=&quo ...
- orm单表查询和模糊查询
一.单表查询 1. 返回queryset对象的查询 all() 以列表形式返回全部queryset对象 filter(**kwargs) 筛选 exclude(**kwargs) 排除 reverse ...
- python-mysql驱动64位
安装Python-MySQL驱动一直没有成功: https://pypi.python.org/pypi/MySQL-python/1.2.5#downloads 上面网站下的版本安装都不能通过 提示 ...
- Oracle去除重复(某一列的值重复),取最新(日期字段最新)的一条数据
转自 : http://blog.csdn.net/nux_123/article/details/45037719 问题:在项目中有一张设备检测信息表DEVICE_INFO_TBL, 每个设备每天都 ...
- ruby module extend self vs module_funciton
最近学习ruby过程中,extend self 跟 module_function 傻傻分不清楚,查资料后明白之间的差别,虽记录之,原文地址 github module A extend self d ...