zoukankan      html  css  js  c++  java
  • javascript基础

    一、hasOwnProperty vs isPrototyOf

    1&2互为补充

    function siteAdmin(nickName,siteName){
     this.nickName=nickName;
     this.siteName=siteName;
    }
    siteAdmin.prototype.showAdmin = function() {
     alert(this.nickName+"是"+this.siteName+"的站长!")
    };
    siteAdmin.prototype.showSite = function(siteUrl) {
     this.siteUrl=siteUrl;
     return this.siteName+"的地址是"+this.siteUrl;
    };

    var matou=new siteAdmin("脚本之家","WEB前端开发");
    var matou2=new siteAdmin("脚本之家","WEB前端开发");

    1. hasOwnProperty: 对象求属性,但是不包括原型链里的。

    alert(matou.hasOwnProperty("nickName"));//true
    alert(matou.hasOwnProperty("age"));//true
    alert(matou.hasOwnProperty("showAdmin"));//false
    alert(matou.hasOwnProperty("siteUrl"));//false
    alert(siteAdmin.prototype.hasOwnProperty("showAdmin"));//true
    alert(siteAdmin.prototype.hasOwnProperty("siteUrl"));//false

    2. isPropertyof对象是否继承与某个原型链。 判断某个原型链,该对象有没有继承。

    alert(siteAdmin.prototype.isPrototypeOf(matou))//true

    二、object.create (shadowcopy and 原型链继承) / object freeze 

    const obj = {
      data: 1,
      compositor: {
        b: 2,
        c: {
          data: 2,
        },
      },
      m: undefined,
      get: () => {
        return this.xxx.data;
      },
    };
    const test1 = obj;
    test1.data = 2;
    console.log(obj); // { data: 1, compositor: { b: 2 }, get: [Function: get] }

    console.log(JSON.parse(JSON.stringify(obj))); //!missing get { data: 1, compositor: { b: 2 } }
    const test3 = { ...obj };
    test3.compositor.b = 4;
    console.log(obj);
    console.log(test3);

    const test = Object.create(obj); //!test的原型链继承了obj shalowcopy the property
    test.__proto__.data = 3;
    test.__proto__.compositor.b = 3;
    console.log(test.__proto__); //!should be __proto__

    //!test shadow
    const objclone = {
      compositor: {
        data: {
          m: 3,
        },
      },
      get: () => {
        return this.xxx.m;
      },
    };
    const test33 = { ...objclone };
    test33.compositor.data = 4;
    console.log(objclone);
    console.log(test33);

    //! deepcopy success
    const test34 = { ...objclone };
    test34.compositor = { data: 6 };
    console.log(objclone);
    console.log(test34);

    function deepcopy(obj1) {
      if (typeof obj1 != "object" || obj1 == null) return obj1;
      var newObj = obj1.constructor();
      console.log(newObj);
      for (let prop in obj1) {
        if (typeof obj1[prop] == "object") {
          newObj[prop] = deepcopy(obj1[prop]);
        } else {
          newObj[prop] = obj1[prop];
        }
      }
      return newObj;
    }
    function typeString(obj) {
      var cons = Object.prototype.toString.call(obj).slice(8, -1);

      return cons === "Array" || cons === "Object";
    }
    const testfinal = deepcopy(obj);
    testfinal.compositor.c.data = 6;
    console.log("deepcopy", deepcopy(obj));
    console.log("deepcopy", deepcopy(testfinal));

     三、object.freeze

    freeze是对object的属性操作, 增删改都不会骑作用, 但是不会报错, 只有在'strict'模式下才会throw error

    freeze也是浅冷冻, 如果真的想所有的起效, 需要deepFreeze, 也就是递归

    freeze是堆内存,不是栈内存,所以可以赋值改变

    function deepFreeze(obj) {
      if (typeof obj != "object" || obj === null) return obj;
      for (let prop in obj) {
        if (typeof obj[prop] == "object" && obj != null) {
          obj[prop] = deepFreeze(obj[prop]);
        }
      }
      return Object.freeze(obj);
    }
    deepFreeze(obj);
    obj.b.c = 13; //不会报错
    console.log(obj); //仍然是 {"a":5}
  • 相关阅读:
    MongoDB 生态 – 可视化管理工具
    SOLR对多个(关联)表创建索引
    sublime 插件zen coding
    12/12工作笔记
    阅读《深入理解JavaScript定时机制》
    继续谈论XSS
    支付宝快捷支付模型
    谈论XSS
    生产者消费者模型
    如何根据iframe内嵌页面调整iframe高宽续篇
  • 原文地址:https://www.cnblogs.com/connie313/p/13379139.html
Copyright © 2011-2022 走看看