前端面试 class加数据类型判断加原型和原型链

最新推荐文章于 2022-11-10 22:56:09 发布

囜囜

最新推荐文章于 2022-11-10 22:56:09 发布

阅读量323

点赞数

分类专栏：原创文章标签： html5 vue.js html es6

本文链接：https://blog.csdn.net/weixin_45391167/article/details/114899222

版权

本文详细探讨了JavaScript中的Class语法、继承、原型和原型链的概念，以及如何判断数据类型。讲解了Class声明、实例化、继承的工作原理，并分析了instanceof、constructor和Object.prototype.toString在判断数据类型时的用法和注意事项。

摘要由CSDN通过智能技术生成

Class &、、继承、、原型、、原型链、、判断数据类型

Class

ES6提供了更接近传统语言的写法，引入了Class（类）这个概念，作为对象的模板。通过class关键字，可以定义类。基本上，ES6的class可以看作只是一个语法糖，它的绝大部分功能，ES5都可以做到，新的class写法只是让对象原型的写法更加清晰、更像面向对象编程的语法而已。

类的声明

比如声明一个类，并声明一个该类的实例

class Student {
   
    //constructor 构造函数
    constructor(name, number){
   
        //创建实例的时候 这里this指向当前创建的实例
        this.name = name 
        this.number = number
        this.gender = 'male'
    }
    sayHi() {
   
        console.log(`${
   this.name} + ${
   this.number}`)
    }
}

// 通过类 声明对象/实例
const gary = new Student('盖瑞',101)
console.log(gary.name)
console.log(gary.number)
console.log(gary.gender)
gary.sayHi()

继承
Class可以通过extends关键字实现继承；这比ES5的通过修改原型链实现继承，要清晰和方便很多。

//继承
//定义一个父类
class People {
   
    constructor(name) {
   
        this.name = name
    }
    eat() {
   
        console.log(`${
   this.name} eat`)
    }
}

//子类一
class Student extends People {
   
    constructor(name, number) {
   
        //通过子类的super函数 把属性传递给父类的constructor函数进行处理
        super(name)
        this.number = number
    }
    sayHi(