JavaScript的 基本数据类型---对象

Posted konglingbin

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript的 基本数据类型---对象相关的知识,希望对你有一定的参考价值。

第一:javascript对象是    

第二:Javascript中    

第三:Javascript的对象是数据;

第四:JavaScript 中的对象可以简单理解成"名称:值"对(name:value)。名称(name):"名称"部分是一个 JavaScript 字符串

      参考----------https://www.cnblogs.com/foodoir/p/5971686.html

对象是JavaScript的一个基本数据类型,是一种复合值,它将很多值(原始值或者其他对象)聚合在一起,可通过名字访问这些值。即属性的无序集合。

二、对象的创建(多种方法)

 

  1、对象直接量 / 字面量

 

       var obj = {
           name: \'lyl\',
           age: 18
       }
       console.log(obj.name); // lyl

 

  2、构造函数:

 

    (1)、系统自带的的, eg: new Object(), Array(), Number(),Boolean(), Date()...  

 

 var obj = new Object();
      obj.name = \'lyl\';
      console.log(obj.name); //lyl

 

     (2)、自定义的:为了和普通函数区分,首字母大写,采用大驼峰式写法(普通函数采用小驼峰式写法)

 

function Obj (name) {
          this.name = name;
          this.age = 18;
      }
      var obj = new Obj(\'lyl\');
      console.log(obj.name); //lyl
      console.log(obj.age); //18

    自定义构造函数的基本构造原理:

 

      首先,文字理论解释一番,其实一切的关键全在与new这个操作符上,用new和不用new返回的结果大相径庭。不用new,则Obj(\'lyl\')根本就是一个函数的正常执行,没有返回值,则默认返回undefined,而是用new操作符后js引擎就会将该函数看作构造函数看待,经过内部的一系列隐士操作,返回值就是一个对象了。

 

      看下如下demo:

 

  demo1:用new和不用new的区别演示:

function Obj () {
          this.age = 18;
      }
    //   不用new
      console.log(Obj()); // undefined
    //  用new
      console.log(new Obj()); //Obj {age: 18}
复制代码
复制代码

 

  demo2 用new返回值为对象的基本原理:

 

  不用new,函数内的this指向的是window,所以this.xxx定义的变量都是window上的属性,但为什么使用new后其中的this就不是window对象了呢?那是因为

 

  用new后,js引擎会在函数被进行两步隐士操作(假设构造函数名为Person):第一步, var this = Object.create(Peson.prototype);   (也是创建对象的一种方法,下边会讲到)  隐士的改变函数内this的含义,现在函数内的this是一个原型为Person.prototype, 构造函数为Person的对象(其实此过程就将想要的对象基本创造成功了,只是差些属性而已,从此可是看出构造函数创建对象的最根本原理是借用Object.create()方法来实现的,只不过被封装功能化了); 第二步, 在创建的对象设置完所需要的属性后,隐士的将创建的对象this通过return返回  return this; 

 

  

 

  通过代码的展现:

 

复制代码
复制代码
 //  构造函数的原型
     Person.prototype = {
       say: function () {
         console.log(\'I am saying\');
       }
     }

    //  构造函数
     function Person () {
      //  隐士操作
      // var this = Object.create(Person.prototype);
      
      //返回对象属性的设置
        this.name = \'lyl\';
        this.age = 18;

      //  隐士操作
        // return this;
     }

     var person1 = new Person();
     console.log(person1.name); // lyl
     person1.say(); //I am saying
复制代码
复制代码

 

 

 

  上述两步理论的验证:

 

  第一步:现在函数内的this是一个原型为Person.prototype, 构造函数为Person的对象

 

复制代码
复制代码
 //  构造函数的原型
     Person.prototype = {
       say: function () {
         console.log(\'I am saying\');
       }
     }

    //  构造函数
     function Person () {

        this.name = \'lyl\';
        this.age = 18;
        // 打印this对象的原型
        console.log(this.__proto__); // 
        // 验证this是否是Person构造函数的实例
        console.log(this instanceof Person); //true
     }
     new Person();//打印结果如下
    //  Object say: ()__proto__: Object
    // true

     Person();//打印结果如下
    //  Window
    // false
复制代码
复制代码

 

 

 

   第二步:隐士的将创建的对象this通过return返回

 

由以上一些代码,我们已经可以看出返回的是满足条件的对象,现在我们创建对象时不用new,并显示的模拟这两步隐士操作来验证(我们不用new则两步隐士操作就不会产生)

 

复制代码
复制代码
 //  构造函数的原型
     Person.prototype = {
       say: function () {
         console.log(\'I am saying\');
       }
     }

    //  构造函数
     function Person () {
       var that = Object.create(Person.prototype);

        that.name = \'lyl\';
        that.age = 18;
        
        return that;
    //提前返回that导致return this无法执行而失效
     }

     var person = new Person();
//此处不用new也是可以成功返回一个满足条件的对象,因为显示的返回了that console.log(person.name); //lyl person.say(); //I am saying
复制代码
复制代码

 

p.s. 关于显示返回that的问题,当我们用new生成对象,若我们显示return的是一个对象 / 引用值,则会导致return this失效,若返回的是原始值,则return this不会失效

 

 

 

  3、Object.create(原型); 创建一个继承该原型的实例对象

 

  关于此方法的一些注意事项:

 

  (1)、若传参为Object.prototype,则创建的原型为Object.prototype,和 new Object()创建的对象是一样的   Object.create(Object.prototype) <==>new Object(); 

 

  (2)、若传参为空 或者 null,则创建的对象是没有原型的, 导致该对象是无法用document.write()打印会报错,因为document.write()打印的原理是调用Object.prototype.toString()方法,该对象没有原型,也就没有该方法,所以document.write()无法打印

 

  由此延伸的知识点: 引用值都也是算作是对象,所以都可以用document.write()打印;原始值numebr, boolean, string都有自己对象的包装类,借助此机制也是可以用document.write()打印出的;

 

但undefined 和 null既不是引用值,也没有对应的包装类,所以应该无法打印的,但大家会发现这两个值也是可是用document.write()打印的,因为这两个值被设定为特殊值,document.write()打印其是不用调用任何方法的,而是之直接打印其值

 

 

 

三、对象的增、删、改、查

 

  1、增: 所谓增添一个对象的属性,就是直接对该属性进行赋值操作即可,这就相当于为该对象添加了一个新属性,而打印未添加的属性,浏览器不会报错,而是会打印出undefined

 

  

 

 var obj = {};
    console.log(obj.name); //undefined (不会报错)
    obj.name = \'lyl\';
    console.log(obj.name); // lyl

 

  

 

  2、删:我们通过delete操作符来删除一个对象的属性

 

  

 

复制代码
 var obj = {
       name : \'lyl\'
     };
     console.log(obj.name); //lyl
     delete obj.name; 
     console.log(obj.name); //undefined
复制代码

 

  3、改: 修改一个对象的属性是最简单的了,直接通过赋值操作赋予其其他的值即可

 

  

 

复制代码
var obj = {
      name: \'lyl\'
    };
    console.log(obj.name); // lyl
    obj.name = \'obj\';
    console.log(obj.name); // obj
复制代码

 

  

 

  4、查:查询一个对象的属性值有两种方法

 

  

 

复制代码
复制代码
var obj = {
      name: \'lyl\'
    };
    // 第一种方法
   console.log(obj[\'name\']); //lyl
  //  第二种方法
    console.log(obj.name); // lyl
  //p.s.最本质的是第一种方法,因为在使用第二种方法时,后台自动将其转换为第一种字符串的形式来查询 
复制代码
复制代码

 

    

 

p.s.以上的增、删、改三种操作都只是针对当前对象的属性进行操作,而不会影响到当前对象的原型的属性。

 

  而查询是先看看当前对象本身是否设置了该属性,如果当前对象未设置该属性,则再看该对象的原型中是否设置了该属性,若两者都没有,则返回undefined

 

 

 

四、包装类:

 

  1、五个原始值:number, string , boolean, undefined, null

 

其中number, string, boolean是分别拥有自己的包装类,而undefined和null是没有自己的包装类的

 

  2.原始值不是对象,无法拥有自己的属性,但因为的包装类的存在,原始值就好似可以拥有自己的属性了,但其拥有的属性又有点特殊之处,如下用string来举例:

 

先看一段code

 

//  str是string类型的,非对象,不能拥有属性,为什么能打印出str.length?
     var str = \'abcd\';
     console.log(str.length); //4

 

 

 

 

 

上边code中问题的解释:

 

复制代码
    // 因为每次执行完一条完整js语句后该类型对象的包装类就会将该语句包装,所以也就不会导致报错了,这些都是后台自己写的
     var str = \'abcd\';
    //  var str1 = new String(\'abcd\');
     console.log(str.length); //4
    //  var str1 = new String(\'abcd\');
    // console.log(str1.length);
复制代码

 

注意:每次包装类包装完一次完整语句后就会被销毁。(即解释一条语句,用包装类包装一次,然后销毁),这回导致其和正常对象的一些不同之处,如下例子

 

  

 

    var str = \'abcd\';
    str.len = 4;
    console.log(str.len); // undefiend
  //???

 

 关键在于‘销毁’一词上,解释如下:

 

  

 

复制代码
复制代码
    var str = \'abcd\';
    // var str1 = new String(\'abcd\');
    // 销毁
    str.len = 4;
    // var str1 = new String(\'abcd\');
    // str1.len = 4;
    // 销毁
    console.log(str.len); // undefiend
    // var str1 = new String(\'abcd\');
    // console.log(str.len);   str1为刚创建的对象,其len属性自然为undefiend
    // 销毁
复制代码
复制代码

 

   一个易错的坑:

 

// 总之记得\'原始值包装类\'\'销毁\'这两句话就行
   var str = \'abcd\';
   str.lenth = 2;
   console.log(str);  // ab or abcd ? answer is abcd
   console.log(str.length); // 2 or 4 ? answer is 4

 

 

 

  

 

五、原型:

 

  1、原型的定义: 原型是function对象的一个属性,它定义了构造函数制造出的对象的公共祖先。通过改构造函数产生的对象,可以继承该原型的属性和方法。原型也是对象。

 

  2、利用原型特点和概念,可以提取共有属性。将一类对象的共有属性提取出来,放到该类对象的原型中,从而不需要每次用new操作符时都重新定义一遍该共有属性。

 

  如下,定义一个Person构造函数,而属于Person多构造对象共有的属性方法,则定义到Person的原型中

 

  

 

复制代码
复制代码
Person.prototype = {
        eat: function (food) {
           console.log(\'I have eated \' + food);
        },
        sleep: function () {
          console.log("I am sleeping");
        }
      }
      // 人的构造函数
      function Person (name, age) {
        this.name = name;
        this.age = age;
      }
      var person1 = new Person(\'lyl\', 18);
      console.log(person1.name); //lyl
      person1.eat(\'apple\'); //I have eated apple
复制代码
复制代码

 

  3、如何查看原型:

 

   之前是不允许我们查看构造函数的原型的,但后来提供了一个可查看构造函数原型的接口:隐士属性__proto__(其实我们能够访问原型的属性,或者说继承原型,靠的就是__proto__属性连接着构造函数和原型,可以说没有__proto__属性的存在,就无法实现原型的继承)

 

    (1)、首先我们先说明一下__proto__这个接口是存放到哪里的

 

      看过以上对象创建过程的都应该知道在用new创建一个对象时,内部会隐士自动创建一个this的对象,进过一系列处理后再隐士将this对象返回。而__proto__就对于隐士创建的this对象中,如下代码:

 

  

 

复制代码
复制代码
 // 原型
    Person.prototype = {
      say: function () {
        console.log("I am saying ");
      },
      play: function () {
        console.log("I am playing");
      }
    }
    // 构造函数
    function Person (name) {
      
      // var this = Object.create(Person.prototype);
      // p.s.在隐士创建的this对象中存在一个属性,即__proto__,该属性存储了Person.prototype

      this.name = name;

      // return this;
    }
    // 对象的创建
    var person1 = new Person(\'lyl\');
    // 打印原型
    console.log(person1.__proto__);
复制代码
复制代码

 

 

 

    (2)、如何查看原型:直接通过new操作符创建的对象访问__proto__属性即可,如上代码演示

 

  4、如何查看对象的构造函数,我们通过属性constructor来查看:

 

    contructor属性位于构造函数的原型中,其中存储的是构造函数信息,所以在不知道原型的情况下,由原型继承原理,我们可以用实例对象来直接访问constructor,即获取创建该实例的构造函数

 

复制代码
 function Person () {
           this.name = \'myName\';
           this.age = 18;
       }
       var person = new Person();
       console.log(person.constructor); // function Perso(){...}
复制代码

 

六、原型链:

 

  1、定义:顾名思义,原型链就是将一个个原型串连起来,形成一条原型继承的链子。

 

  2、原型链的构成:

 

      如下代码例子, Child继承Parent, Parent继承GrandParent, 而GrandParent没有自定义原型,所以默认为原型链的最顶端new Object();

 

       (为什么Object为最顶端,因为Object.prototype为null,为null是没有原型的)

 

复制代码
复制代码
 //    原型链: Child -> new Parent() -> new GrandParent() -> new Object();
       function GrandParent() {
           this.name = \'GrandParent\';
           this.a = 3;
       }
       Parent.prototype = new GrandParent();
       function Parent() {
           this.name = \'parent\';
           this.b = 2;
       }
       Child.prototype = new Parent();
       function Child() {
           this.name = \'child\';
           this.c = 1;
       }

       var child = new Child();
       console.log(child); // Child {name: "child", c: 1}

       console.log(child.a); // 3
       console.log(child.b); //2
       console.log(child.c); //1
复制代码
复制代码

 

  3、原型链的增删改查:

 

    使用如上的原型链说明, Child -> new Parent() -> new GrandParent() -> new Object(), 实例对象为child

 

    (1)、增:

 

      为child实例对象添加属性,总是添加为其自己本身的属性,为对原型和原型链是没有影响的。(再具体说即对和其相同构造函数构造的实例对象无法造成影响,以下说法同此)

 

    (2)、删:

 

      使用delete操作符只能删除child实例对象自己本身的属性,而无法删除由原型继承而来的属性

 

    (3)、改:

 

      分两种情况:

 

        若修改的属性为继承自原型的,且值类型为原始值,则仅仅修改的是该实例对象的属性,对原型无法造成影响。

 

        若修改的属性为继承自原型的,属性值类型为引用值,则对引用值的修改又分两种情况:

 

            第一种是直接对该修改的属性赋值 => 此情况仅仅修改的是实例对象的该属性,无法对原型造成影响。

 

            第二种是对该修改的属性添加内容或去除内容,而不是对其重新赋值 => 此情况会对原型造成影响。如下例子:

 

            

 

复制代码
复制代码
 Person.prototype = {
            has: [1, 2, 3]
        }
        function Person () {
            this.name = \'lyl\';
        }
        var person1 = new Person();
        var person2 = new Person();
        person1.has.push(4);
        // person1 和 person2都改变了,因为person1的修改影响到了原型,进而影响到了另一个实例对象
        console.log(person1.has); //[1, 2, 3, 4]
        console.log(person2.has); // [1, 2, 3, 4]

 

     (4)、查:

 

  查询过程如下,首先看构造函数中是否有要查询的属性,若有,则直接返回,若没有,则看其原型有没有要查询的属性,若没有,则再看原型的原型上是否有要查询的属性,以此顺序在原型链上查询,若一直到原型链顶端后仍没有要查询的属性,则返回undefined

 

  p.s.理解了在原型链上的增删改查后,自然就能理解在原型上的增删改查了,只要把在原型上的增删改查当成只有一个原型的很短的原型链即可。

 

 

 

   4、绝大多数对象最终都会继承自Object.prototype

 

    为什么事绝大多数呢?因为null,和undefined是没有原型的,上文有详细提到

 

 

 

七、对象继承史

 

  由于之前已经总结过这些,所以此处直接就粘链接了: http://www.cnblogs.com/Walker-lyl/p/5592048.html

 

八、命名空间:

 

  我们可以利用对象创建命名空间来管理变量,防止污染全局,适用于模块开发,如下简单的小demo:

 

复制代码
复制代码
 var workSpace = {
           person1: {
               name: \'one\',
               age: 18
           },
           person2: {
               name: \'two\',
               age: 20
           }
       }
    // 这样两个人虽然有同名变量,但不会相互影响,因为位于不同命名空间
     //    访问第一个人的姓名
    console.log(workSpace.person1.name); // one
    console.log(workSpace.person2.name); //two

九、实现类似jquery中的链式调用: return this;

 

    如下小demo,其中的this不懂的没关系,上面会说,你只要把次demo中的this当成person对象就行

 

  

 

var person = {
          foodCount: 10,
          eat: function () {
             this.foodCount--;
              return this;
          },
          buy: function () {
              this.foodCount++;
              return this;
          },
          print: function () {
              console.log(this.foodCount);
          }
      }
    //   foodCount初始值为10, 在连续吃了三次后,变为7
      person.eat().eat().eat();
      person.print(); //7

 

 十、对象的枚举:

 

  1.obj.hasOwnProperty(\'prop\');

 

      该方法的作用是来判断对象obj的自身属性中是否含有属性prop,

 

    自身属性是在构造函数中生成的或者实例对象后来自己添加的,而继承属性则是从原型上继承的属性,

 

    所以该方法就是判断该属性是从原型继承来的还是自身的。

 

      作用: 遍历一个对象的所有自身属性,因为es5中的对象遍历是默认打印包括继承自原型的属性的,demo如下

 

  

 

Person.prototype.age = 18;
     function Person () {
         this.name = \'lyl\';
     }
     var person = new Person();
    //  未用hasOwnProperty
    // print:
    //  lyl
     for(var prop in person) {
         console.log(person[prop]);
     } 
    //  使用hasOwnProperty
    // print: 
    // 18 lyl
     for(var prop in person) {
         if(person.hasOwnProperty(prop)) {
             console.log(person[prop]);
         }
     }

 

 

 

   2、prop in obj; 

 

  in操作符用来判断该对象obj上是否有该属性prop,prop既可以是自身属性,也可以是继承属性,如下demo

 

Person.prototype.age = 18;
     function Person () {
         this.name = \'lyl\';
     }
     var person = new Person();
    console.log(\'age\' in person); // true
    console.log(\'name\' in person); //true
    delete person.name;
    console.log(\'name\' in person); //false

  3、object instanceof Object;

 

  instanceof操作符用来判断object实例对象是否为Object构造函数创建的,如下demo

 

Person.prototype.age = 18;
     function Person () {
         this.name = \'lyl\';
     }
     var person = new Person();
     console.log(person instanceof Person); // true
     console.log(new Object() instanceof Person); //false

 

 十一、this基本介绍:

 

  1、函数预编译过程 this —> window
  2、全局作用域里 this —> window

 

  3、obj.func();   func()里面的this指向obj), 可以这样理解,谁调用func,则this就指向谁

 

  4、call/apply 可以改变函数运行时this指向,

 

    (1)、call用法:

 

      func.call(要改变后的this, arg1, arg2, ... );

 

    (2)、apply用法:

 

      func.apply(要改变后的this, [arg1, arg2, arg2]);

 

    (3)、apply和call共同点:都是改变this指向

 

        apply和call不同点:传参形式不同,call是将参数一个个传进来,而apply是将所有参数存进一个数组中,然后将该数组传

 

 

 

如下demo:

 

  

 

// demo1
    function demo1() {
        console.log(this);
    }
    // demo1() <==> this.demo1(); <==> window.demo1()
    demo1(); // window
// demo2
    var demo2 = {
        retThis: function () {
            console.log(this);
        }
    }
    demo2.retThis(); // demo2 = {...}
// call / apply改变this
    demo1.call(demo2);  // demo2 = {}
    demo2.retThis.call(window); // window

 

十二、对象的克隆:

 

  你可能回想,直接用等号赋值不久完成克隆了吗?这还用说,但你忽略了对象是一个引用值,赋值操作赋的是该对象的引用,然后会产生很坏的影响。

 

  举例来说,将obj1赋值给obj2,然后我们向obj2中添加了一个属性,然后我们会惊喜的发现obj1中也有了此刚刚向obj2中添加的属性,但我obj1并不需要该属性啊,则造成obj1不开心了,为了让obj1开心起来,我们向下看,嘿嘿:

 

  对象克隆,分为浅克隆和深克隆,而上边的直接赋值的克隆操作为浅克隆,为什么称为浅克隆呢?因为,克隆的和被克隆的对象在克隆操作完成后,指向同一个地址引用,改变其中一个(注意:此处的改变为增加或删除对象的属性,而不是为该对象重新赋值一个对象),另一个也会改变,而深克隆则不会产生此现象。

 

  深克隆/深拷贝code如下,这是我从网上搜到的一个目前我见到的最完整最简短的code,直接贴上:

 

 

 

// 对象的深度克隆(Array / obj /...)
        function  deepClone(obj) {
            var str, retObj = Object.prototype.toString.call(obj) === \'[object Array]\' ? [] : {};
            if(typeof obj !== \'object\') {
                return;
            }else if(window.JSON) {
                str = JSON.stringify(obj);
                retObj = JSON.parse(str);
            }
            else {
                for(var prop in obj) {
                    retObj[prop] = typeof obj[prop] === \'object\' ? deepClone(obj[prop]) : obj[prop];
                }
            }
            return retObj;
        }


   1、通过对象字面量的方式创建对象(对象字面量是一个表达式,这个表达式的每次运算都创建并初始化一个新对象。每次计算对象字面量的时候,也都会计算他的每个属性的值。也就是说,如果在一个重复调用的函数中的循环体内使用了对象直接量,它将创建很多新对象,并且每次创建的对象的属性值也有可能不同。)

        语法:var obj = {};
        实例:
        首先,我们创建一个空的对象,里面没有任何属性,我们来获取它的类型   

var obj1 = {};//没有任何属性的对象
console.log(typeof obj);        //object

 

        它返回的结果是object,说明我们创建的是一个object对象,当然,我们还可以用下面的方法来创建

复制代码
                var obj2={x:1,y:2,z:3};
                var obj3={
                \'x\':1,
                "y":2,
                username:\'king\',
                \'for\':\'javascript关键字必须放到引号中间\',    //for是javascript关键字,必须放到引号中间
                \'first-name\':\'foodoir\',                //-是特殊字符,也需要放在引号中间
                married:true,
                test:null,
                test1:undefined,
                salary:12.3,
                person:{                            //在对象中"值"部分可以是任何 JavaScript的数据类型——包括对象
                    username:\'king\',
                    age:21,
                    addr:\'北京\',
                },                                    //最后一个对象属性的后面的逗号可以写可以不写,在ECMAScript 5中自动被忽略,在ECMAScript 3的大部分实现中也可以忽略这个逗号,但在IE中报错
            }
复制代码

    2、通过new object创建对象
        语法:var obj = new Object();
        实例:

            var obj4 = new Object();//创建一个空对象
            var arr = new Array();//创建一个空数组对象
            var date = new Date();//创建一个空时间对象   

    3、通过构造函数的形式创建对象
        语法:function Person(){};或者var Person=function(){};
        实例:

复制代码
            var obj5=new Test1();
            function Test1(num1,num2){
                this.n1=num1;
                this.n2=num2;
            }
            var obj6=new Test1(5,6);
            console.log(typeof obj6);                //object
            console.log(obj6 instanceof Object);    //true
复制代码

        在使用通过构造函数的形式创建对象时应注意:

            a.使用的时候通过new操作符得到对象var person1=new Person()
            b.用构造器创建对象的时候可以接收参数
            c.构造器函数的首字母最好大写,区别其他的一般函数

        注意:构造器属性(constructor property),当我们创建对象的时候,实际上同时也赋予了该对象一种特殊的属性,就是构造器属性,这个构造器属性实际上是一个指向用于创建该对象的构造器函数的引用

补充:
typeof 和 instanceof 常用来判断一个变量是否为空,或者是什么类型的。但它们之间还是有区别的:
    typeof 是一个一元运算,放在一个运算数之前,运算数可以是任意类型。
        它返回值是一个字符串,该字符串说明运算数的类型。typeof 一般只能返回这几个结果:number,boolean,string,function,object,undefined。
        我们可以使用 typeof 来获取一个变量是否存在,如 if(typeof a!="undefined"){alert("ok")},而不要去使用 if(a) 因为如果 a 不存在(未声明)则会出错,对于 Array,Null 等特殊对象使用 typeof 一律返回 object,这正是 typeof 的局限性。
    instanceof 用于判断一个变量是否某个对象的实例
        在上面的例子中,obj6 instanceof Object判断的为true,则说明创建的obj6也是Object类型            
        
    4、通过Object.create()创建对象   

复制代码
        var obj7 = Object.create({x:1});
        //创建一个普通的空对象
        var obj8 = Object.create(null);
        //创建一个对象的原型属性
        var obj9 = Object.create(Object.prototype);    //prototype对象的原型属性
        console.log(typeof obj7);                //object
        console.log(typeof obj8);                //object
        console.log(typeof obj9);                //object
        //通过instanceof 操作符检测对象是否由某个指定的构造器函数创建的
        console.log(obj7 instanceof Object);    //true
        console.log(obj8 instanceof Object);    //false,注意:空对象用instanceof判断时,结果为false
        console.log(obj9 instanceof Object);    //true
复制代码

如何对对象进行操作?

    学过数据库的我们都知道,数据库最基本的四个操作分别是“增、删、查、改”,那么在对对象的操作中是否也存在类似的操做呢?是的,在对对象的操作中也有查询,添加,修改,删除操作,都是基于对象的属性的操作。下面我们来介绍对象的几个基本操作。

    首先,我们先要通过查询方法,来获取对象中的属性,访问属性有三种方法:对象名.属性名;对象名[属性名];当处于某个对象方法内部的时候,可以通过this来访问同一对象的属性

复制代码
var person = {
    username: "foodoir",
    age: 21,
    sex: "",
    addr: "湖南",
    salary: 123456,
};
console.log("姓名:" + person.username + "\\n" + "性别:" + person.sex); //姓名:foodoir    性别:男
console.log("年龄:" + person[\'age\'] + "\\n" + "薪水:" + person["salary"]); //年龄:21    薪水:123456
//如果属性不确定,需要使用[]
var key = \'username\';
console.log(person.key); //undefined   此种方法不能得到key的值,通过[]方法可以得到
console.log(person[key]); //foodoir     当属性不确定时,用该方法
console.log(person[\'key\']); //undefined
复制代码

            看到这里,你肯定会有有疑问,为什么第9行代码中person[\'age\']中的age和person["salary"]中的salary都加了引号,且都可以显示出结果,而在第13行代码中person[\'key\']中的key加了引号,反而返回值是undefined 原因究竟是什么呢?

            age为person对象中的属性名,而该对象只对person进行了定义,没对person里面的属性进行定义,故在调用的时候,在[]中间应该加上引号,也就是说,person[\'age\']和person.age是等价的

            而key是在对象外定义的(var key = \'username\';),在对象里面它是不存在key这个属性的(即属性不确定),此时直接用person[key]方法就好了,person.key和person[\'key\']返回的必须是person对象里面确定的属性,key没在person属性里面,故这两种方法返回的值都是undefined

   学会了如何获取对象的属性,然后我们该继续学习对象中的属性进行添加,修改和查询操作

复制代码
function personInfo(name, age, sex) {
    this.name = name;
    this.age = age;
    this.sex = sex;
}
var person1 = new personInfo(\'foodoir\', 20, \'\');
console.log(person1.name + person1.sex); //foodoir男
复制代码

    属性的添加有两种方式:对象名.属性名=值;对象名[属性名]=值       

复制代码
//添加属性
var obj = {};
obj.username = \'foodoir\';
obj.age = 21;
obj.sex = \'\';
obj.addr = \'湖南\';
obj[\'test\'] = \'hello world\';
console.log(obj.username + " " + obj.age + " " + obj.sex + " " + obj.addr + " " + obj[\'test\']); //foodoir 21 男 湖南 hello world
复制代码

    属性的修改也有两种方式:对象名.属性名=值;对象名[属性名]=值       

//修改指定属性
obj.username = \'chenwu\';
console.log("修改之后的名字:" + obj.username); //修改之后的名字:chenwu
obj[\'test\'] = \'hello javascript\';
console.log("修改之后的test:" + obj[\'test\']); //修改之后的test:hello javascript

    属性的删除也有两种方式:delete 对象名.属性名;delete 对象名[属性名]    。在delete删除指定的属性时应该注意:(后面讲对象的结构的时候会详细介绍)
        delete只能删除自身属性,不能删除继承属性
        要删除继承属性,只能从定义它属性的原型对象上删除它,而且这会影响到所有继承自这个原型的对象
        delete只是断开属性和宿主对象的联系,而不会去操作属性的属性
        delete不能删除哪些可配制性为false的属性  

//通过delete删除指定的属性
delete obj.sex;
console.log(obj.sex); //undefined
delete obj[\'test\'];
console.log(obj[\'test\']); //undefined

         除了“增、删、改、查”我们还要学会对象中的遍历,对象中的遍历有两种,一种是for/in遍历,一种是通过Object.keys(obj)函数进行遍历

复制代码
var obj = {
    x: 1,
    y: 2,
    test: "helloworld",
    edu: "javascript",
};
//通过for/in遍历属性
for(var i inJavascript学习语言基础

JavaScript的 基本数据类型---对象

JavaScript-基本数据类型

javascript之基本包装类型

javascript中,数据类型和对象的关系(区别)

javaScript 常用的基本数据类型判断