zoukankan      html  css  js  c++  java
  • JS对象类型对象认识对象

    定义

    JavaScript的数据类型包含Undifined、Null、Boolean、Number、String和Object。对象和其他5种数据类型是不同的,其他5种是简单值,对象是一种复合值,可以把许多值聚合在一起,并通过名字访问这些值。

    对象是属性的无序集合,每个属性都是一个名值对。属性名是字符串,可以把对象看做是字符串到值的映射。

    创建对象

    三种创建对象的方式:new构造函数、对象字面量和Object.create()函数。

    【new构造函数】

    var person = new Object();// {} 没有参数时,等价于: var person = new Object;
    
    // 如果参数是一个对象,直接返回该对象
    var o1 = {a: 1};
    var o2 = new Object(o1);
    o1 === o2; // true
    
    // 如果参数是原始类型值,返回该值的包装类型对象
    new Object('foo'); // {0: "f", 1: "o", 2: "o", length: 3, [[PrimitiveValue]]: "foo"}
    new Object(1); // {[[PrimitiveValue]]: 1}
    new Object(true); // {[[PrimitiveValue]]: true}
    
    // null和undefined返回空对象
    new Object(null); // {}
    new Object(undefined); // {} 
    

    如果不使用new关键字直接调用,相当于转型函数,把任意值转换为对象。效果和使用new关键字一样。

    var person = Object(); // {}
    
    var o1 = {a: 1};
    var o2 = Object(o1);
    o1 === o2; // true
    
    Object('foo'); // {0: "f", 1: "o", 2: "o", length: 3, [[PrimitiveValue]]: "foo"}
    Object(1); // {[[PrimitiveValue]]: 1}
    Object(true); // {[[PrimitiveValue]]: true}
    
    Object(null); // {}
    Object(undefined); // {} 
    

    判断变量是否是对象类型。

    var isObject = function(val) {
      return val === Object(val)
    }
    
    isObject([]) // true
    isObject('a') // false
    

    对象字面量

    对象字面量是创建对象的一种快捷方式,使用字面量只是隐藏了与使用new操作符相同的过程。

    对象字面量是由若干名值对组成的映射表,名值对中间用逗号分隔,整个映射表用花括号包裹。不同属性间用逗号分隔,属性名是任意字符串,属性值是任意类型表达式,表达式的值就是属性值。

    var person = {} // 定价于 var person = new Object();
    
    var person = {
      name: 'hello',
      age: 20 + 5,
      sex: '男'
    }
    
    
    // 使用对象字面量的方法来定义对象,属性名会自动转换成字符串,上面的person等价于
    var person = {
      'name': 'hello',
      'age': 20 + 5,
      'sex': '男'
    }
    

    【Object.create()】ES5的Object.create()方法也用于创建一个新对象,它接收两个参数:第一个是对象的原型;第二个用于描述对象属性(可选)

    var o1 = Object.create({x:1,y:1});
    o1.x // 1
    
    // 如果参数是null,可创建一个没有原型的对象,这个对象不会继承任何方法。
    var o2 = Object.create(null);
    o2.toString(); // o2.toString is not a function
    
    // 如果参数是Object.prototype,可以创建一个普通的空对象
    var o3 = Object.create(Object.prototype);// 等价于{}和new Object()
    o3.toString(); // "[object Object]"
    

    第二个参数是属性描述符,关于属性描述符后面有详细介绍。

    var o1 = Object.create({x:1}, {
      y: {value:2, writable: false, enumerable:true, configurable:true},
      z: {value:3, writable: false, enumerable:true, configurable:true}
    }); 
    console.log(o1.x,o1.y,o1.z);//1 2 3
    

    对象组成

    对象是键名和属性值组成的无序集合。

    【键名】对象的键名都是字符串,如果不是字符串会自动转换成字符串。

    var o1 = {
      1: 'a',
      null: 'b',
      true: 'c',
      undefined: 'd',
      name: 'e'
    }
    o1 // {1: "a", null: "b", true: "c", undefined: "d", name: "e"}
    
    
    // 如果键名不符合标识符命名规则,必须加引号。
    var o2 = {
      1a: 'a'
    }
    o2 // Uncaught SyntaxError: Invalid or unexpected token
    
    var o3 = {
      '1a': 'a'
    }
    o3 // {1a: "a"}
    

    【属性值】属性值可以是任意类型的表达式,属性值等于表达式的结果。

    var o1 = {
      a: 1 + 2
    }
    o1.a // 3 
    
    // 如果属性值是函数,把这个属性称为该对象的方法
    
    var o2 = {
      name: function() {
        return 'hello'
      }
    }
    o2.name() // 'hello'
    

    由于对象的方法就是函数,所以也有name属性。如果是匿名函数,es5环境下返回undefined,es6环境返回属性名。

    var o1 = {
      person: function() {
    	  return 'hello'
      },
      age: function getAge() {
    	  return 10
      }
    }
    
    o1.person.name // 'person'
    o1.age.name // 'getAge'
    

    引用对象

    如果不同的变量指向同一个对象,这些变量指向的是该对象在内存中的地址。通过变量修改对象属性时会影响其他变量。

    var o1 = {name: 'hello'};
    var o2 = o1;
    
    o1.name = 'world'
    console.log(o2.name) // 'world'
    
    // 如果取消变量对原型对象的引用,不会影响其他变量
    var o1 = {name: 'hello'};
    var o2 = o1;
    
    o1 = 'world'
    console.log(o2) // {name: "hello"}
    

    实例方法

    【valueOf()】valueOf()方法返回当前对象。

    var o = {a:1};
    o.valueOf(); // {a: 1}
    

    【toString()】toString()方法返回当前对象对应的字符串形式。

    var o = {a:1};
    o.toString(); // "[object Object]"
    

    【toLocaleString()】toLocaleString()方法并不做任何本地化自身的操作,它仅调用toString()方法并返回对应值。

    var o = {a:1};
    o.toLocaleString(); // "[object Object]"
    
    优秀文章首发于聚享小站,欢迎关注!
  • 相关阅读:
    第四章 JavaScript面向对象
    第二章 JavaScript操作DOM2
    第三章 JavaScript操作DOM
    第二章 JavaScript操作BOM2
    第二章 JavaScript操作BOM
    第一章 JavaScript基础
    java面向对象总结1
    java面向对象总结
    第七章 用表组织数据
    2020.10.22
  • 原文地址:https://www.cnblogs.com/yesyes/p/15351924.html
Copyright © 2011-2022 走看看