面向对象编程


对象

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: ƒ}

 

 

原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/279212.html

(0)
上一篇 2022年8月6日
下一篇 2022年8月6日

相关推荐

发表回复

登录后才能评论