zoukankan      html  css  js  c++  java
  • 20150206--JS巩固与加强4-02

    五、属性遍历与删除

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

    基本语法:

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

    示例代码:

    clip_image002

    运行效果:

    clip_image004

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

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

    window

    document

    示例代码:

    clip_image006

    运行效果:

    clip_image008

    3、属性删除操作

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

    基本语法:

    delete对象.属性

    删除指定属性

    示例代码:

    clip_image010

    运行效果:

    clip_image012

    六、成员方法

    1、基本语法:

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

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

    clip_image014

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

    clip_image016

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

    例3:改进上题

    clip_image018

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

    clip_image020

    七、json对象

    1、什么是json

    对象是指属性的无序集合

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

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

    2、基本语法

    var 变量 ={};

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

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

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

    3、快速入门

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

    clip_image022

    4、json对象从“何”而来

    clip_image024

    通过以上代码可以证明:

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

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

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

    clip_image026

    5、php与json

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

    json_encode(数组或对象)

    数组通常采用关联性数组

    json_decode(json格式字符串)

    ajax xml

    ajaj json

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

    clip_image028

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

    clip_image030

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

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

    clip_image032

    4)json_decode代码解析

    json_decode($json对象,[bool])

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

    参数说明:

    第一个参数是json格式数据

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

    clip_image034

    clip_image036

    不加true参数效果

    clip_image038

    clip_image040

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

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

    clip_image042

    clip_image044

    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请求

    clip_image046

    效果如下:

    clip_image048

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

    clip_image050

    运行效果:

    clip_image052

    八、原型链

    1、什么是原型对象?

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

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

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

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

    clip_image054

    2、原型对象作用?

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

    clip_image056

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

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

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

    clip_image058

    clip_image060

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

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

    构造器.prototype = new Object();

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

    示例代码:

    clip_image062

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

    clip_image064

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

    clip_image066

    说明:在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);

  • 相关阅读:
    JSTL XML标签库 使用
    JSTL SQL标签库 使用
    JSTL I18N 格式标签库
    基于struts2的ajaxfileupload异步上传插件的使用
    Spring 使用注解方式进行事务管理
    vi编辑器的使用方式
    js基础知识介绍
    选择语句
    数组
    0411作业
  • 原文地址:https://www.cnblogs.com/lifushan/p/5463893.html
Copyright © 2011-2022 走看看