码迷,mamicode.com
首页 > Web开发 > 详细

20150206--JS巩固与加强4-02

时间:2016-05-06 00:31:00      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:

五、属性遍历与删除

1、使用for…in…遍历自定义对象属性

基本语法:

for…in…(主要是完成对对象的遍历)

示例代码:

技术分享

运行效果:

技术分享

说明:在17行代码,不能使用p1.i形式进行自定义对象属性的遍历,否则会弹出undefined,原因是因为当代码识别到p1对象会认为p1.i是访问p1对象的i属性,由于没有定义i属性,所以系统会弹出3个undefined。

2、使用for…in…结构实现系统对象的遍历

window

document

示例代码:

技术分享

运行效果:

技术分享

3、属性删除操作

在Javascript,有时我们可能并不需要某个对象的某个属性,这个时候我们可以采用delete关键词实现对自定义属性的删除操作

基本语法:

delete对象.属性

删除指定属性

示例代码:

技术分享

运行效果:

技术分享

六、成员方法

1、基本语法:

对象.属性 = 函数的首地址

例1:为对象添加speak说话方法

技术分享

例2:创建对象p2,为p2添加speak说话方法

技术分享

观察以上代码,与例1中的p1对象的成员方法完全一致,似乎代码出现了重叠,改进上题

例3:改进上题

技术分享

例4:由于以上代码有很多重复性的代码,那么我们可以对以上代码进行封装

技术分享

七、json对象

1、什么是json

对象是指属性的无序集合

所谓“集合”是指名/值对的集合,名/值对之间是通过 ,逗号隔开的

在js中,可以使用{}来表示这个集合

2、基本语法

var 变量 ={};

第一种:{‘属性’:’属性的值’, ‘属性’:’属性的值’, ‘属性’:’属性的值’}

第二种:{“属性”:”属性的值”, “属性”:”属性的值”, “属性”:”属性的值”}

第三种:{属性:’属性的值’,属性:’属性的值’,属性:’属性的值’,}

3、快速入门

例1:通过json对象描述一个人的信息

技术分享

4、json对象从“何”而来

技术分享

通过以上代码可以证明:

json对象是Object类的一个实例,其实在Javascript中,Object类是所有类的基类,所有的对象都继承了Object类的属性。

json对象主要用于大批量数据的保存

例2:通过json对象保存多个人的信息

技术分享

5、php与json

在php提供了两个生成与解析json格式的函数

json_encode(数组或对象)

数组通常采用关联性数组

json_decode(json格式字符串)

ajax xml

ajaj json

1)把数组转化为json格式的数据

技术分享

2 )把对象转换成json格式的数据

技术分享

说明:在json_encode函数中,目前只支持UTF-8,如果是GBK或GB2312请通过iconv进行转化,否则无法使用或无法得到正常数据

3)把二维数组转化为json格式数据

技术分享

4)json_decode代码解析

json_decode($json对象,[bool])

功能:把json格式数据反转化

参数说明:

第一个参数是json格式数据

第二个参数是布尔类型的值,如果为true,则返回array数组类型的数据,如果是false或不填写,则直接返回stdClass类的实例(对象)

技术分享

技术分享

不加true参数效果

技术分享

技术分享

案例:通过php+json完成对历史上的今天api接口调用

http://www.juhe.cn/聚合数据

技术分享

技术分享

a)复制url地址http://japi.juhe.cn/toh/toh?key=您申请的KEY&v=1.0&month=11&day=1

参数说明

key:密钥

v:版本1.0

month:月份

day:天

b)通过接口可知,其属于get请求

技术分享

效果如下:

技术分享

6、为json对象添加成员方法

技术分享

运行效果:

技术分享

八、原型链

1、什么是原型对象?

答:当系统加载构造器时,系统会自动生成一个对象,我们把这个对象就称之为原型对象。

构造器与原型对象在内存中是相互独立的,但是其还有联系:

在构造器中存在一个prototype属性,指向原型对象

原型对象也存在属性指向构造器

技术分享

2、原型对象作用?

当构造器的实例访问一个不存在的属性时,系统会自动到构造器的原型对象中去寻找,如找到则直接使用。

技术分享

当我们在某些已存在的框架或对象中找不到我们想要属性或方法,我们可以借助原型对象,把需要的属性或方法追加到原型对象。

3、如何向原型对象中添加属性或方法

构造器.prototype.属性=属性的值

技术分享

技术分享

4、探讨:原型对象到底从何而来

说明:当系统创建原型对象,系统会自动执行以下代码

构造器.prototype = new Object();

由于原型对象都是Object类的实例,那么根据面向对象原则,我们的原型对象会自动继承Object类中属性和方法。

示例代码:

技术分享

说明:当我们运行到第14行,系统自动访问p1对象的hasOwnPropery属性,但由于系统中并不存在hasOwnProperty属性,所以会到Person构造器的原型对象中去寻找,没有找到,又由于所有的原型对象都是Object类的实例,所以原型对象会自动继承Object类下面的所有的属性和方法,所以发现该行代码正常执行,原理图如下:

技术分享

我们把以上情况就称之为原型继承,通过以上图解也可以证明,Object类是所有类的基类。

技术分享

说明:在Javascript中,当某一个对象引用一个不存在属性或方法时,系统首先到当前构造器的原型对象中去寻找,如还找不到,其会到上一层原型对象中去寻找,直至Object原型对象,我们把这种链接查找关系就称之为原型链。

作业:扩展数组类的功能:(Array)

为每一个数组对象添加一个方法,可以查找某个元素的所在位置

var arr = [10,20,30,40,50];

arr.find(40);

2、扩展数字类的功能(Number)

为一个数字对象添加一个方法,该方法的参数为任意数目的整数,然后将所有参数累加到一起,并返回总和

vari = 10;

i.sum(10,30,40,50,60,60);

20150206--JS巩固与加强4-02

标签:

原文地址:http://www.cnblogs.com/lifushan/p/5463893.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!