JavaScript 面向对象基础简单示例


Posted in Javascript onOctober 02, 2019

本文实例讲述了JavaScript 面向对象。分享给大家供大家参考,具体如下:

JavaScript  面向对象

  • this:this代指对象(python self)
  • 对象 = new 函数():创建对象:添加“new 函数()”相当与创建对象
  • 类名:prototype={方法} : 创建类原型

类:

<script>
function Foo(n){
  this.name = n;
  this.sayName = function(){
    console.log(this.name)
  }
}
var obj1 = new Foo('3water');
obj1.name
obj1.sayName()
var obj2 = new Foo('三水点靠木');
obj2.name
obj2.sayName ()
</script>

运行结果:

JavaScript 面向对象基础简单示例

:obj1~2 对象内存里会重复调用this.sayName,从而增加内存损耗。
:创建obj对象并传入参数、obj1.name就是we。
:obj1.sayNmae() 执行方法 调用obj1的name等于we。

类原型:

<script>
function Foo(n){
  this.name = n;
}
// Foo的原型
Foo.prototype = {
  'sayName': function(){
  console.log(this.name)
  }
}
var obj1 = new Foo('欢迎访问');
obj1.name
obj1.sayName()
var obj2 = new Foo('3water.com');
obj2.name
obj2.sayName()
</script>

运行结果:

JavaScript 面向对象基础简单示例

:每一个对象内只封装了一个name。
:调用obj1.sayName()时会先找Foo类,然后在去Foo的原型里找sayName。

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
jquery 表单取值常用代码
Dec 22 Javascript
dojo随手记 gird组件引用
Feb 24 Javascript
jQuery中将函数赋值给变量的调用方法
Mar 23 Javascript
JavaScript实现QueryString获取GET参数的方法
Jul 02 Javascript
js判断上传文件类型判断FileUpload文件类型代码
May 20 Javascript
初步认识JavaScript函数库jQuery
Jun 18 Javascript
jQuery自适应轮播图插件Swiper用法示例
Aug 24 Javascript
React Router基础使用
Jan 17 Javascript
JS 组件系列之BootstrapTable的treegrid功能
Jun 16 Javascript
详解用vue编写弹出框组件
Jul 04 Javascript
vue2过滤器模糊查询方法
Sep 16 Javascript
详解JavaScript 作用域
Jul 14 Javascript
Nautil 中使用双向数据绑定的实现
Oct 02 #Javascript
详解element-ui级联菜单(城市三级联动菜单)和回显问题
Oct 02 #Javascript
基于iview-admin实现动态路由的示例代码
Oct 02 #Javascript
你不可不知的Vue.js列表渲染详解
Oct 01 #Javascript
基于VUE的v-charts的曲线显示功能
Oct 01 #Javascript
Echarts地图添加引导线效果(labelLine)
Sep 30 #Javascript
javascript实现摄像头拍照预览
Sep 30 #Javascript
You might like
乐信RP2100的电路分析和打磨
2021/03/02 无线电
Get或Post提交值的非法数据处理
2006/10/09 PHP
php下用cookie统计用户访问网页次数的代码
2010/05/09 PHP
thinkphp 多表 事务详解
2013/06/17 PHP
thinkphp使用literal防止模板标签被解析的方法
2014/11/22 PHP
php文件上传简单实现方法
2015/01/24 PHP
WordPress中对访客评论功能的一些优化方法
2015/11/24 PHP
thinkphp5.1框架实现格式化mysql时间戳为日期的方式小结
2019/10/10 PHP
jquery radio 操作代码
2011/03/16 Javascript
jquery插件制作 图片走廊 gallery
2012/08/17 Javascript
jQuery替换textarea中换行的方法
2015/06/10 Javascript
javascript实现查找数组中最大值方法汇总
2016/02/13 Javascript
JS实现图片放大缩小的方法
2017/02/15 Javascript
jQuery实现的文字逐行向上间歇滚动效果示例
2017/09/06 jQuery
微信小程序实现天气预报功能
2018/07/18 Javascript
layui 表单标签的校验方法
2019/09/04 Javascript
Vue包大小优化的实现(从1.72M到94K)
2021/02/18 Vue.js
Python中使用md5sum检查目录中相同文件代码分享
2015/02/02 Python
Python之文字转图片方法
2018/05/10 Python
浅谈pytorch和Numpy的区别以及相互转换方法
2018/07/26 Python
Django Rest framework之权限的实现示例
2018/12/17 Python
python 随机森林算法及其优化详解
2019/07/11 Python
使用Python实现图像标记点的坐标输出功能
2019/08/14 Python
Python随机函数库random的使用方法详解
2019/08/21 Python
使用Python的Turtle库绘制森林的实例
2019/12/18 Python
Python内置数据类型list各方法的性能测试过程解析
2020/01/07 Python
Python找出列表中出现次数最多的元素三种方式
2020/02/24 Python
python3将变量写入SQL语句的实现方式
2020/03/02 Python
SIDESTEP荷兰:在线购买鞋子
2019/11/18 全球购物
程序集与命名空间有什么不同
2014/07/25 面试题
毕业生简单求职信
2013/11/19 职场文书
优秀学生干部推荐材料
2014/02/03 职场文书
2014年幼儿园班级工作总结
2014/12/17 职场文书
个人德育工作总结
2015/03/05 职场文书
2015年乡镇安全生产工作总结
2015/05/19 职场文书
Python自然语言处理之切分算法详解
2021/04/25 Python