• js深入研究之克隆,属性,数组,对象,函数


    代码

    <script type="text/javascript">
    /* 克隆原型得到对象 */
    function clone(object) {
        function F() {}
        F.prototype = object;
        return new F;
    }
    
    var Person = {
      name: 'default name',
      getName: function() {
        return this.name;
      }
    };
    
    var reader = clone(Person);
    console.log(reader.getName()); // This will output 'default name'.
    reader.name = 'John Smith';
    console.log(reader.getName()); // This will now output 'John Smith'.
    
    /* Author Prototype Object. */
    
    var Author = clone(Person);
    Author.books = []; // 书数组
    Author.getBooks = function() {
      return this.books;
    }
    
    var author = [];
    
    author[0] = clone(Author);
    author[0].name = 'Dustin Diaz';
    author[0].books = ['JavaScript Design Patterns'];
    
    author[1] = clone(Author);
    author[1].name = 'Ross Harmes';
    author[1].books = ['JavaScript Design Patterns','PHP','Mysql'];
    console.log(author[0].getName());
    console.log(author[0].getBooks());
    console.log(author[1].getName());
    console.log(author[1].getBooks());
    </script>

    结果

    这里的console.log很有意思,比alert有意思,alert不能获取全部数据,需要一个个弹出。

    js的数组定义也很有意思。

    进一步升级

    <script type="text/javascript">
    /* 克隆原型得到对象 */
    function clone(object) {
        function F() {}
        F.prototype = object;
        return new F;
    }
    
    var Person = {
      name: 'default name',
      getName: function() {
        return this.name;
      }
    };
    
    
    var Author = clone(Person);
    Author.books = []; // 书数组
    Author.getBooks = function() {
      return this.books;
    }
    
    
    var authorClone = clone(Author);
    console.log(authorClone.name); // string 'default name'.
    authorClone.name = 'new name'; // 重新赋值
    console.log(authorClone.name); // Now linked to the primative authorClone.name, which 
                             // is the string 'new name'.
    console.log(Author.getName());  // 没有改变,任然是 'default name'
    console.log(Author.getBooks()); // 空的
    authorClone.books.push('new book'); // Author被改了
    authorClone.books.push('new new book'); // Author被改了
    console.log(Author.getBooks()); // array 'new book'
    console.log(authorClone.getBooks()); // array 'new book'
    authorClone.books = []; // 定义了属于自己的books数组
    authorClone.books.push('new book2'); // We are now modifying that new array.
    authorClone.books.push('new book3');
    authorClone.books.push('new book4');
    console.log(authorClone.getBooks());
    console.log(Author.getBooks());
    
    var CompoundObject = {
      string1: 'default value',
      childObject: {
        bool: true,
        num: 10
      },
      getChild: function() {  // 返回对象Object
        return this.childObject;
      }
    }
    
    var compoundObjectClone = clone(CompoundObject);
    
    compoundObjectClone.childObject.num = 5; // 不好的方式
    
    compoundObjectClone.childObject = { // 好一点的方式
      bool: true,
      num: 5
    };
    console.log(compoundObjectClone.getChild());
    
    </script>

  • 相关阅读:
    常见排序算法导读(8)[堆排序]
    常见排序算法导读(7)[希尔排序]
    常见排序算法导读(6)[快排序]
    常见排序算法导读(5)[冒泡排序]
    常见排序算法导读(4)[直接插入排序]
    UI基础
    iOS8之后CoreLocation定位的使用
    关于什么时候用pop什么时候用dismiss
    控制台输出文字改中文
    Quartz2D使用
  • 原文地址:https://www.cnblogs.com/jiqing9006/p/5059199.html
Copyright © 2020-2023  润新知