对象的扩展

1、属性的简洁表示法

es6 允许直接写入变量和函数,作为对象的属性和方法

// 简洁表示法 ---> 变量
  let o=1;
  let k=2;
  let es5={
    o:o,
    k:k
  };
  let es6={
    o,
    k
  };
  console.log(es5,es6);   // {o:1, k:2}  {o:1, k:2}

// 简洁表示法 ---> 函数
let es5_method={
    hello:function(){
      console.log(‘hello‘);
    }
  };
  let es6_method={
    hello(){
      console.log(‘hello‘);
    }
  };
  console.log(es5_method.hello(),es6_method.hello());   // hello  hello

2、属性名表达式

js 定义对象的属性有两种方法

// 方法一  字面量
obj.foo = true;

// 方法二  表达式
obj[‘a‘ + ‘bc‘] = 123;

es6 允许字面量定义对象时,用表达式作为对象的属性名,即把表达式放在方括号内

let propKey = ‘foo‘;

let obj = {
  [propKey]: true,
  [‘a‘ + ‘bc‘]: 123
};

console.log(obj);   // {foo: true, abc: 123}

let a=‘b‘;
  let es5_obj={
    a:‘c‘,
    b:‘c‘
  };

let es6_obj={
   [a]:‘c‘
}

console.log(es5_obj,es6_obj);   //  {a: "c", b: "c"} {b: "c"}

3、Object.is()

Object.is 方法用来比较两个值是否严格相等,与严格比较运算符(===)的行为基本一致

Object.is(‘foo‘, ‘foo‘)   // true

Object.is({}, {})   // false

不同之处只有两个:一是+0不等于-0,二是NaN等于自身

+0 === -0   // true
NaN === NaN   // false

Object.is(+0, -0)    // false
Object.is(NaN, NaN)    // true

4、Object.assign()

Object.assign方法用于对象的合并,将源对象(source)的所有可枚举属性,复制到目标对象(target)

Object.assign方法的第一个参数是目标对象,后面的参数都是源对象

var target = { a: 1 };

var source1 = { b: 2 };
var source2 = { c: 3 };

Object.assign(target, source1, source2);
target    // {a:1, b:2, c:3}

console.log(Object.assign({a:‘a‘},{b:‘b‘}))   // {a: "a", b: "b"}

注意点:

(1)、如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性

var target = { a: 1, b: 1 };

var source1 = { b: 2, c: 2 };
var source2 = { c: 3 };

Object.assign(target, source1, source2);
target    // {a:1, b:2, c:3}

(2)、如果只有一个参数,Object.assign会直接返回该参数

var obj = {a: 1};
Object.assign(obj) === obj    // true

(3)、如果该参数不是对象,则会先转成对象,然后返回

typeof Object.assign(2)    // "object"

(4)、由于undefined和null无法转成对象,所以如果它们作为参数,就会报错

Object.assign(undefined)    // 报错 Cannot convert undefined or null to object
Object.assign(null)    // 报错 Cannot convert undefined or null to object

(5)、Object.assign方法实行的是浅拷贝,而不是深拷贝。也就是说,如果源对象某个属性的值是对象,那么目标对象拷贝得到的是这个对象的引用

var obj1 = {a: {b: 1}};
var obj2 = Object.assign({}, obj1);

obj2.a.b    // 1

var obj1 = {a: {b: 1}};
var obj2 = Object.assign({}, obj1);

obj1.a.b = 2;
obj2.a.b    // 2

上面代码中,源对象obj1的a属性的值是一个对象,Object.assign拷贝得到的是这个对象的引用。这个对象的任何变化,都会反映到目标对象上面

时间: 2024-11-07 13:17:53

对象的扩展的相关文章

atitit.编程语言 类与对象的 扩展机制.doc

atitit.编程语言 类与对象的 扩展机制.doc 1.1. Java 下一代: 没有继承性的扩展1 1.2. 继承1 1.3. 使用cglib动态为Java类添加方法1 1.4. 工具类 1 1.5. Wrap 包装类  装饰器模式2 1.6. 扩展方法 (其实就是工具类的语法糖)2 1.7. Scala 的隐式转换2 1.8. 类别类.ExpandoMetaClass2 1.1. Java 下一代: 没有继承性的扩展 Groovy.Scala 和 Clojure 提供了许多扩展机制,但继承

js中String常用方法详解及String对象方法扩展

一.JavaScript 中 slice .substr 和 substring的区别: 1: String.slice(start,end): 一个新的字符串.包括字符串 stringObject 从 start 开始(包括 start)到 end 结束(不包括 end)为止的所有字符. 2: String.substring(start,end) 这个就有点特别了,它是先从start,end里找出一个较小的值. 然后从字符串的开始位置算起,截取较小值位置和较大值位置之间的 字符串,截取出来的

Java程序员的JavaScript学习笔记(11——jQuery-在“对象”层面扩展)

计划按如下顺序完成这篇笔记: 1.    理念. 2.    属性复制和继承. 3.    this/call/apply. 4.    闭包/getter/setter. 5.    prototype. 6.    面向对象模拟. 7.    jQuery基本机制. 8.    jQuery选择器. 9.    jQuery工具方法. 10.    jQuery-在"类"层面扩展. 11.    jQuery-在"对象"层面扩展. 12.    jQuery-扩

ES6 常用总结——第三章(数组、函数、对象的扩展)

1.1. Array.from() Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map). 下面是一个类似数组的对象,Array.from将它转为真正的数组. let arrayLike = { '0': 'a', '1': 'b', '2': 'c', length: 3}; // ES5的写法var arr1 = [].slice.call(arrayLike);

关于数据库对象的扩展属性

今天有人问有没有办法查看表的注释,或查询所有表的注释.这里所说的表或表字段等的注释,其实是数据库对象的扩展属性.在MSSQL中,支持把一些注释性的内容放到数据库或数据库对象中,增强可读性,有助于日后的管理和维护工作.扩展属性的内容可以通过SSMS添加.修改或删除,也可以通过系统视图查询,通过执行相关的存储过程来维护. 创建一张测试表: IF OBJECT_ID(N'T8') IS NOT NULL BEGIN DROP TABLE T8 END GO CREATE TABLE T8 ( id I

ES5 对象的扩展(Object.preventExtensions)、密封(Object.seal)和冻结(Object.freeze)

前面提到 ES5 对象属性描述符,这篇看看对象的扩展.密封和冻结. 扩展对象 Object.preventExtensions Object.isExtensible 密封对象 Object.seal Object.isSealed 冻结对象 Object.freeze Object.isFrozen 1. Object.preventExtensions 阻止对象扩展,让一个对象变的不可扩展,也就是永远不能再添加新的属性 ES3 是没有办法阻止对象扩展的,定义对象后可以给对象添加任意属性,如

9.对象的扩展

1.属性的简介表示法 2.属性名表达式 3.方法的name属性 4.Object.is() 5.Object.assign() 6.属性的可枚举性 7.属性的遍历 ES6一共有5种方法可以遍历对象的属性. (1)for...in for...in循环遍历对象自身的和继承的可枚举属性(不含Symbol属性). (2)Object.keys(obj) Object.keys返回一个数组,包括对象自身的(不含继承的)所有可枚举属性(不含Symbol属性). (3)Object.getOwnProper

JavaScript原生对象及扩展

转自:http://segmentfault.com/a/1190000002634958 内置对象与原生对象 内置(Build-in)对象与原生(Naitve)对象的区别在于:前者总是在引擎初始化阶段就被创建好的对象,是后者的一个子集:而后者包括了一些在运行过程中动态创建的对象. 原生对象(New后的对象) ECMA-262 把原生对象(native object)定义为“独立于宿主环境的 ECMAScript 实现提供的对象”.包括如下: Object.Function.Array.Stri

ES6中对对象的扩展

ES6允许直接写入变量和函数作为对象的属性和方法.这样的书写更加简洁. ES6允许在对象中只写属性名,不写属性值.这时,属性值等于属性名所代表的变量. function f(x , y){ return {x ,y}; } f(1,2)// Object {x:1,y:2} function getPoint(){ var x=1; var y=10; return {x,y}; } getPoint()//{x:1,y:10} js语言定义对象的属性有两种方法.obj.foo=true;obj

ECMA Script 6_对象的扩展

对象 1. ES6 允许直接写入变量和函数,作为对象的属性和方法 const foo = 'bar'; /*****************属性的优化********************/ const baz = {foo: foo}; // 优化为 const baz = {foo}; /*****************属性的优化********************/ function f(x, y) { return {x: x, y: y}; }; // 优化为 function