文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

es6类的静态成员是什么

2023-07-04 13:28

关注

本篇内容主要讲解“es6类的静态成员是什么”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“es6类的静态成员是什么”吧!

在es6中,由类直接调用的属性和方法叫静态成员。在类里面对变量、函数加static关键字,那它就是静态成员;静态成员不会被实例化成为新对象的元素。静态成员和实例成员的区别:1、实例成员属于具体的对象,而静态成员为所有对象共享;2、静态成员是通过类名或构造函数访问,实例成员是通过实例化的对象访问。

面向对象

面向对象的主要思想就是把需要解决的问题分解成一个个对象,建立对象不是为了实现一个步骤,而是为了描述每个对象在解决问题中的行为,面向对象的核心是对象

面向对象的优势:

面向对象的特征:

ES6面向对象语法

ES6:ES是ECMAScript的简写,它是JavaScript的语法规范。ES6是在ES5基础上扩展,增加了面向对象编程的相关技术以及类的概念。

类和对象

:具有相同属性和行为的集合称为类(类是对象的抽象),类中的大多数数据只能用本类的方法进行处理。
对象:是类的实例(是类的具体化)

class关键字:用来定义类的

class 类名{// "类名"是一个用户标识符 通常建议首字母大写           属性;           函数;}

构造函数

在ES6中使用constructor()来定义构造函数,作用是初始化对象的属性(成员变量),构造函数不是必须的,若用户没有定义构造函数,系统会生成一个默认的、无参的构造函数。

普通的成员函数

函数名([参数]){     函数体语句}
变量名 = function([参数]){      函数体语句}
            class Person{                constructor(name,age,sex){// 构造函数 初始化对象的成员                    this.name = name;// this指向构造函数新创建的对象                    this.age = age;                    this.sex = sex;                }                    tt = function(){ //普通的成员函数                    console.log(this.name);                    console.log(this.age);                    console.log(this.sex);                }            }            var p = new Person('李相赫',25,'男')// p1是一个对象 通过调用构造函数对p1的三个属性进行了初始化            p.fun();
        class Circle{// 定义类Circlie            constructor(r){                this.radius = r;            };            area(){ // 计算圆的面积                var s = Math.PI*this.radius**2;                return s;            };            // 计算圆的周长            CircleLength = function(){            return 2*Math.PI*this.radius;            };        };        var c1 = new Circle(5);        console.log('半径为5的圆的面积='+c1.area());        console.log('半径为5的圆的周长='+c1.Circle_length());

结果如下:

es6类的静态成员是什么

// 用类实现简单的四则运算        class Number{// 定义类Number            constructor(n1,n2){                this.n1=n1;                this.n2=n2;            };            add(){                var sum = this.n1+this.n2;                return sum;            };            sub(){                var sum1 = this.n1-this.n2;                return sum1;            };            mut(){                var sum2 = this.n1*this.n2;                return sum2;            };            p(){                if(this.n2!=0){                    var sum3 = this.n1/this.n2;                    return sum3;                }            }        }        var p1 = new Number(12,21);        console.log(p1.add());        console.log(p1.sub());        console.log(p1.mut());        console.log(p1.p());

ES6中类的继承

在JavaScript中,继承用来表示两个类之间的关系,子类可以继承父类的一些属性和方法,在继承以后还可以增加自己独有的属性和方法。

语法:

class 子类名 extends 父类名{       函数体语句;};

关于继承需要注意:

super关键字

子类不可以继承父类的构造函数,如果要调用父类的构造函数可以使用super关键字。

**注意:**在子类的构造函数中使用super调用父类的构造函数,则调用语句必须作为子类构造函数的第一条语句

调用父类构造函数

super([参数])

调用普通成员函数

super.函数名([参数])

方法覆盖

若子类中定义的函数与父类中的函数同名,子类函数覆盖父类中的函数,可以在子类中调用父类的同名的普通成员函数来解决

        class Father{ //父类(基类或超类)            constructor(type,color){                this.type = type;                this.color = color;            }            money(){                console.log(100);            }            show(){                console.log('类型:'+this.type);                console.log('颜色:'+this.color);            }        }        class Son extends Father{ //Son是子类(又称派生类)            constructor(type,color,weight){                super(type,color); //调用父类的构造函数 要放在首位                this.weight = weight;            };            show(){                super.show();// 调用父类的普通成员函数                console.log('重量:'+this.weight);            };            other(){                return '子类的其他方法';            };        };        var s1 = new Son('iPhone 12','黑色','3000g');//s1为子类的实例        s1.show();        console.log(s1.other());

es6类的静态成员是什么

静态成员和实例成员

静态成员:通过类名构造函数访问的成员

实例成员:通过实例对象访问的成员称为实例成员

区别:

在ES5中定义静态属性

        function Student(name,age,sex){            Student.school = '西安邮电大学';// school是静态成员            this.name = name;            this.age = age;            this.sex = sex;// name age sex都是实例成员            this.show = function(){                console.log('姓名:'+this.name);                console.log('年龄:'+this.age);                console.log('性别:'+this.sex);            };        };        var f = new Student('李相赫',23,'男');        f.show();        console.log(Student.school);// 西安邮电大学        console.log(f.school);// undefined

在ES6中静态属性定义

先创建类

在类的外部定义静态属性:类名.静态属性名

        class Foo{            constructor(){                this.color = '红色';// color是实例成员            }        }        Foo.prop = 45;// prop是静态成员        var f1 = new Foo();        console.log('静态属性:'+Foo.prop);// 45        console.log(f1.prop);// undefined

在ES7中静态属性定义

在类定义时 使用static关键字定义静态属性

        class Foo{            static prop = 45; //prop是静态成员            constructor(){                this.color = '红色';            }        }        var f2 = new Foo();        console.log('静态属性:'+Foo.prop);// 45        console.log(f2.prop);// undefined

类和构造函数的区别

类中的成员方法是定义在类中的,使用类创建对象后,这些对象的方法都是引用了同一个方法,这样可以节省内存空间。

class Person {sing(){console.log('hello');}}var p1 = new Person();var p2 = new Person();console.log(p1.sing === p2.sing);// 输出结果:true

到此,相信大家对“es6类的静态成员是什么”有了更深的了解,不妨来实际操作一番吧!这里是编程网网站,更多相关内容可以进入相关频道进行查询,关注我们,继续学习!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-后端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯