zoukankan      html  css  js  c++  java
  • javascript笔记整理(对象遍历封装继承)

    一、javascript对象遍历

    1.javascript属性访问

    对象.属性名

    对象['属性名']

    var obj={name:'chen',red:function(){
        alert(1);return 2;
    }};
    alert(obj['name']);
    alert(obj.name);

     2.javascript属性遍历(for in)

    //( obj[i] )此格式才有效
    var
    obj={ name:'chen', red:function(){ alert(1); return 2; }, so:'rui' }; for(var i in obj){ alert(obj[i]); }
    //arguments 
    //检测参数个数:arguments.length
    //访问第i个值:arguments[i]
    function myArray () {
        var lengs=  arguments.length;
        for (var i=0; i<lengs; i++) {
            this[i]=arguments[i];
        }
    }
    var arr=new myArray('chen','20','suncco');
    alert(arr[1]);
        

     二、对象的特性之封装

    把对象所有的组成部分组合起来,尽可能的隐藏对象的部分细节,使其受到保护;只保留有限的接口和外部发生联系。

    //工厂函数
    function app(name,size){
        var apps={};
        apps.name=name;
        apps.size=size;
        apps.lookName=function(){
        return name;
        }
        apps.lookSize=function(){
        return size;
        }
        return apps;
    }
    var arr=app('chen','20M');    
    alert(arr.lookName());        结果:chen
    //构造函数
    function app(name,size){
        this.name=name;
        this.size=size;
        this.lookName=function(){
        return this.name;
        }
        this.lookSize=function(){
        return this.size;
        }
    }
    var arr=new app('chen','20M');
    alert(arr.name);    结果:chen
    alert(arr.lookName());    结果:chen

     构造函数跟工厂函数类似,构造函数比较正式;但里面的方法一样,占用了内存空间。

    //原型:prototype方法
    function app(name,size){
        this.name=name;
        this.size=size;
        this.lookName=function(){
            return this.name;
        }
    }
    app.prototype.lookSize=function(){
        return this.name;
    }
    var arr=new app('chen','20M');
    delete arr.size;
    alert(arr.size);        结果:undefined
    delete arr.lookSize;
    alert(arr.lookSize());        结果:chen

     prototype方法会使属性或方法一直存在代码段当中;但是不能实例化对象,只能实例化属性或对象!

    //混合方法
    function app(name,size){
        this.name=name;
        this.size=size;
        this.lookName=function(){
        return this.name;
        }
        //把prototype方法放到函数里头
        app.prototype.lookSize=function(){
            return this.name;
        }
    }
    var arr=new app('chen','20M');
    delete arr.size;
    alert(arr.size);//undefined
    delete arr.lookSize;
    alert(arr.lookSize());//chen

     javascript对象的继承和Object对象

    一、Object对象(对象的一个类可以从现有的类中派生,并且拥有现有的类的方法或是属性,这和过程叫做继承。被继承的类叫做父类或是基类,继承的类叫做子类。(一个对象拥有另一个对象的属性和方法))

    优点:

    提高代码的重用性

    提高代码的可维护性

    提高代码的逻辑性

    a.constructor——返回对创建此对象的数组函数的引用

    //++++++
    function app(name,size){
        this.name=name;
        this.size=size;
        this.lookName=function(){
        return this.name;
        }
        app.prototype.lookSize=function(){
        return this.name;
        }
    }
    var arr=new app('chen','20M');
    //+++++++
    alert(arr.constructor);        结果:返回+号内的代码

    b.Prototype 原型——对该函数对象的对象原型的引用。是函数对象的默认属性

    var obj=new fun1();
    function fun1 () {
        this.name="zhangsan";
    }
    alert(obj.prototype);        结果:undefined
    alert(fun1.prototype);        结果:object

    对象的共享属性存放到代码段当中。

    可以实现继承

    //hasOwnProperty(property)
    //判断一个对象是否有你给出名称的属性或对象
    var obj=new fun1();
    function fun1 () {
        this.name="zhangsan";
    }
    alert(obj.hasOwnProperty("name"));    结果:true
    //IsPrototypeOf(object)
    //判断该对象是否为另一个对象的原型(用来检测对象的类型)
    var arr=new Array();
    var arc=new app();
    function app(){
    
    }
    alert(app.prototype.isPrototypeOf(arc))        结果:true
    alert(app.prototype.isPrototypeOf(arr))        结果:false

     二、继承

    //原型继承
    function person(){
        this.name="张三";
        this.say=function  () {
            alert(this.name)
        }
    }
    function student(){
    }
    student.prototype=new person();
    var zhangsan=new student();
    zhangsan.say();        结果:张三
    //call方法
    function person () {
        this.name="张三";
        this.say=function  () {
            alert(this.name)
        }
    }
    
    function student () {
         this.name="李四";
    }
    var ren=new person ();
    var zhangsan=new student ();
    
    ren.say.call(zhangsan);
    //apply方法,参数以数组形式
    function person (name) {
        this.name=name;
        this.say=function  () {
            alert(this.name)
        }
    }
    
    function student () {
        window.person.apply(this,["zhangsan"])
    }
    
    var zhangsan=new student ();
  • 相关阅读:
    第19 章 : 调度器的调度流程和算法介绍
    第18 章 : Kubernetes 调度和资源管理
    关于一次配合开发工作而产生的服务器内核参数问题(Android 网络问题)
    第17 章 : 深入理解 etcd:etcd 性能优化实践
    第16 章 : 深入理解 etcd:基于原理解析
    第15 章 : 深入解析 Linux 容器
    第14 章 : Kubernetes Service讲解
    第13 章 : Kubernetes 网络概念及策略控制
    第12 章 : 可观测性-监控与日志
    第11 章 : 可观测性:你的应用健康吗?(liveness和readiness)
  • 原文地址:https://www.cnblogs.com/chenrf/p/4954091.html
Copyright © 2011-2022 走看看