JavaScript 基础篇之对象、数组使用介绍(三)


Posted in Javascript onApril 07, 2012

Javascript:对象
对象我们在前面也简单介绍过,它是一种将多个数据值集中在一个单元的东西,使用名字来存取,它是一个无序的属性集合。
1、创建对象的几种方式

var empty = {} //创建一个没有属性的对象。 
var person = {name:"ben",age:22,sex:'男'}//使用直接量创建对象 
var people = {{name:'Frank',age:21},{name:'Mary',age:21},sex:'MAN'}// 对象的元素可以是对象

2、对象属性
var person = {}; //创建一个对象 
person.name = "Frank"; //添加属性 
person.country = "china"; 
person.age = 22; 
person.american = new Object(); //这个属性是个对象 
person.american.name = "Lisa"; 
person.american.country = "American"; 
person.american.age = 20; 
function displayperson(personmore) //打印上面的对象 
{ 
for(var p in personmore) //枚举循环 
{ 
if(typeof(personmore[p]) == "object")//判断类型 
{ 
for(var o in personmore[p]) 
{ 
document.write("American people :" +o+"\t" +personmore[p][o]+"<br />"); 
} 
document.write("<br />"); 
continue;//结束本次循环,进行下一次循环. 
document.write("china people :"+ p+"\t" + personmore[p] +"<br />"); 
} 
} 
displayperson(person);//调用函数 
//输出china people :name Frank 
//china people :country china 
//china people :age 22 
//American people :name Lisa 
//American people :country American 
//American people :age 20

3、删除属性
使用delete运算符
delete person.american;//就可以自己删除对象的属性 
delete 是不能删除对象的。

4、hasOwnProperty()方法和isPrototypeOf()方法
其实这两个方法,在这里说初学的朋友可能会和我当时学到这里一样,看不懂,但是没关系,可以跳过去,到时候我们学到继承的时候你在回头看看,
就明白了。
4.1:hasOwnProperty()方法,如果对象用一个单独字符串参数所指定的名字来本地定义一个非继承的属性,就返回true。否则返回false。
function House(price,area,developers) 
{ 
this.price = price; 
this.area = area; 
this.developers = developers; 
} 
House.prototype.housevalue = function(){return this.price*this.area;} 
function HouseSon(price,area,developers,city) 
{ 
House.call(this,price,area,developers); 
this.city = city; 
} 
HouseSon.prototype = new House(10000,80,"vanke");//获取House的属性 
delete HouseSon.prototype.price;//删除 
delete HouseSon.prototype.area; 
delete HouseSon.prototype.developers; 
HouseSon.prototype.container = function(){return "container" + this.price * this.area;} 
for(var i in HouseSon.prototype) 
{ 
document.write(i+"<br />"); 
} 
var house = new HouseSon(20000,180,"vanke","shenzhen"); 
document.write(house.container()+"<br />"); 
document.write(house.housevalue()+"<br />"); 
document.write(house.hasOwnProperty("housevalue")+"<br />");//这是原型 
document.write(house.hasOwnProperty("price")+"<br />");//本地

Javascript:数组
数组是一个有序的集合,每个元素在数组中都有一个数字化的位置,可以使用小标访问,由于javascript是一种非数据类型的语言,所以里面可以包涵不同类型。
1、数组的创建
var array = [] //不包涵任何元素的数组 
var person = ["Frank",22,'男 '];//带不同元素的数组 
var value = 100; 
var num = [value+12,value-23,value*2];//支持表达式 
//当然还有使用Array来创建,可以有不同类型的参数,可以是对象,数组等。

2、数组的添加,删除,遍历。
由于添加,遍历都比较简单,就不举例说明,但是这么还是说说删除吧!
function diaplayarray(arr) //执行打印任务的函数 
{ 
if(!arr)return; 
for(var num =0;num<arr.length;num++) 
{ 
document.write("Num is "+ arr[num]+ "\t"); 
} 
document.write(" "+"<br />"); 
} 
var array = [2,32,14,57,6]; 
document.write(array.shift()+"<br />"); //删除数组中的第一个,返回删除的值2 
document.write(array.pop()+"<br />"); //删除数组中的最后一个,返回删除的值6 
document.write(array.join("*")+"<br />");//将数组元素用*连接返回一个字符串32*14*57 
document.write(array.push(100) +"<br />");//添加数组元素 
array.reverse();//颠倒数组元素顺序 
diaplayarray(array);//输出Num is 100 Num is 5 Num is 4 Num is 3 
array.splice(1,2,300,600);//从数组第二个开始删除(含第二个),到第三个,后面300,600是新插入的值 
diaplayarray(array);//输出Num is 100 Num is 300 Num is 600 Num is 32

小结:同志们辛苦了..........
关于对象和数组就介绍到这里吧,接下来我们马上就要到javascript客户端了。
Javascript 相关文章推荐
Javascript 篱式条件判断
Aug 22 Javascript
js parsefloat parseint 转换函数
Jan 21 Javascript
js控制的遮罩层实例介绍
May 29 Javascript
如何使用jQUery获取选中radio对应的值(一句代码)
Jun 03 Javascript
javascript预加载图片、css、js的方法示例介绍
Oct 14 Javascript
得到form下的所有的input的js代码
Nov 07 Javascript
jQuery元素选择器实例代码
Feb 06 Javascript
easyui下拉框动态级联加载的示例代码
Nov 29 Javascript
Angular实现的内置过滤器orderBy排序与模糊查询功能示例
Dec 29 Javascript
vue.js获得当前元素的文字信息方法
Mar 09 Javascript
javascript/jquery实现点击触发事件的方法分析
Nov 11 jQuery
VUE 项目在IE11白屏报错 SCRIPT1002: 语法错误的解决
Sep 27 Javascript
JavaScript 基础篇之运算符、语句(二)
Apr 07 #Javascript
为原生js Array增加each方法
Apr 07 #Javascript
jquery 操作DOM案例代码分享
Apr 05 #Javascript
jquery 操作DOM的基本用法分享
Apr 05 #Javascript
文本框输入时 实现自动提示(像百度、google一样)
Apr 05 #Javascript
Ajax搜索结果页面下方的分页按钮的生成
Apr 05 #Javascript
jQuery之$(document).ready()使用介绍
Apr 05 #Javascript
You might like
php获取服务器端mac和客户端mac的地址支持WIN/LINUX
2014/05/15 PHP
PHP7.1方括号数组符号多值复制及指定键值赋值用法分析
2016/09/26 PHP
关于使用runtimeStyle属性问题讨论文章
2007/03/08 Javascript
优化网页之快速的呈现我们的网页
2007/06/29 Javascript
详解new function(){}和function(){}() 区别分析
2008/03/22 Javascript
jqPlot jquery的页面图表绘制工具
2009/07/25 Javascript
javascript window.opener的用法分析
2010/04/07 Javascript
javascript检测页面是否缩放的小例子
2013/05/16 Javascript
jquery使用ajax实现微信自动回复插件
2014/04/28 Javascript
jQuery easyui的validatebox校验规则扩展及easyui校验框validatebox用法
2016/01/18 Javascript
浅谈Angular 的变化检测的方法
2018/03/01 Javascript
vue2.0 实现导航守卫(路由守卫)
2018/05/21 Javascript
Phaser.js实现简单的跑酷游戏附源码下载
2018/10/26 Javascript
vue实现移动端悬浮窗效果
2018/12/01 Javascript
NProgress显示顶部进度条效果及使用详解
2019/09/21 Javascript
vue实现带过渡效果的下拉菜单功能
2020/02/19 Javascript
React中使用Vditor自定义图片详解
2020/12/25 Javascript
对于Python的Django框架使用的一些实用建议
2015/04/03 Python
python从入门到精通(DAY 1)
2015/12/20 Python
Python工程师面试必备25条知识点
2018/01/17 Python
python多进程并行代码实例
2019/09/30 Python
Python数据可视化:饼状图的实例讲解
2019/12/07 Python
Python 使用threading+Queue实现线程池示例
2019/12/21 Python
python实现高斯投影正反算方式
2020/01/17 Python
python函数定义和调用过程详解
2020/02/09 Python
python爬虫beautifulsoup解析html方法
2020/12/07 Python
Tiqets英国:智能手机上的文化和娱乐门票
2019/07/10 全球购物
美国折扣地毯销售网站:Rugs.com
2020/03/27 全球购物
大学应届生求职简历的自我评价
2013/10/08 职场文书
村党支部公开承诺书
2014/05/29 职场文书
艺术学院毕业生求职信
2014/07/09 职场文书
庆祝教师节演讲稿
2014/09/03 职场文书
2014党委书记四风问题对照检查材料思想汇报
2014/09/22 职场文书
信访维稳承诺书
2015/05/04 职场文书
ConstraintValidator类如何实现自定义注解校验前端传参
2021/06/18 Java/Android
利用Pycharm连接服务器的全过程记录
2021/07/01 Python