JS clone, attribute, array, object, function instance analysis

The examples in this article describe JS cloning, attributes, arrays, objects, and functions. Share it with everyone for your reference, the details are as follows:

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

The console.log here is very interesting, more interesting than alert. Alert cannot get all the data and needs to pop up one by one.

The array definition of js is also very interesting.

Further upgrade

<script type="text/javascript">
/* 克隆原型得到对象 */
function clone(object) {
  function F() {}
  F.prototype = object;
  return new F;
}
var Person = {
 name: &#39;default name&#39;,
 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 &#39;default name&#39;.
authorClone.name = &#39;new name&#39;; // 重新赋值
console.log(authorClone.name); // Now linked to the primative authorClone.name, which
// is the string &#39;new name&#39;.
console.log(Author.getName()); // 没有改变，任然是 &#39;default name&#39;
console.log(Author.getBooks()); // 空的
authorClone.books.push(&#39;new book&#39;); // Author被改了
authorClone.books.push(&#39;new new book&#39;); // Author被改了
console.log(Author.getBooks()); // array &#39;new book&#39;
console.log(authorClone.getBooks()); // array &#39;new book&#39;
authorClone.books = []; // 定义了属于自己的books数组
authorClone.books.push(&#39;new book2&#39;); // We are now modifying that new array.
authorClone.books.push(&#39;new book3&#39;);
authorClone.books.push(&#39;new book4&#39;);
console.log(authorClone.getBooks());
console.log(Author.getBooks());
var CompoundObject = {
 string1: &#39;default value&#39;,
 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>