JavaScript ES6中class定义类实例方法_javascript技巧
时间:2022-07-19 09:15 来源:网络 作者:箫璃 点击:次
前言
正文
1.声明类的两种方式:class 关键字 类的声明
类表达式(不常用)
console.log(Person.prototype) // Person {} console.log(Person.prototype.__proto__) // {} console.log(Person.constructor) // [Function: Function] console.log(typeof Person) // function
2.class 类的构造函数如果我们希望在创建对象的时候给类传递一些参数,这个时候应该怎么做呢?
示例代码如下: // 类的声明 class Person { // 类的构造方法 constructor(name, age) { this.name = name this.age = age } foo () { console.log(this.name) } } var p1 = new Person('h', 19) console.log(p1)// Person { name: 'h', age: 19 } p1.foo() // h
3.class中方法定义
3.1 class 中定义普通的实例方法class Person { // 类的构造方法 constructor(name, age) { this.name = name this.age = age this._address = '北京市' } eating () { console.log(this.name + ' 正在eating~') } running () { console.log(this.name + ' 正在running~') } } var p1 = new Person('jam', 19) console.log(p1) p1.eating() p1.running()
3.2 class 类中定义访问器方法class Person { // 类的构造方法 constructor(name, age) { this.name = name this.age = age this._address = '北京市' } // 类的访问器方法 get address () { // 在这里可以设置拦截访问操作 console.log('获取呢') return this._address } set address (newValue) { // 在这里可以设置拦截设置操作 console.log('修改呢') return this._address = newValue } } var p1 = new Person('jam', 19) console.log(p1.address) p1.address = '天津市' console.log(p1.address)
3.3 类的静态方法(类方法)
小案例:使用类的静态方法完成随机生成Person实例 class Person { // 类的构造方法 constructor(name, age) { this.name = name this.age = age this._address = '北京市' } // 类的静态方法(也称为类方法) 创建对象随机生成一个名字小案例 static randomPerson () { // 创建一个存储名字的数组 let names = ['jam', 'jak', 'jag', 'jao', 'jno'] // Math.random()生成一个0-1之间的数字,小数肯定是不对的 let nameIndex = Math.floor(Math.random() * names.length) let name = names[nameIndex] // 生成随机年龄 let age = Math.floor(Math.random() * 100) // return随机生成的人物 姓名+ 年龄 return new Person(name, age) } }
随机生成一个Person实例(附效果图) // 随机生成一个 var p2 = Person.randomPerson() console.log(p2)
随机生成多个Person实例(附带效果图) // 随机生成多个 for (let index = 0; index < 20; index++) { console.log(Person.randomPerson()) }
文末到此这篇关于JavaScript ES6中class定义类的文章就介绍到这了,更多相关ES6中class定义类内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持! |