javascript 学习笔记(八)javascript对象


Posted in Javascript onApril 12, 2011

1、javascript中的内置对象
javascript中除了本身的内置对象,如以下我们所熟悉的对象:
•Array
•Date
•Math
•String
•RegExp
•……
各个对象都有自己的属性及方法,比如我们经常使用属性及方法
属性:stringObject.length; arrayObject.length;……
方法:stringObject.indexOf(); stringObject.splite(); stringObject.substr(); arrayObject.concat(); arrayObject.push(); arrayObject.join();……
2、如何自定义对象,及添加属性和方法
a. 通过关键字new创建

var newObject = new Object(); //创建一个新类 
newObject.name = "new object"; //添加一个name的属性 
newObject.say = function() { //添加say()方法 
alert(this.name); //output new object 
}

对于以上的创建方法,我们可以利用JSON(JavaScript Object Notation)的方法简写为如下代码:
var newObject = { 
name: "new object"; 
say: function () { 
alert(this.name); 
} 
};

我们利用JSON的数据格式创建一个更为复杂的对象
var company = { 
name: "tuanzz", 
product: "groupon", 
address: {province: "Hubei", city: "wuhan"}, 
person:[ 
{name: "zhangchen",age: "23"}, 
{name: "luomi", age: "23"}, 
], 
readme: function() { 
alert("My name is "+this.person[0].name+" and "+this.person[0].age+" years old"); 
} 
}; 
company.readme(); //output My name is zhangchen and 23 years old;

我们可以看到,用JSON的数据格式创建的对象,代码不仅看起来十分优雅。
JSON的形式就是用大括“{}”号包括起来的项目列表,每一个项目间并用逗号“,”分隔,而项目就是用冒号“:”分隔的属性名和属性值。这是典型的字典表示形式,也再次表明了 JavaScript里的对象就是字典结构。不管多么复杂的对象,都可以被一句JSON代码来创建并赋值。
b、通过构造函数来创建对象
function objectFun(name) { 
this.name = name; 
this.say = function() { 
alert(this.name); 
} 
} 
var newObject = new objectFun("zhangchen"); 
newObject.say(); //output zhangchen

首先新建一个objectFun()函数,其中定义了属性和方法,这里我们可以把objectFun看作一个类(在javascript中函数就是对象),然后通过new实例化出一个对象,newObject对象中同样也有了父类中属性和方法。
我们可以用以下代码来检测函数确实是对象:
//普通函数 
function say(s) { 
alert(s); 
} 
say("hi"); 
//给函数对象赋属性,函数就是对象 
say.test = "it can work?"; 
alert(say.test); //output it can work?

如何理解以上创建对象的方法?我们看下面的代码:
function objectFun(name) { 
this.name = name; 
this.say = function() { 
alert(this.name); 
} 
} 
var newObject = new Object(); //创建一个空对象 
objectFun.call(newObject, "zhangchen"); //将newObject作为this参数调用objectFun函数 
newObject.say("zhangchen");//output zhangchen

首先创建一个newObject对象,newObject作为this参数调用objectFun函数。讲了这么多,我们完全可以把objectFun作为构造函数来使用。
-------------------------------------------------------------------------------------------------------------------------------------------------
余下内容大家可参考李战写的悟透JavaScript
Javascript 相关文章推荐
javascript学习笔记(九)javascript中的原型(prototype)及原型链的继承方式
Apr 12 Javascript
ExtJS自定义主题(theme)样式详解
Nov 18 Javascript
使用javascript获取页面名称
Dec 23 Javascript
javascript 获取浏览器版本
Jan 21 Javascript
AngularJS整合Springmvc、Spring、Mybatis搭建开发环境
Feb 25 Javascript
javascript css红色经典选项卡效果实现代码
May 17 Javascript
5种JavaScript脚本加载的方式
Jan 16 Javascript
微信JS-SDK选取手机照片上传功能
Apr 21 Javascript
微信小程序 es6-promise.js封装请求与处理异步进程
Jun 12 Javascript
ES6使用Set数据结构实现数组的交集、并集、差集功能示例
Oct 31 Javascript
基于JavaScript实现瀑布流布局
Aug 15 Javascript
vue在App.vue文件中监听路由变化刷新页面操作
Aug 14 Javascript
jQuery的初始化与对象构建之浅析
Apr 12 #Javascript
避免回车键导致的页面无意义刷新的解决方法
Apr 12 #Javascript
基于jquery实现的上传图片及图片大小验证、图片预览效果代码
Apr 12 #Javascript
javascript实现上传图片并预览的效果实现代码
Apr 11 #Javascript
window.dialogArguments 使用说明
Apr 11 #Javascript
30个最佳jQuery Lightbox效果插件分享
Apr 11 #Javascript
基于jquery的仿百度搜索框效果代码
Apr 11 #Javascript
You might like
php 模拟POST提交的2种方法详解
2013/06/17 PHP
CodeIgniter配置之autoload.php自动加载用法分析
2016/01/20 PHP
PHP实现一个简单url路由功能实例
2016/11/05 PHP
ASP SQL防注入的方法
2008/12/25 Javascript
几个常用的JavaScript字符串处理函数 - split()、join()、substring()和indexOf()
2009/06/02 Javascript
js 创建快捷方式的代码(fso)
2010/11/19 Javascript
jQuery 下拉列表 二级联动插件分享
2012/03/29 Javascript
JavaScript之引用类型介绍
2012/08/10 Javascript
js showModalDialog弹出窗口实例详解
2014/01/07 Javascript
js delete 用法(删除对象属性及变量)
2014/08/24 Javascript
javascript父子页面通讯实例详解
2015/07/17 Javascript
jquery调整表格行tr上下顺序实例讲解
2016/01/09 Javascript
Jquery和Js获得元素标签名称的方法总结
2016/10/08 Javascript
bootstrap快速制作后台界面
2016/12/05 Javascript
使用gulp搭建本地服务器并实现模拟ajax
2017/04/05 Javascript
关于Vue组件库开发详析
2018/07/01 Javascript
微信小程序实现列表滚动头部吸顶的示例代码
2020/07/12 Javascript
一文读懂vue动态属性数据绑定(v-bind指令)
2020/07/20 Javascript
vue中使用腾讯云Im的示例
2020/10/23 Javascript
简单介绍Python的Django框架加载模版的方式
2015/07/20 Python
使用python3调用wxpy模块监控linux日志并定时发送消息给群组或好友
2019/06/05 Python
Python 正则表达式 re.match/re.search/re.sub的使用解析
2019/07/22 Python
对django 模型 unique together的示例讲解
2019/08/06 Python
python实现的Iou与Giou代码
2020/01/18 Python
Python项目跨域问题解决方案
2020/06/22 Python
HTML5实现简单图片上传所遇到的问题及解决办法
2016/01/20 HTML / CSS
中软国际Java程序员机试题
2012/08/19 面试题
五好党支部事迹材料
2014/02/06 职场文书
职工运动会感言
2014/02/07 职场文书
2014年机关植树节活动方案
2014/02/27 职场文书
2014年后勤管理工作总结
2014/12/01 职场文书
高中社区服务活动报告
2015/02/05 职场文书
护士业务学习心得体会
2016/01/25 职场文书
JS不要再到处使用绝对等于运算符了
2021/04/30 Javascript
python基于tkinter实现gif录屏功能
2021/05/19 Python
MySQL库表名大小写的选择
2021/06/05 MySQL