JavaScript中的对象和原型(一)


Posted in Javascript onAugust 12, 2016

面向对象的语言(如Java)中有类的概念,而通过类可以创建任意多个具有相同属性和方法的对象。但是,JavaScript 没有类的概念,因此它的对象也与基于类的语言中的对象有所不同。

要了解面向对象,首先就要了解Javascript中的对象和原型。这篇文章中主要学习一下Javascript中的对象。

  一 关于对象

对象其实就是一种引用类型。而对象的值就是引用类型的实例。在JavaScript 中引用类型是一种数据结构,将数据和功能组织在一起。它也常被称做为类,但JavaScript 中却没有类的概念。虽然JavaScript 是一门面向对象的语言,却不具备传统面向对象语言所支持的类和接口等基本结构。

二 对象的创建以及常用操作

1.使用new运算符

<script>
var user = new Object(); //使用new运算符创建一个对象
user.name = '念在三角湖畔'; //给对象添加属性
user.age = 22;
user.address = '湖北武汉';
alert(user.name + " " +user.age);//返回 '念在三角湖畔 湖北武汉'
</script>

说明:上面的方式中new关键字可以省略,即var user = new Object();等价于 var user = Object();

2.JSON法创建

关于JSON的一些知识可以百度上搜索下。

简单的JSON对象: {name:'念在三角湖畔',age:22,address:'湖北武汉'}

//使用JSON法创建
/*
简单的JSON对象:{name:'念在三角湖畔',age:22,address:'湖北武汉'}
*/
var user = {
name:'念在三角湖畔',
age:22,
address:'湖北武汉' 
};
alert(user.name + " " +user.age);//返回 '念在三角湖畔 湖北武汉'

3.传统赋值方式

//传统赋值
var user = {};
user.name = '念在三角湖畔'; //给对象添加属性
user.age = 22;
user.address = '湖北武汉';
alert(user.name + " " +user.age);//返回 '念在三角湖畔 湖北武汉'

  4.属性的调用

对于对象属性的调用有两种方式:

拿上面的例子来说,上面我们已经用了其中一种方式,也就是'.'运算符,调用方法如下:

alert(user.name + " " +user.age);//返回 '念在三角湖畔 湖北武汉'

另一种方法:

alert(user['name'] + " " +user['age']);//返回 '念在三角湖畔 湖北武汉

5.给对象添加方法

给对象添加方法和给变量添加一个属性其实大同小异。具体代码如下:

var user = {
name:'念在三角湖畔', //给对象添加属性
age:22,
address:'湖北武汉',
showInfo:function(){//添加一个方法
alert(this.name+" "+this.age+" "+this.address);//返回 '念在三角湖畔 22 湖北武汉' 
},
showHello:showHello//将对象外部的方法添加到对象
};
function showHello(){
alert("Hello!"); 
}
user.showInfo();//调用方法
user.showHello();

6.删除对象的属性

删除对象的属性用delete操作符。格式:delete 对象名称.属性名称

var user = {
name:'念在三角湖畔', //给对象添加属性
age:22,
address:'湖北武汉'
};
alert(user.name);//返回‘念在三角湖畔'
delete user.name;//删除user的name属性
alert(user.name);//返回‘undefined'

三 总结

这里比较浅显的讲述了一下Javascript中对象的创建和对象方法的添加以及对象属性的删除。对象在javascript面向对象中是一个比较重要的,也算是一个比较基础的部分,只有弄清楚了对象的一些常用操作才能够进行面向对象开发。

以上所述是小编给大家介绍的JavaScript中的对象和原型(一),希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js跨域和ajax 跨域问题的实现思路
Sep 05 Javascript
Javascript 面向对象 对象(Object)
May 13 Javascript
使用JavaScript实现Java的List功能(实例讲解)
Nov 07 Javascript
JavaScript中的Web worker多线程API研究
Dec 06 Javascript
基于jQuery实现放大镜特效
Oct 19 Javascript
ES6中的数组扩展方法
Aug 26 Javascript
微信小程序 用户数据解密详细介绍
Jan 09 Javascript
JavaScript简单计算人的年龄示例
Apr 15 Javascript
JS 组件系列之Bootstrap Table 冻结列功能IE浏览器兼容性问题解决方案
Jun 30 Javascript
详解wow.js中各种特效对应的类名
Sep 13 Javascript
详解vue项目中使用token的身份验证的简单实践
Mar 08 Javascript
用JS实现飞机大战小游戏
Jun 09 Javascript
JavaScript中对象的不同创建方法
Aug 12 #Javascript
酷! 不同风格页面布局幻灯片特效js实现
Feb 19 #Javascript
JS+CSS3模拟溢出滚动效果
Aug 12 #Javascript
JS中script标签defer和async属性的区别详解
Aug 12 #Javascript
jquery实现网站列表切换效果的2种方法
Aug 12 #Javascript
很实用的js选项卡切换效果
Aug 12 #Javascript
js实现浏览器倒计时跳转页面效果
Aug 12 #Javascript
You might like
PHP4实际应用经验篇(3)
2006/10/09 PHP
php面向对象全攻略 (三)特殊的引用“$this”的使用
2009/09/30 PHP
php radio 单选框获取与保持值的实现代码
2010/05/15 PHP
Laravel 5.3 学习笔记之 错误&amp;日志
2016/08/28 PHP
php简单实现多维数组排序的方法
2016/09/30 PHP
详谈PHP中的密码安全性Password Hashing
2017/02/04 PHP
php使用curl实现ftp文件下载功能
2017/05/16 PHP
postman的安装与使用方法(模拟Get和Post请求)
2018/08/06 PHP
Function.prototype.call.apply结合用法分析示例
2013/07/03 Javascript
window.navigate 与 window.location.href 的使用区别介绍
2013/09/21 Javascript
Javascript学习笔记之 对象篇(一) : 对象的使用和属性
2014/06/24 Javascript
JQuery表格拖动调整列宽效果(自己动手写的)
2014/09/01 Javascript
JavaScript中的对象与JSON
2015/07/03 Javascript
两款JS脚本判断手机浏览器类型跳转WAP手机网站
2015/10/16 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
2016/01/12 Javascript
JS实现可编辑的后台管理菜单功能【附demo源码下载】
2016/09/13 Javascript
jQuery实现鼠标滑过图片移动特效
2016/12/08 Javascript
js+html5实现半透明遮罩层弹框效果
2020/08/24 Javascript
在 Vue-CLI 中引入 simple-mock实现简易的 API Mock 接口数据模拟
2018/11/28 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
2020/04/17 Javascript
解决pycharm双击但是无法打开的情况
2020/10/31 Javascript
[01:10:57]Liquid vs OG 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python中set与frozenset方法和区别详解
2016/05/23 Python
Python之日期与时间处理模块(date和datetime)
2017/02/16 Python
Python 爬虫之超链接 url中含有中文出错及解决办法
2017/08/03 Python
python 动态调用函数实例解析
2019/10/21 Python
python numpy--数组的组合和分割实例
2020/02/24 Python
CSS3 真的会替代 SCSS 吗
2021/03/09 HTML / CSS
美国经典刺绣和字母儿童服装特卖:Smocked Auctions
2018/07/16 全球购物
ALDO美国官网:加拿大女鞋品牌
2018/12/28 全球购物
尽职尽责村干部自我鉴定
2014/01/23 职场文书
在校大学生个人的自我评价
2014/02/13 职场文书
期中考试反思800字
2014/05/01 职场文书
六五普法学习心得体会
2016/01/21 职场文书
php远程请求CURL案例(爬虫、保存登录状态)
2021/04/01 PHP
python实现三阶魔方还原的示例代码
2021/04/28 Python