初探JavaScript 面向对象(推荐)
时间:2019-04-01
本文章向大家介绍初探JavaScript 面向对象(推荐),主要包括初探JavaScript 面向对象(推荐)使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
类的声明
1. 构造函数
function Animal() { this.name = 'name' } // 实例化 new Animal()
2. ES6 class
class Animal { constructor() { this.name = 'name' } } // 实例化 new Animal()
类的继承
1. 借助构造函数实现继承
原理:改变子类运行时的 this 指向,但是父类原型链上的属性并没有被继承,是不完全的继承
function Parent() { this.name = 'Parent' } Parent.prototype.say = function(){ console.log('hello') } function Child() { Parent.call(this) this.type = 'Child' } console.log(new Parent()) console.log(new Child())
2. 借助原型链实现继承
原理:原型链,但是在一个子类实例中改变了父类中的属性,其他实例中的该属性也会改变子,也是不完全的继承
function Parent() { this.name = 'Parent' this.arr = [1, 2, 3] } Parent.prototype.say = function(){ console.log('hello') } function Child() { this.type = 'Child' } Child.prototype = new Parent() let s1 = new Child() let s2 = new Child() s1.arr.push(4) console.log(s1.arr, s2.arr) console.log(new Parent()) console.log(new Child()) console.log(new Child().say())
3. 构造函数 + 原型链
最佳实践
// 父类 function Parent() { this.name = 'Parent' this.arr = [1, 2, 3] } Parent.prototype.say = function(){ console.log('hello') } // 子类 function Child() { Parent.call(this) this.type = 'Child' } // 避免父级的构造函数执行两次,共用一个 constructor // 但是无法区分实例属于哪个构造函数 // Child.prototype = Parent.prototype // 改进:创建一个中间对象,再修改子类的 constructor Child.prototype = Object.create(Parent.prototype) Child.prototype.constructor = Child // 实例化 let s1 = new Child() let s2 = new Child() let s3 = new Parent() s1.arr.push(4) console.log(s1.arr, s2.arr) // [1, 2, 3, 4] [1, 2, 3] console.log(s2.constructor) // Child console.log(s3.constructor) // Parent console.log(new Parent()) console.log(new Child()) console.log(new Child().say())
总结
以上所述是小编给大家介绍的JavaScript 面向对象(推荐)的相关知识,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!
- 如何在Kudu1.5中使用Sentry授权
- 深度学习入门实战
- 如何使用Zookeeper实现HiveServer2的HA
- Python 统计个人加密货币资产
- 如何使用HAProxy实现HiveServer2负载均衡
- 机器学习之决策树算法
- 如何使用HAProxy实现Impala的负载均衡
- 解读GEO数据存放规律及下载,一文就够
- 从GEO数据库下载得到表达矩阵 一文就够
- 机器学习各类算法比较
- Kerberos环境下删除ZooKeeper服务注册信息问题分析
- 根据分组信息做差异分析- 这个一文不够的
- 如何使用Cloudera Manager启用YARN的HA
- 如何使用java代码通过JDBC连接Hive(附github源码)
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 额度模型(一)
- GitHub Actions使用入门
- freeswitch笔记(9)-esl outbound中如何放音采集按键?
- react childern添加事件
- Spring事务的传播行为案例分析
- ThreadLocal与Java引用类型(文末含福利)
- GitLab 12 跨版本 13 升级
- 打破你的认知!Java空指针居然还能这样玩,90%人不知道…
- Android 原生 SQLite 数据库的一次封装实践
- Window常用账号密码修改(Git)
- 高通AI研究院|高效网络设计|结构化卷积分解
- tomcat调优 tomcat配置优化
- error: PyThreadState {aka struct _ts} has no member named exc_type
- Python创建目录文件夹
- python 按顺序读文件夹下面的文件