美文网首页
JavaScript对象基础

JavaScript对象基础

作者: LaobingFung | 来源:发表于2018-12-04 13:05 被阅读0次

    JavaScript对象基础

    Object是JavaScript中的一种基本数据类型,Object与其他六种基本数据类型(Undefined, Null, Number, String, Symbol, Boolean)不同的是,Object是引用数据类型。假设x是一个对象,当执行var y = x;语句后,x和y都指向同一个对象,通过x和y其中一个来修改对象的属性后,从另一个访问这个对象会得到同样的结果。

    JavaScript中,除了六种原始数据类型外,一切皆对象,字符串、数组、日期、函数等都是对象。

    创建对象

    通过字面量创建对象

    JavaScript中可以通过{}大括号来创建对象,对象的成员是用,逗号分隔的键值对

    var obj = {
        key1: value1,
        key2: value2,
        "key3 temp": value3
    }
    

    键值对中,value可以是任意数据类型,包括对象类型(函数、数组、字符串等),而key只能是String或Symbol类型,如果key中包含了空格或-,则需要用引号把属性名括起来。

    通过构造函数创建对象

    在JavaScript中可以通过关键字new来创建对象

    var a = new Object(); //创建一个空对象
    var b = new Array(); //创建一个数组
    var c = new Date(); //
    

    对象的方法

    对象中键值对的值可以是原始数据类型,也可以是函数,当函数作为对象的属性时,把该函数成为对象的方法。

    var person = {
        firstName: "John",
        lastName : "Doe",
        id : 5566,
        fullName : function() 
        {
           return this.firstName + " " + this.lastName;
        }
    };
    

    上面的代码定义了person对象的一个方法,可以通过person.fullName()来调用该方法。


    访问对象

    在JavaScript中可以通过.或方括号[]来访问对象的属性和方法。

    var person = {
        name : "Jack",
        age : 20,
        greet : function() {
            console.log("Hello, my name is " + this.name + ".");
        }
    };
    
    var a = "age";
    
    console.log(person.name);
    console.log(person["age"]);
    console.log(person[a]);
    person.greet();
    

    console输出

    Jack
    20
    20
    Hello, my name is Jack.
    

    需要注意的是,如果想通过变量来操作对象的属性,那么只能使用方括号[],例如上面给变量a赋值"age",可以通过person[a]来访问age属性,而使用person.a会访问到一个key为"a"的属性,该属性是未定义的。


    遍历对象属性和方法

    JavaScript中使用for in语句来遍历对象的属性和方法。

    var fruit = {
      apple: 20,
      pear: 20,
      peach: 10
    };
    
    function countFruits(obj) {
        let total = 0;
        for(let key in obj){
            total += obj[key];
            console.log(obj[key]);
        }
        return total;
    }
    
    console.log(countFruits(fruit));
    

    输出为

    20
    20
    10
    50
    

    其中的for循环中,变量key就是对象fruit的属性名。

    相关文章

      网友评论

          本文标题:JavaScript对象基础

          本文链接:https://www.haomeiwen.com/subject/sqymcqtx.html