面向对象编程

对象

1.对象可以让代码结构更清晰

2.对象复杂数据类型object.

3.本质:对象就是一组无序的相关属性和方法的集合。

4.构造函数泛指某一大类 ,比如苹果,不管是红色苹果还是绿色苹果,都统称为苹果。

5.对象实例特指-个事物,比如这个苹果等

6.for..in语句用于对对象的属性进行循环操作。

定义

在js中，对象是一组无序数据集合（包含属性和相关方法）

属性： 事物的特征 （一般名词）

方法： 事务的行为 (一般动词)

创建对象

对象的属性名是字符串,写的时候一般是省略了””,自动会转为字符串。

1.利用new Object创建对象

(1）我们是利用等号=赋值的方法添加对象的属性和方法

(2）每个属性和方法之间用分号结束

 var obj = new Object();
 obj.name = "lisi";
 obj.sex = "nv";
 obj.song = function(){
     alert("唱歌")
  }

2.利用字面量创建对象{}

(1)里面的属性或者方法我们采取键值对的形式 键 属性名: 值 属性值

(2)多个属性或者方法中间用逗号隔开的

(3)方法冒号后面跟的是一个匿名函数

 var obj1 = {
    name:"zhangsan",  
    sex:"男",
    age:18,
    sayHi:function(){
            alert(this.age)    //类的方法里 可以操作自身的属性 this
     }
 } 

构造函数

1.构造函数名字首字母要大写

2.构造函数不需要return就可以返回结果

3.调用构造函数必须使用 new

4.我们只要new star()调用函数就创建一个对象ldh {}

构造函数的语法格式

function 构造函数名() {

this.属性 = 值;

this.方法 = function (){}

}

//构造函数 一大类 在其他语言里类似 class的思想
    function Student(sname,age){   //首字母要大写
        this.name = sname;
        this.age = age;
        this.xx  = "123456";
        this.eat = function(food){
            console.log(food)
        }
    }

使用

new 构造函数名();

//new 实例化  (对象的实例化)
    var zhangsan = new Student("zhangsan","11")
    zhangsan.eat("馄饨")
    console.log(zhangsan)

new关键字执行过程

1. new构造函数可以在内存中创建了一个空的对象
2. this就会指向刚才创建的空对象
3．执行构造函数里面的代码给这个空对象添加属性和方法
4．返回这个对象

 

使用对象

1.调用对象的属性

(1)对象名.属性名

(2)对象名[“属性名”] 用[]属性名需要添加””变为字符串,如: [“name”]

console.log(obj1.name);
console.log(obj1.sex);
​
console.log(obj["sex"]);

2.调用对象的方法

对象名.方法名()

对象方法和函数的区别

–函数单独声明 函数名()

–方法 在对象内 调用时候 对象.方法()

 obj1.sayHi();

3.删除属性

// delete obj.age
// delete obj["age"]
// delete obj.sayH

4.查看对象是否存在某个属性

有则返回true，没有返回false

console.log("age" in obj); //true
console.log("name" in obj); //false

5.with操作对象

里面是代码块 作用是操作同一个对象的多个属性，提供一些书写方便。

只能修改属性值， 不能添加

   with (obj) {
      age = 30;
      uname = "lili"; //无效
      console.log(123);
    }

 

遍历对象

1.for (变量 in 对象) {}

   var obj = {
        name:"zhangsan",
        age:11,
        sex:"nan"
    }
    //for in循环遍历对象  （k key代表键值的含义）
    for(var k in obj){
        console.log(k)      //k变量输出 得到的是属性名
        console.log(obj[k]);  //obj[k]得到的是 属性值  不能使用obj.k 结果为undefined
    }

2.Object 是 js 内置的对象 里面封装了操作js对象的属性和方法。

 var keys = Object.keys(obj);  //遍历对象的所有属性名，提取出来放到数组里
 console.log(keys);

// 推荐遍历对象用这种方式，性能比for in 遍历更高。
Object.keys(obj).forEach(function (item) {
      console.log(item + ":" + obj[item]);
    })

面向对象编程

js具有很强的面向对象的编程能力，也是一门面向对象的编程语言。

面向对象编程(OOP): 现在比较主流的编程范式。它将真实世界中的各种复杂关系，抽象为一个个对象，用对象之间的分工与合作，完成对真实世界的模拟。

在代码中用对象去描述现实生活中的事物，更好理解。

—-类: 是一个抽象概念，是一类相似特征的集合。比如人类，就是所有人的集合。

—-实例化: 由类产生对象的过程，就叫实例化。

—-对象: 是一个实体，一个可以直接使用，可以看见的实体。由类产生的实体就叫对象，对象就有类的所有属性和方法。对象就是一类属性和方法的集合。

构造函数

是一个特殊的函数，用来模拟类，是产生对象的模板。

函数内部使用了this关键词，this代表的是要产生对象的实体。

必须要使用new关键词实例化。new关键词会创建一个{},this指向的就是这个{}

new.target

如果当前函数是new命令调用，new.target指向的是当前函数，否则是undefined

    function ClassAniaml() {
      console.log(this); // 非严格模式下，函数的this指向的是window全局对象。
      console.log(new.target);
    }
    ClassAniaml();      // window对象        undefined
    new ClassAniaml();  // ClassAniaml{}对象  函数本身

instanceof

返回一个bool值，表示对象是否为某个构造函数的实例。

  var son1 = new Son(); 
  console.log(son1 instanceof Fater);  //false
  console.log(son1 instanceof Son);  //true

Object方法

Object.create()

Object.create( proto(原型, [propertiesObject]（对象属性，可省略））

可以把一个对象作为原型，生成新的实例对象。

    var cat = {
      name: "cat",
      age: 10
    }
    cat1 = Object.create(cat, { go: { value: "go1" } });
  // 以cat为原型，创建一个新的对象，给创建的对象添加了go属性，属性值是go1.
    console.log(cat1);
    /*
      { go: "go1"
        [[Prototype]]: Object
          age: 10
          name: "cat"
          [[Prototype]]: Object
      } */

Object.getPrototypeOf(obj)

返回参数对象的原型，是获取原型对象的标准方法

 console.log(Object.getPrototypeOf(son1));  //{move: ƒ, constructor: ƒ}

Object.setPrototypeOf(obja,objb)

设置参数对象的原型。 把a的原型设置为b

    var a = { name: "a" };
    var b = { age: 123 };
    Object.setPrototypeOf(a, b); // 把a的原型设置为b
    console.log(a);
     /*   {
        name: "a"
        [[Prototype]]: Object
          age: 123
          [[Prototype]]: Object
      } */

isPrototypeOf(obj)

用于判断一个对象是否为参数对象的原型.

    var a = { name: "a" };
    var c = Object.create(a);
    console.log(a.isPrototypeOf(c)); //  true   判断a对象是否为c对象的原型

__proto__

返回对象的原型

console.log(c.__proto__); //{name: 'a'}

hasOwnProperty()

用于判断属性是在对象自身(true)还是原型

console.log(a.hasOwnProperty("name"));  //true

 

对象的继承

面向对象编程很重要的一个特征就是有继承概念。

A对象继承B对象，A对象就有了B对象的所有属性和方法。

大部分面向对象编程语言都是通过类实现继承，js没有类的体现，只能通过改变this指向的方式实现继承。

  function M() {
    this.family = "aa";
  }
  function Animals(name, age) {
      this.name = name;
      this.age = age;
      this.mouse = function () {
        console.log("mouse");
      }
    }
  function Cat() {
      M.call(this); // 可以多重继承
      Animals.call(this, "cat1", 10);  //通过改变Animals的this指向Cat，实现继承。
      this.color = "red"
      this.move = function () {
        console.log("move");
      }
    }
​
    var cat1 = new Cat();
    console.log(cat1); 
    //Cat {family :'aa',name: 'cat1', age: 10, color: 'red', mouse: ƒ, move: ƒ}