JavaScript object-oriented Programming (i) _javascript skills

Comments are very detailed, there is no more nonsense, directly on the code:

<script type= "Text/javascript" >//ecma-262 defines an object as: "A collection of unordered attributes that can contain basic values, objects, or functions"//understanding objects, the simplest way is by creating an instance of an object
  , and then add properties and methods to it. var person = new Object ();
  Person.name = "Xulei";
  Person.age = "23";
  Person.job = "Front-End Engineer";
  Person.sayname = function () {alert (this.name); 
   //can also write var person = {Name: "Xulei", age:23, Job: "Front-End Works", Sayname:function () {alert (this.name) }//One, property type: Data properties and access to its properties//1, Data properties, and 4 attributes describing its behavior//[configurable]: Indicates whether the attribute can be deleted by deleting the property, whether the attribute can be modified, or whether the property can be modified to an accessor property, the default value is True//[enumerable]: Indicates whether the property can be returned by for-in, and the default is True//[writable]: Indicates whether the property can be modified, and the default is True//[value]: The data value that contains this property. The default value is undefined var person = {Name: "Xulei"}//This creates a person object, the value is "Xulei"//The default attribute of the property to be modified, you must use the ECMAScript5 obj Ect.defineproperty (The object in which the property is located, the name of the property, the Descriptor object)//Descriptor object must be configurable, enumerable, writable, value var peron = {} Object.defin
  Eproperty (Peron, "name", {writable:false,//attribute cannot be modified value: "Xu Lei-xulei"});
alert (peron.name);//Xu Lei-xulei  Peron.name = "Xu Lei";
  alert (peron.name);//Xu Lei-xulei operation is ignored in the non strict mode, if the exception is thrown in strict mode//Once the attribute is defined as not configurable, it cannot be changed back to configurable. In most cases, it is not necessary to take advantage of these advanced features provided by the Object.defineproperty () method.
  But it's very useful for understanding JavaScript.
  It is recommended that readers do not use this method on IE8. 2, access to its properties, there are 4 characteristics//[configurable]: Indicates whether the property can be deleted by Delete to redefine the property, whether the attributes of the property can be modified, or whether the property can be modified to accessor properties, the default value is True//[enumerable]:
   Indicates whether the property can be returned through for-in, and the default value is True//[get]: The function default value that is invoked at read undefined//[set]: The function default value that is invoked when the property is written is undefined var book={_year:2004,
   Edition:1} object.defineproperty (book, ' Year ', {get:function () {return this._year;
     }, Set:function (value) {if (value>2004) {this._year=value;
    This.edition +=value-2004;
  }
   }
  });
  book.year=2005;
   alert (book.edition);//2//Create object//1, use constructor as function person (name,age,job) {this.name=name;
   This.age=age;
   This.job=job;
   This.sayname=function () {alert (this.name);
  }///As constructor uses Var person=new person ("Xulei", "Software");
  Person.sayname (); Use person as a normal function ("Xulei2", "JOB2");//Add to Window Window.sayname ();
  Invoke the Var O=new object () in the scope of another object;
  Person.call (O, "Xulei3", "job3");
 O.sayname ();
 </script>

Another paragraph:

<script type= "Text/javascript" >//1, Understanding Prototype object//2, prototype and in operator//3, simpler prototype syntax//4, prototype dynamic//5, native object prototype 6, the problem of the prototype object//1, whenever you create a function, you create a prototype property for the function based on a specific set of rules, which points to the function's prototype object//By default, all of the prototype objects will automatically get a constructo
    R (constructor) property that contains a pointer to the function where the prototype property is located//such as function person () {}//person.prototype.constructor point to Person After a custom constructor is created, its prototype object will only get the constructor property by default, and the other methods are inherited from Object//When a new instance of the calling function is created, the instance's interior contains a pointer (internal property) to the constructor's prototype object/
    /In Firefox, Safari, Chrome supports a property on each object _proto_ access to the Var p1=new person (); Alert (Person.prototype.isPrototypeOf (p1)) alert (object.getprototypeof (p1) ==person.prototype)//Although it can be stored in the prototype through object instance access But cannot override the value in the prototype through an object instance. If we add a property to the instance and the name of the property is the same as an instance in the prototype, we create the property in the instance that will mask that property in the prototype.
    Eg:function person () {} person.prototype.name= "amber";
    person.prototype.age=23;
    person.prototype.job= "Software Engineer"; Person.prototype.sayname=function () {alert (this.name)} var pErson1=new person ();
    var person2=new person (); Person1.name= "Amber.
    Xu ";
    alert (person1.name);//amber.xu--from Instance alert (person2.name);//amber--from prototype delete person1.name; alert (person1.name);//amber--From the prototype//using the hasOwnProperty () method to detect whether an attribute exists in the instance or in the prototype, this method (inherited from Object)///is only present in the object solid for the given property
    example, the true function person () {} person.prototype.name= "amber" is returned.
    person.prototype.age=23;
    person.prototype.job= "Software Engineer";
    Person.prototype.sayname=function () {alert (this.name)} var person1=new person ();

    var person2=new person (); Alert (Person1.hasownproperty ("name"));//false from Instance alert (Person2.hasownproperty ("name");//false from Instance person1.na
    Me= "Amber.xu";
    alert (person1.name);
    Alert (Person1.hasownproperty ("name"));//true from the instance delete person1.name;
    alert (person1.name); Alert (Person1.hasownproperty ("name"));//false from prototype//2, prototype and in operator//in there are two ways to use, one is used separately and in for-in use. When used alone, the in operator will be able to visit the object in theReturns True when asked for a given property, whether from a prototype or an instance function person () {} person.prototype.name= "amber";
    person.prototype.age=23;
    person.prototype.job= "Software Engineer";
    Person.prototype.sayname=function () {alert (this.name)} var person1=new person ();
    var person2=new person ();


    Alert ("name" in Person1);//true from prototype alert ("name" in Person2);//true from prototype alert ("height" in person1);//false This allows you to encapsulate a function (given whether the property is a prototype for a given object) function Hasprototypeproperty (object,name) {return!object.hasownproperty (name)
    && (name in object);
    Alert ("----------------------------------");
    Alert (Hasprototypeproperty (Person1, "name"));//true person1.name= "John";
    Alert (Hasprototypeproperty (Person1, "name"));//false//Using for-in returns all properties that can be accessed through an object, enumerable, and contain both a stereotype and an instance property.
    The instance properties of an enumerable attribute (a property marked as false) in the prototype are also returned in for-in a bug in the previous version: the instance property that masks an enumerable property in the prototype does not return//eg in for-in: var o={tostring:function () {RETUrn "my object";

    }
    }; For (Var prop in O) {if (prop== "toString") {alert ("found");//not shown in earlier versions of IE}}//To get all enumerable properties on an object, you can Use the ECMAScript5 Object.keys () method.
    Accept an object as an argument,////The string array function person () {} person.prototype.name= "amber" containing all enumerable properties;
    person.prototype.age=23;
    person.prototype.job= "Software Engineer";
    Person.prototype.sayname=function () {alert (this.name)} var person1=new person ();
    var person2=new person ();
    var keys=object.keys (Person.prototype); Alert (keys) person1.name= "Amber.
    Xu ";
    person1.age=23;
    var keys=object.keys (Person1); Alert (keys) alert ("-----------------------------------------")//If you want to get all of the instance properties regardless of whether or not he can enumerate, you can use alert (object.ge
    Townpropertynames (Person1));

    Alert (Object.getownpropertynames (Person.prototype)); Alert ("Simpler prototype Syntax-----------------------------------------")//3, simpler prototype syntax function person () {} Person.pro totype={Name: "AMBER ", age:23, Job:" Software ", Sayname:function () {alert (this.name)}}//So written after con
    The Structor property no longer points to the person function but points to the object constructor.
    Although the correct result can be returned through the instanceof operator, the type of object cannot be determined by constructor, Eg:var friend=new person (); Alert (friend instanceof person)//true alert (friend instanceof Object)//true alert (Friend.constructor==person);//fa 

    LSE alert (Friend.constructor==object);//true//If constructor is really important to you, you can set the appropriate value function person () {} to the following person.prototype={Constructor:person, Name: "AMBER", age:23, Job: "Software", sayname:f
    The Unction () {alert (this.name)}} var friend=new person (); Alert ("Manually set constructor-----------------------------------------") alert (Friend.constructor==person);//true//Such hands
    The addition of constructor will make constructor an enumerable (the native constructor property cannot be enumerated). In this case, you can use Object.defineproperty (Person.prototype, "constructor", {Enumerable:false, ValUe:person});
    The dynamic nature of the prototype Var friend=new person ();
    Person.prototype.sayhi=function () {alert ("Hi"); Friend.sayhi ();//hi (normal execution)//Because the connection between the instance and the prototype is loosely connected, the link between the instance and the prototype is just a pointer, not a copy//when we call the Sayhi () method, we first search the instance for the side named Sayhi

    Method, the prototype will be searched if it is not found.
    However, if you rewrite the entire prototype object, the situation is different.
    We know that calling a constructor adds a prototype pointer to the original prototype for the instance, and modifying the prototype to another object is tantamount to cutting off the relationship between the constructor and the original prototype. Keep in mind that pointers in an instance point only to the stereotype, not to the constructor.
    Eg:function A () {} var a1=new a ();
        a.prototype={constructor:a, Name: "AMBER", age:23, Job: "Software", Sayname:function () {
    Alert (this.name)} alert ("ERROR-------------------------------------");
    Alert (A1.sayname ()); We created an instance of a, it then rewrites its prototype object, and then an error occurred in the call to A1.sayname (), because a prototype that does not contain an attribute/method named by that name///The native object's prototype//prototype pattern is not only important in creating a custom type. Even all native reference types are created using this pattern. All native reference types//methods defined on the prototypes of their constructors Eg:alert (typeof Array.prototype.sort);//function alert (typeof string.prototype.s ubstring);//function///Not only can the prototype of the native object be takenIf you have a reference to the default method, and you can define a new method//Add a StartsWith () method for String type string.prototype.startswith=function (text) {return this
    . indexOf (text) = = 0;
    };
    var msg= "Hello";

    Alert (Msg.startswith ("H"));

    We do not propose to do so.
    Alert ("Problem with a prototype object"); 
      6, the problem instance of the prototype object function Ques () {} ques.prototype={constructor:ques, Name: "Amber", age:23,

    Job: "IT", friends:["John", "Dick"],//Reference type Sayname:function () {alert (this.name)}};
    var q1=new ques ();
    var q2=new ques ();
    Q1.friends.push ("Harry");
  Alert (q1.friends),//alert (q2.friends),//alert (q1.friends===q2.friends); I believe you have seen the problem, when I created two instances of Q1, Q2, when I added "Harry" to Q1 's "friends", Q2 's "friends" also had three sheets, Dick, Harry//That is because the array exists on the Ques.prototype, not the Q1.

  So there was the result.
  And it is this problem that we rarely see the reason why people use the prototype model alone. </script>

This article is here first, and later we continue to discuss JavaScript object-oriented programming, I hope you can enjoy.