getter 和 setter:

  1、ES5 里,属性值可以用一个或两个方法代替,这两个方法就是 getter 和 setter,它们使用 get 和 set 进行定义而不是通过 function

  2、由 getter 和 setter 定义的属性称作 “存取器属性”,它不同于“数据属性”,数据属性只有一个简单的值

  3、当查询存取器属性的值时,JavaScript 调用 getter 方法(无参),并由它返回属性存取表达式的值

  4、当设置一个存取器属性的值时,JavaScript 调用 setter 方法,并将赋值表达式右侧的值当作参数传给 setter

let obj = {
x: 1,
y: 1, // 注意 getter 和 setter 没有使用冒号,但函数体结束和下一个方法或数据属性之间有逗号隔开
// 设置一个可读写属性 result
get result() {
return this.x+"+"+this.y+"i";
},
set result(arr) { // 需要参数
if (arr.length != 2)
throw RangeError();
this.x = arr[0];
this.y = arr[1];
}, // 设置一个只写属性 add
set add(arr) {
if (arr.length != 2)
throw RangeError();
this.x += arr[0];
this.y += arr[1];
return this.x+"+"+this.y+"i";
}
} console.log(obj.result); // 使用 getter,输出 1+1i
obj.add = [1, 2]; // 使用 setter
console.log(obj.result); // 输出 2+3i
obj.result = [3, 4];
console.log(obj.result); // 输出 3+4i

注:读取只写属性总是返回 undefined

属性的特征:

  1、除了包含名字和值之外,属性还包含一些标识它们可写、可枚举和可配置的特性

  2、数据属性的 4 个特性:值、可写性、可枚举性和可配置性

  3、存取器特性:读取、写入、可枚举和可配置

  4、数据属性的描述符对象:value、writable、enumerable 和 configurable;存取器属性则用 get 和 set 属性代替 value 和 writable

  5、writable、enumerable 和 configurable 都是布尔值,而 get 和 set 是函数值

  6、通过 Object.getOwnPropertyDescriptor(obj, p) 可获得某个对象特定属性的属性描述符

  7、通过 Object.defineProperty(obj, p, attr) 设置或新建属性的特性,Object.defineProperties(obj, map) 修改或新建多个属性特性

  8、Object.getOwnPropertyDescriptor() 和 Object.defineProperty() 都不能修改继承来的属性

// 通过 Object.getOwnPropertyDescriptor() 可获得某个对象特定属性的属性描述符
console.log(Object.getOwnPropertyDescriptor({x: 1}, "x"));
console.log(Object.getOwnPropertyDescriptor({}, "toString")); // undefined // defineProperty(obj, p, attr) 设置、新建属性
// defineProperties(obj, map)
let o = {};
// 新建多个属性特性
Object.defineProperties(o, {
x: {value: 1, writable: false, enumerable: true},
y: {value: 2, enumerable: true},
z: {value: 3, configurable: true, enumerable: true}
});
console.log(Object.getOwnPropertyDescriptor(o, "x"));
console.log(o.x);
// 把它修改成可修改的
Object.defineProperty(o, "x", {writable: true});
console.log(Object.getOwnPropertyDescriptor(o, "x"));

对象的三个属性:

  1、原型属性:在实例对象创建之初就设置好的,用来继承属性的,可通过将对象作为参数传入 Object.getPrototypeOf() 来查询它的原型

  2、类属性:是一个字符串,用以表示对象的类型信息,只有一种间接方法可以查询它(toString())

  3、可扩展性:用以表示是否可以给对象添加新属性,通过将对象传入 Object.isExtensible(),来判断该对象是否可扩展;通过将对象传入 Object.preventExtensions() 把其转换为不可扩展(无法转换回可扩展);Object.seal() 除了能将对象设置为不可扩展,还可以将对象的所有自有属性都设置为不可配置;Object.isSealed() 来检测对象是否封闭;Object.freeze() 将对象设置为不可扩展和属性不可配置,同时将自有的所有数据属性设置为只读,存取器属性(setter)不受影响

console.log(Object.getPrototypeOf(o));  // 输出 o 的原型 {}
console.log(Object.prototype.toString.call(o).slice(8, -1)); // 输出 "Object"
console.log(Object.prototype.toString.call([]).slice(8, -1)); // 输出 "Array"
console.log(Object.isExtensible(o)); // 判断对象 o 是否可扩展,输出 true
Object.preventExtensions(o); // 将对象转换为不可扩展
console.log(Object.isExtensible(o)); // 输出 false

序列化对象:

  1、我们可以将对象的状态转换为字符串,也可以将字符串还原为对象,ES5 提供了内置函数 JSON.stringify()JSON.parse() 来序列化和还原对象

  2、JSON 的语法是 JavaScript 语法的一个子集,它并不能表示 JavaScript 里所有的值

  3、JSON.stringify() 只能序列化对象可枚举的自有属性

// 若属性里有不可枚举的,则不把它进行转换
let str = JSON.stringify(o);
// 输出 contend: '{"x": 1, "y": 2, "z": 3}' type: string
console.log("contend:", str, "\t type: ", typeof str); let ser = JSON.parse(str); // 转换成对象
// 输出 contend: {x: 1, y: 2, z: 3} type: object
console.log("contend:", ser, "\t type: ", typeof ser);

对象方法:

  1、toString() 方法:无参,返回一个表示调用这个方法的对象值的字符串

  2、toLocaleString() 方法:返回一个表示这个对象的本地化字符串

  3、toJSON() 方法:如果在待序列化的对象中存在这个方法,则调用它,返回一个序列化结果,而不是原始对象

  4、valueOf() 方法:将对象转换为某种原始值而非字符串

console.log(o.toString().slice(8, -1));
console.log(o.toLocaleString().slice(8, -1));
try {
o.toJSON();
} catch(e) {
// 若 toJSON 并未被定义,则会产生 TypeError
console.log("TypeError");
}
console.log(o.valueOf());

JavaScript 对象(下)的更多相关文章

  1. 探究javascript对象和数组的异同,及函数变量缓存技巧

    javascript中最经典也最受非议的一句话就是:javascript中一切皆是对象.这篇重点要提到的,就是任何jser都不陌生的Object和Array. 有段时间曾经很诧异,到底两种数据类型用来 ...

  2. javaScript对象-基本包装类型的详解

    本人按书上的内容大致地把javaScript对象划分成“引用类型”.“基本包装类型”和“内置对象”三块内容. 我们这篇先了解下基本包装类型的详细用法吧! 一.我们先解下相关概念: 1.引用类型的值(对 ...

  3. 如何理解javaScript对象?

    在我们生活中,常常会提到对象一词,如:你找到对象了吗?你的对象是谁呀?等等. 在我们家庭中,有男友的女青年都会说我有对象了,那么她的对象是XX(她的男友). 夫妻间呢?都会说我的爱人是谁谁谁,现在我们 ...

  4. 简述JavaScript对象、数组对象与类数组对象

    问题引出 在上图给出的文档中,用JavaScript获取那个a标签,要用什么办法呢?相信第一反应一定是使用document.getElementsByTagName('a')[0]来获取.同样的,在使 ...

  5. 深入理解javascript对象系列第二篇——属性操作

    × 目录 [1]查询 [2]设置 [3]删除[4]继承 前面的话 对于对象来说,属性操作是绕不开的话题.类似于“增删改查”的基本操作,属性操作分为属性查询.属性设置.属性删除,还包括属性继承.本文是对 ...

  6. web前端学习(二) javascript对象和原型继承

    目录 1. JavaScrpt对象 2. 原型对象和继承 3. 对象的克隆 (1)javascript对象 在JS中,对象是属性的容器.对于单个对象来说,都由属性名和属性值构成:其中属性名需要是标识符 ...

  7. 如何判断Javascript对象是否存在

    Javascript语言的设计不够严谨,很多地方一不小心就会出错. 举例来说,请考虑以下情况. 现在,我们要判断一个全局对象myObj是否存在,如果不存在,就对它进行声明.用自然语言描述的算法如下: ...

  8. JavaScript 对象、DOM对象、jquery对象的区别、转换详解

    一.JavaScript 对象 JavaScript 提供多个内建对象,比如 String.Date.Array 等等. 对象只是带有属性和方法的特殊数据类型. 访问对象的属性: [javascrip ...

  9. 关于javascript对象的简单记忆法

    关于javascript对象方法的简单记忆法(个人整理) string对象: 大号小号闪烁加链接./big/small/blink/link/ 粗体斜体打字删除线./bold/italics/fixe ...

  10. JavaScript基础——使用JavaScript对象

    JavaScript有许多内置对象,如Number(数字).Array(数组).String(字符串).Date(日期)和Math(数学).这些内置对象都有成员属性和方法.除了JavaScript对象 ...

随机推荐

  1. Python并发解决方案

    一.subprocess模块 call():执行命令,返回程序返回码(int) import subprocess print(subprocess.call("mspaint") ...

  2. php的运行原理、cgi对比fastcgi以及php-cgi和php-fpm之间的联系区别

    最近项目中本地测试环境遇到了windows环境下的nginx使用file_get_contents/curl访问php文件导致的阻塞问题,一直在找解决的方案,这个问题研究了三天终于找到了解决方案,特别 ...

  3. 非WifI环境处理

    //1.创建网络状态监测管理者 AFNetworkReachabilityManager *mangerStatus = [AFNetworkReachabilityManager sharedMan ...

  4. tomcat启动,但是访问不了可能的一种状况。

    Tomcat启动但是访问http://localhost:8080/或者http://127.0.0.1:8080/ 访问不了的时候, 有可能是因为你用了代理,把代理去掉就可以了

  5. Firefox 调试 JavaScript 代码

    第一步  新建 html 或者 jsp 文件 文件内容 <!DOCTYPE html> <html> <head> <meta charset="u ...

  6. 从阿里巴巴面试题到java类加载机制

    首先很经典的阿里巴巴面试题 加上我自己的一些疑惑代码 public class Text { public static int k = 0; public final int k1 = 3; //自 ...

  7. Appium+Python自动化 3 -获取 app 包名和 activity

    方法一: ①手机通过USB连接电脑 ②打开手机上被测app ③在电脑上 dos命令窗口,输入命令 adb shell dumpsys window w | findstr \/ | findstr n ...

  8. Failed to mount component: template or render function not defined.

    Failed to mount component: template or render function not defined. vue-loader13.0有一个变更就是默认启用了esModu ...

  9. JQuery跳出each循环的方法

    一.jquery each循环,要实现break和continue的功能: break----用return false; continue --用return ture; 二.jquery怎么跳出当 ...

  10. Git系列:第七篇-Maven项目下提交时忽略不必要的文件或文件夹

    用.gitignore文件来进行忽略不必要的文件或文件夹 在开发中我们要提交的内容大都是src里的全部文件(java文件).gitignore(忽略文件)pom.xml(maven配置文件)----- ...