美文网首页
27-class基本语法

27-class基本语法

作者: 早起的鸟儿 | 来源:发表于2019-11-03 09:15 被阅读0次

什么是类 :多个具有相同属性和方法的对象的集合;
什么是对象:可以拥有属性和方法的一个集合;

比如:真实生活中,一辆汽车是一个对象。对象有它的属性,如重量和颜色等,方法有启动停止等。所有汽车都有这些属性,但是每款车的属性都不尽相同。所有汽车都拥有这些方法,但是它们被执行的时间都不尽相同。

类可以理解为一个模板,而对象就是根据这个模板造出来的具体实例。

一、创建对象的方法:
  1. 通过字面量语法:
let obj = {
    userName:"zhangsan",
    age:18,
    run:function(){
        console.log("这是一个方法")
    }
}
  1. 通过构造函数创建:
function Cat (name) { 
    this.name = name
}
let obj = new Cat("miao");
obj.name;  //miao
二、类

ES5中不能直接定义类,可以通过构造函数,定义并生成新对象,模拟一个类

function Cat(name, sex) {
    this.name = name,
    this.sex = sex,
    this.sayName = function(){
        console.log("我是一个只喵")
    }
}
let obj = new Cat("miao", "女");
console.log(obj.name);
console.log(obj.sex)
obj.sayName()
三、Class基本语法

ES6提供了更接近传统语言的写法,引入了Class(类)这个概念,作为对象的模板。通过class关键字,可以定义类。

class 类名 {
    constructor(){
        属性名:属性值
    }
    func1(){
        ...
    }
    func2(){
        ...
    }
    ...
}

//定义个Tabs类
class Tabs{
    constructor(name){
        this.name = name
    }
    fn(){
        console.log("fn")
    }
    init(){
        console.log("init")
    }
}


let tabs = new Tabs('lisi');
console.log(tabs)

//等同于:
//ES5写法
function Fn(){
    this.name = "zhangsan"
}
Fn.prototype.run = function(){
    console.log("run")
}
Fn.prototype.init = function(){
    console.log("init")
}
var fn = new Fn();
fn.run()

可以看到里面有一个constructor方法,这就是构造方法,而this关键字则代表实例对象

四、
image.png

强调:构造函数才有prototype属性,对象是没有的,只有实例对象有这个proto这个属性,函数也有这个proto属性,因为函数也是一个对象。

相关文章

网友评论

      本文标题:27-class基本语法

      本文链接:https://www.haomeiwen.com/subject/bbncmctx.html