JavaScript学习第五天

JavaScript的对象

    ①对象(Object)是一个以键值对形式储存属性的集合，每个属性有一个特定的名称，
以及与名称相对应的值。这种关系有-一个专有名称，称为映射。
对于对象来说，除了可以通过这种方式保持自由属性，还可以通过继承的方式继承属性，
这种方式称为“原型式继承”。
   ②万物皆对象
   ③语法: {key:value, key2:value2 , key3:value3,...}
   ④JavaScript的对象的值是属性和方法的数据。
   
   //  var person={
        name:"张三",
        age:18,
        prop:function(){
            console.log("吹")
        }
    }

JavaScript对象的分类

  -内建(内置)对象
由ES标准中定义的对象，在任何的ES中都可以使用
例如: Math Date Array String Number Boolean . ..
   // 圆周率   3.1415926
    console.log(Math.PI);
    console.log(new Date());

  -宿主对象
由js的运行环境提供的对象，现在主要指由浏览器提供的对象
例如: DOM( document) BOM( window )
    console.log(document);    
    console.log(window);
    // nodejs  global
  
  -自定义对象
由开发人员自己创建的对象
//var math2={
        PI2:3.1415927
    }
    console.log(math2.PI2);

JavaScript对象的声明

    1.字面量 声明 {}
    var obj={
        name:"张三",
        age:18,
        hobby:function(){
            return "抽烟，喝酒，烫头"
        }
    }

    2.通过 new 关键字声明  构造(对象)函数
    var obj2=new Object();
    // 添加属性和方法
    obj2.name="李四";
    obj2["age"]=19;
    obj2["hobby"]=function(){
        return "吃饭，睡觉，打豆豆"
    }
    console.log(obj);
    console.log(obj2);

JavaScript对象属性的操作

   1.字面量 声明 {}
    var obj={
        name:"张三",
        age:18,
        hobby:function(){
            return "抽烟，喝酒，烫头"
        }
    }

    // 如何访问对象的属性  object.property（属性）
    console.log(obj.name);
    console.log(obj.age);
    // 访问对象的方法
    console.log(obj.hobby());
    // object["property"]（属性）对象的键必须是字符串类型
    console.log(obj["name"]);
    console.log(obj["age"]);
    console.log(obj["hobby"]());
    console.log(obj["sex"]);// undefined




     2.通过 new 关键字声明  构造(对象)函数
    var obj2=new Object();
    // 添加属性和方法
    obj2.name="李四";
    obj2["age"]=19;
    obj2["hobby"]=function(){
        return "吃饭，睡觉，打豆豆"
    }

    // 删除对象的属性 delete关键字 delete:删除对象的属性
    console.log(obj2);
    delete obj2.name;
    delete obj2.age;
    console.log(obj2);


    // 遍历对象的属性  for...in  语法：prop in object  for(x in obj){
        console.log(x+":"+obj[x]);
    }
    // 检测对象的属性是否存在
     使用 in 检查对象中是否包含指定的属性  
    "属性" in 对象  返回 true false
    console.log("sex" in obj);
    if("name" in obj){
        console.log("obj对象包含name属性")
    }else{
        console.log("obj对象不包含name属性")
    }

    // hasOwnProperty() 检测是否 含有 属性
    console.log(obj.hasOwnProperty("name"));//true
    console.log(obj.hasOwnProperty("sex"));//fasle

JavaScript对象的注意事项

     1.对象可以嵌套对象  属性值可以为任意数据类型
    var caoshuai={
        name:"曹帅",
        age:20,
        boyFriend:{
            name:"马士洋",
            age:21
        }
    }

    console.log(caoshuai.boyFriend.name);

     2.对象的属性具有唯一性   key是唯一的  
    var person={
        name:"孙悟空",
        age:500,
        name:"白龙马"
    }
    person.name="唐僧";
    console.log(person)


     3.对象的键必须是字符串类型
     var person2={
         name:"字符串",
         1:'2',
         "[]":"数组",
         "{}":"对象",
         null:"kong",
         undefined:"未定义"
     }
     // console.log(person2)
     for(x in person2){
         console.log(typeof x);//string
     }

    // 键为非字符串类型，会转换为字符串类型
    var a={name:"a"};
    var b={name:"b"};
    var c=[1,2,3,];
    var d=[4,5,6];
    // 创建一个空对象
    var obj={};
    // 可以给对象添加属性
    obj[a]=10;
    console.log(obj);// [object Object]
    obj[b]=20;
    console.log(obj);// [object Object]
    obj[c]=30;
    console.log(obj);
    obj[d]=40;    
    console.log(obj);
    console.log(obj[a]);//?  20

JavaScript的类（构造函数）

    // 类：抽象的概念 
     构造函数：对象的构造器    用来构造对象的函数
     创建一个类(函数)   类名(函数名)首字母大写

    // 人类：name  age  sex  hobby 
    function Person(name,age,sex,hobby) {
        this.eyes="黑色";
        this.hair="黑色";
        this.name=name;
        this.age=age;
        this.sex=sex;
        this.hobby=hobby;
    }  

    // 使用 Person 创建对象
    var xiaoming=new Person("小明",20,"男",function(){return "唱歌"});
    var xiaohong=new Person("小红",18,"女",function(){return "跳舞"});

    console.log(xiaoming);
    console.log(xiaohong);

    // 工厂
    function Car(color){
        this.name="比亚迪";
        this.price="16.68w";
        this.func=function(){
            return "买菜"
        }
        this.color=color;
    }

    // 生产线
    var car1=new Car("红色");
    var car2=new Car("白色");
    console.log(car1.func());
    console.log(car2.func());

JavaScript类添加属性和方法

    // 类：抽象的概念 
     构造函数：对象的构造器    用来构造对象的函数

    // 工厂
    function Car(color){
        this.color=color;
    }

    // prototype  返回原型对象
    console.log(Car.prototype);// 原型对象

    // 通过 prototype 向原型对象添加属性和方法
    Car.prototype.name="比亚迪";
    Car.prototype.price="16.68w";
    Car.prototype.func=function(){
        return "撩妹"
    }
    
    // 继承 类 的属性(原型部分)
    // 生产线 
    var car1=new Car("红色");
    car1.type="跑车";
    var car2=new Car("白色");
    console.log(car1);
    console.log(car2);