JS(第二十七课)JavaScript的面向对象思想

简介: JS(第二十七课)JavaScript的面向对象思想

JS(第十课)JS中的对象_星辰镜的博客-CSDN博客

1 对象的创建方式

方式一

var people = {
    // 对象的属性
    id: "789678200010090987",
    name: "王者荣耀",
    age: 78,
    sex: "男",
    height: "189",
}
console.log(people)

方式二

function Student(id, name, sex, age, height) {
    this.id = id;
    this.name = name;
    this.sex = sex;
    this.age = age;
    this.height = height;
}
let Students = new Student("1", "我是数据", "男", 23, "190") //对象的实例化
console.log(Students)

2 创建一个类名

// 创建一个类名
class Dog {
    // 共同有的属性放在里面
    constructor(id, name, sex, age, sleep) {
        this.id = id;
        this.name = name;
        this.sex = sex;
        this.age = age;
        this.sleep = sleep;
    }
}
// 利用new关键字创建对象
let dog1 = new Dog("1002", "小胡", "男", 16, "睡觉")
console.log(dog1)

class Duck {
    constructor(id, name, sex, age, sleep) {
        this.id = id;
        this.name = name;
        this.sex = sex;
        this.age = age;
        this.sleep = sleep;
    }
    sing(song) {
        console.log(this.name + `叫` + song)
    }
}
let duck1 = new Duck("1003", "小民", "男", 1, "睡觉")
console.log(duck1)
duck1.sing('dog呀听话不要狗叫')

1. 通过class 关键字创建类, 类名我们还是习惯性定义首字母大写

2. 类里面有个constructor 函数,可以接受传递过来的参数,同时返回实例对象

3. constructor 函数 只要 new 生成实例时,就会自动调用这个函数, 如果我们不写这个函数,类也会自动生成这个函数

4. 多个函数方法之间不需要添加逗号分隔

5. 生成实例 new 不能省略

6. 语法规范, 创建类 类名后面不要加小括号,生成实例 类名后面加小括号, 构造函数不需要加function

3 类的继承

class Object {
    constructor(x, y, z) {
        this.x = x;
        this.y = y;
        this.z = z;
    }
    sum() {
        // 累加
        console.log(this.x + this.y + this.z)
    }
    Accumulation() {
        // 累*
        console.log(this.x - this.y - this.z)
    }
}

//子元素继承父类
class Son extends Object {
    constructor(x, y, z) {
        //使用super调用了父类中的构造函数
        super(x, y, z)
    }
}
let son = new Son(10, 10, 20);
son.sum();
son.Accumulation()

1. 继承中,如果实例化子类输出一个方法,先看子类有没有这个方法,如果有就先执行子类的


2. 继承中,如果子类里面没有,就去查找父类有没有这个方法,如果有,就执行父类的这个方法(就近原则)


3. 如果子类想要继承父类的方法,同时在自己内部扩展自己的方法,利用super 调用父类的构造函数,super 必须在子类this之前调用

4 父类有加法方法

 // 父类有加法方法
 class Father {
    constructor(x, y) {
    this.x = x;
    this.y = y;
    }
    sum() {
    console.log(this.x + this.y);
    }
  }
  // 子类继承父类加法方法 同时 扩展减法方法
  class Son extends Father {
    constructor(x, y) {
    // 利用super 调用父类的构造函数 super 
    // 必须在子类this之前调用,放到this之后会报错
    super(x, y);
    this.x = x;
    this.y = y;
   }
   subtract() {
   console.log(this.x - this.y);
   }
 }
 var son = new Son(5, 3);
 son.subtract(); //2
 son.sum();//8

5 这个函数要实例化

class Father {
    // 这个函数要实例化
    constructor(money, cars, house, company) {
        this.money = money;
        this.cars = cars;
        this.house = house;
        this.company = company;
    }
    manage() {
        console.log("我是管理manage的思想方法")
    }
}
class Son extends Father {
    constructor(money, cars, house, company) {
        // 利用super 调用父类的构造函数
        super(money, cars, house, company);
    }
}
let Sum = new Son("100", "红旗110", "南昌", "1109")
console.log(Sum)
Sum.manage()

 

 

相关文章
|
10天前
|
JavaScript 前端开发
【JavaScript】——JS基础入门常见操作(大量举例)
JS引入方式,JS基础语法,JS增删查改,JS函数,JS对象
|
2月前
|
JavaScript 前端开发 Java
springboot解决js前端跨域问题,javascript跨域问题解决
本文介绍了如何在Spring Boot项目中编写Filter过滤器以处理跨域问题,并通过一个示例展示了使用JavaScript进行跨域请求的方法。首先,在Spring Boot应用中添加一个实现了`Filter`接口的类,设置响应头允许所有来源的跨域请求。接着,通过一个简单的HTML页面和jQuery发送AJAX请求到指定URL,验证跨域请求是否成功。文中还提供了请求成功的响应数据样例及请求效果截图。
springboot解决js前端跨域问题,javascript跨域问题解决
|
2月前
|
JavaScript 前端开发
Moment.js与其他处理时间戳格式差异的JavaScript库相比有什么优势?
Moment.js与其他处理时间戳格式差异的JavaScript库相比有什么优势?
|
2月前
|
JSON JavaScript 前端开发
使用JavaScript和Node.js构建简单的RESTful API
使用JavaScript和Node.js构建简单的RESTful API
|
3月前
|
Web App开发 JavaScript 前端开发
Node.js:JavaScript世界的全能工具
Node.js:JavaScript世界的全能工具
|
3月前
|
JSON JavaScript 前端开发
使用JavaScript和Node.js构建简单的RESTful API服务器
【10月更文挑战第12天】使用JavaScript和Node.js构建简单的RESTful API服务器
32 0
|
8月前
|
JavaScript 前端开发 Java
深入JS面向对象(原型-继承)(一)
深入JS面向对象(原型-继承)
67 0
|
JavaScript C#
js 面向对象封装与继承 COPY
js 面向对象封装与继承
113 0
|
JavaScript C#
js 面向对象封装与继承
js 面向对象封装与继承
403 0
|
JavaScript 前端开发
JavaScript 面向对象之继承
JavaScript 面向对象之继承
137 0
JavaScript 面向对象之继承