<!--Basic Concepts--> //object oriented and process oriented //1, Object oriented is a programming idea, many languages are object-oriented, Eg:java JS C + + OC //2, All object-oriented languages have three major characteristics: 1, encapsulation, 2, inheritance; 3, polymorphism //3, in object-oriented thinking, there is a very important theory is "everything is Object" &NBSP;//4, object-oriented concept of "class and object" class : Abstract Object (instance) of something with the same characteristics and behavior: The materialized feature-and property behavior--method //5, JS data types are divided into two main categories //5.1, Primitive type: numberbooleanstring null type undefined type (primitive type is store some simple data) //5.2, reference type: Arraydate Function Error Reg object // Where object is a null class with nothing at all ////Above is theory, interview easy to ask </script> <!--declare a custom class--> <script type= " Text/javascript "> //var arr=new Array ();//Standard notation: Where Array is a system class var arr = [2, 3, 4]; Literal notation var a = 10; Arr.a = 5; //The properties and variables of an object are inherently no different, only attributes are attributed to Objects function TestA () { alert (1 111); } Arr.fn = TestA (); Differences in Properties //Methods and Functions: Method attribution to Object //Add attribute to System array object (analogy to document add event) Arr.show = function () { alert (this); This indicates who the current method belongs to! } arr.show (); </script> <!--Custom class--> <script type= "Text/javascript" > //Declares a System class object () objects var per = New Object (); per.name = "Xiao Wang"; per.age = 10; Per.height = 1.82; Per.intro = function () { &NB Sp;alert ("This person's name is:" + this.name); } per.intro (); var per2 = new Object (); per2.name = "King"; Per2.age = 12; Per2.height = 1.62; Per2.intro = function () { alert ("This person's name is:" + this.name); } Per2.intro (); //Here declares two objects per and per2 </script> <!--= Factory method--> <script Type = "Text/javascript" > function Creatperson (name, age, height) { //equivalent to the raw material in the factory: var per = New Object (); //for custom add properties //equivalent to machining per.name = name; per.age = age; & Nbsp;per.height = height; per.intro = function () { alert ("This person's name is:" + this.name); &N Bsp } //equivalent to factory return per; } //Raw material + processing + factory called Factory Method (interview) //creatperson () called constructors //quickly create an object Per1 and per2 var per1 = Creatperson ("AAA", ten, 1.22); var per2 = Creatperson ("BBB", "1.65"); //new function: Automatic declaration of empty objects, automatic return // The second problem with the factory method above: The following results are false alert (Per1.intro = = Per2.intro); <!--The above factory method defects 2--> // Class name. prototype. properties CreatPerson.prototype.intro = function () { alert ("This person's name is:" + this.name); } //When getting the property of an object, the system will first determine whether the object has this property, if any, return the value, if not, go to the constructor of the prototype to find out if there is the attribute //If not, go to the prototype of the object's constructor to find, If none, return underfined //The process of finding attribute values above is called "prototype Chain" (interview) //obj.name; /* Interview Easy Test Center (front end) 1, Common layout patterns 2, animation processing 3, multithreading 4, use of third-party frameworks 5, JS bubbling and capturing 6, prototype chains */ <!-- Native JS and object-oriented differences: 1, the former thinking low cost, fast speed The latter can be conducive to maintenance, thinking high cost 2, the former use of the inconvenience The latter is extremely convenient to use Note: The tab-oriented object writing requires handwriting!!! --> <!-- Change existing code to targetObject writing needs to satisfy 1, all code within onload (equivalent to object-oriented constructors) //rewriting techniques 2, onload equivalent to object-oriented constructors, are the initialization of the Operation 3, A variable is equivalent to an object's property 4, the function is equivalent to the object's method 5, note: function nesting functions are not allowed (for memory optimization) Summary: 80% of the pits in object-oriented are from this!! --> //garbage collection mechanism: //When the function is completed, the system automatically reclaims the memory of the function and its internal local variables, and when the function is called again, re-request memory. //closures: When a function is nested, an intrinsic function can use variables from external functions or variables in parameters /closures to permanently exist in memory //closure benefits //Avoid global variables being contaminated //anonymous function self-invocation In this notation, the function is called once (functions () {}) (); //constructor masquerading----> Calling the Parent class's property assignment in a subclass //call: Calling the parent class's constructor // This refers to the new worker object //inherit the first step: inheriting the parent class property through the call method //the direct interchange prototype, which automatically assigns all the properties contained in the prototype //Inherit the second step: by assigning a value directly to the prototype //constants cannot be assigned a value //The method of turning the system into uppercase toLocaleUpperCase ();
JS Object-oriented
