ES6 面向对象

类的写法

{
    // ES6面向对象:
    // 类的写法:
    class Person{//typeof function类型
        age = 20;//属性也可以这样写 -> 这是公有属性,外内都可以调用;
        #hei = "178cm";//私有属性
        constructor(name){//-> function Person(name){}
            this.name = name;
        }
        fn(){// -> Person.prototype.fn = function(){}
            console.log("hello")
        }
        getAge(){
            console.log(this.age);
        }
        getHei(){
            console.log(this.#hei);
        }
    }

    let zhangsan = new Person("张三");
    console.log(zhangsan);
    zhangsan.getAge();//20
    zhangsan.getHei();//178cm 注意用法
    console.log(zhangsan.hei);//undefined
}

静态属性和静态方法

{
    class Person{
        static age = 10;//静态属性->1.属于类的属性;2.不需要实例化就可以调用
        static foo(){//静态方法
            console.log("foo")
        }
        constructor(name){
            this.name = name;
        }
    }

    console.log(Person.age);
    Person.foo();
}

继承

{
    // 继承
    class Dad{
        constructor(height){
            this.height = height;
        }
        foo(){
            console.log("foo");
        }
        setStyle(){
            console.log("父类一些逻辑")
        }
    }

    class Son extends Dad{//extends关键字
        constructor(height){
            super(height);//==调用了父类的构造函数-> 这里把构造函数和原型都进行继承过来了!
            // 注意参数传递
        }
        setStyle(){//可以 扩展逻辑 使用 super.父类();
            super.setStyle();//调用父类函数
            console.log("子类一些逻辑");
        }
    }

    let zhangsan = new Son("178cm");
    console.log(zhangsan);
    zhangsan.setStyle();
}

原文地址:https://www.cnblogs.com/Afanadmin/p/12359852.html

时间: 2024-11-07 09:17:24

ES6 面向对象的相关文章

ES6 面向对象 promise

1. 变量/赋值 var 可以重复定义.不能限制修改.没有块级作用域 let 不能重复定义, 变量,块级作用域 const 不能重复定义, 常量,块级作用域 结构赋值 数组解构赋值 对象解构赋值 2. 函数 箭头函数 function(参数,参数){ // 函数体 } (参数, 参数)=>{ // 函数体 } let arr=[12,5,88,34,32,19]; /*arr.sort(function (n1, n2){ return n1-n2; });*/ arr.sort((n1, n2

基于jquery的ES6面向对象选项卡

ES5中的面向对象相信大家都非常熟悉,包括一系列的配置参数,方法,自定义事件等,现在简单介绍一下es6面向对象的一些知识还有一个基于jquery的es6面向对象选项卡的写法. ES6中提供了基于类class的面向对象语法.但class实际上是ES6提供的一颗语法糖,JavaScript是一门基于原型的面向对象语言. // 父类 class Test { // 构造器 constructor (arg1, arg2) { this.arg1 = arg1; this.arg2 = arg2; }

ES6 面向对象编程思想

ES6 面向对象概念 /* 小明去餐厅吃饭: 面向过程:小明走去餐厅看菜单点餐吃饭; 面向对象: 对象:1.小明.2.餐厅 特征属性行为:1.小明(走.看.点餐.吃); 2.餐厅(菜单) 研究对象之间的关系: 小明.走餐厅.菜单 小明.看 小明.点餐 小明.吃 两种思维方式不一样,但是达到的结果都是一样的 */ 原文地址:https://www.cnblogs.com/Afanadmin/p/12355376.html

ES6面向对象的浅理解。

网上一些es6资源还是很多的在对于es6面向这块比较少,所以新人在学习的时候做了一些总结. 因本人并不资深也能看懂,直接贴代码. class Person{ //为对象添加属性 constructor(name='default',age=0){ //给参数传默认值,防止调用时忘记传实参而报错 this.name=name; this.age=age; } //为对象添加方法 showName(){ alert(this.name); } showAge(){ alert(this.age);

ES6面向对象实现tab栏切换效果

面向对象实现tab栏切换效果 原文地址:https://www.cnblogs.com/malong1992/p/11517123.html

ES6——面向对象-基础

面向对象原来写法 类和构造函数一样 属性和方法分开写的 // 老版本 function User(name, pass) { this.name = name this.pass = pass } User.prototype.showName = function () { console.log(this.name) } User.prototype.showPass = function () { console.log(this.pass) } var u1 = new User('ab

粗看ES6之面向对象写法

在es6以前,js没有类的概念,虽然有构造函数原型的方式用来做面向对向开发,但是对于书法并不是十分友好,而且对于继承实现也不是十分友好. es6引入class constructor extends super等关键字简化了JS面向对象写法,以后可以跟后端说JS也终于是有类的一门语言了,哈哈. ES6的面向对象写法如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT

ES6常用知识点小结

ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准. 因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015(简称ES2015).虽然浏览器在不断更新,但并不是所有用户的电脑浏览器都支持ES6,所以在使用的过程中建议还是转成es5,保证代码的可执行性.至于转换的方式大家可以用Babel或者Traceur转码器. 1. let 和 const 在ES6以前,Javascript并没有块级作用域的概念,有的是全局作用域和函数作用域,而let的出

PHP面向对象初中高级之由浅入深

php面向对象编程基本实践:(了解类,类到对象的实例化,构造和析构,对象的引用); 类的概念: 物以类聚,把具有相似特性的对象对垒到一个类中 类定义了这些相似对象拥有的相同的属性和方法 类是相似对象的描述,成为类的定义,是该类对象的蓝图或者原型 类的对象称为一个类的实例. 类的属性和方法统称为类成员 实例化的概念.类的定义和调用 类的实例化就是通过类的定义创建一个对象 类的定义以关键字class开始,后面跟着这个类的名称.类的命名通常每个单词的第一个字母大写,以大括号开始和结束 类的实例化为对象