What is an object? What do you know about your partner?

Well, this object is not who you think it is. Now let’s get down to business. Let’s start with an example:

var HuaZiGe = {
    name: 'huazi'.age: 20.sex: 'boy'.smock:function(){
        console.log('I am somking! cool! ')
        //HuaZiGe.health--
        this.health--
    },
    drink:function(){
        console.log('I am drink')
        //HuaZiGe.health++
        this.health++
    },
    health:100
    }
Copy the code

This is a basic object declaration that declares a HuaZiGe object with attributes: name, age, sex, health, smock(), drink().

What operations can this object do?

// The attributes inside the object are readable and writable
HuaZiGe.health++ 
console.log(HuaZiGe.health)/ / 101

// The methods inside the object can be called, and the methods can read and write the properties of the object
HuaZiGe.smock()/ / 99
HuaZiGe.drink()/ / 100
HuaZiGe.drink()/ / 101
console.log(HuaZiGe.health)/ / 101

// Add attributes
HuaZiGe.boyFriend = 'lai'

// Check whether the increment succeeded
console.log(HuaZiGe.boyFriend)//'lai'

// Modify attribute values
HuaZiGe.sex = 'girl'
console.log(HuaZiGe.sex)//'gril'

// Delete attributes
delete HuaZiGe.sex
delete HuaZiGe.name
Xxx(xxx).yyy
console.log(HuaZiGe.naem)// undefined is not an error.
// Error when accessing a nonexistent variable, undefinef when accessing a nonexistent attribute of an object

// The next operation prints undefined instead of an error
console.log(HuaZiGe.like)//undefined

Copy the code

The above object is actually a common way of defining objects that most people know. C and Java are almost written this way, but javascpipt object definition has two forms. This is only one of them called declarative (literal) form

// This is a constructor that capitalizes ordinary functions.
function Car(color){
    this.name = 'BMW'  // create attribute name with value 'BMW'
    this.health = 100   // Create the property health with a value of 100
     this.color = color // Create the attribute color with the value of the parameter color
    this.run = function(){
    // If this is not added, an error will be reported
       // health-- //health is not defined
       this.health--
    }
}

// Do the following:
console.log(Car())//undefined (because the constructor returns no value)

var car1 = new Car('pink')
 car1.run()// Call car1 once to decrement health by one
console.log(car1.health)/ / 99

var car2 = new Car('red')

console.log(car1===car2)The false constructor instantiates objects that are independent of each other
 console.log(car1,car2)Car1 = car2; car1 = car2; car2 = car2; car1 = car2;

car1.name = 'red flags'
car2.name = Rolls Royce
car2.run()
console.log(car1,car2)
Copy the code

You may be wondering: how does this operate? Where does the constructor return a value?

Here’s how:

Constructor internals :(when new)

  1. Implicitly add this={} to the front of the constructor body
  2. Execute this.xxx = XXX
  3. Return this implicitly

Put code in to explain:

// constructor
function Student (name ,age, sex){
    // First point (invisible) :
    //var this = {
               //name:''
               //age:''
               //sex:''
              // }
    // Second point:
    this.name = name
    this.age = age
    this.sex = sex
    this.grade = 2019
    // Third point (also invisible) :
    //return this
    
 
   // If return is [](array), function(){} (function), {}(object), change the value of return
}
//console.log(Student()) //undefined has no return value of its own. If there is no new, consider it a normal function call
var student =new  Student('handsome'.20.'boy')// An object can only be returned after new
console.log(student)
Copy the code

Constructors can also be defined in different forms, using the system’s own Object().

var obj = new Object(a)Var obj = {
Copy the code

You can also define your own:

Write the operation mechanism of this. It is generally not recommended to write custom constructors, so that many of the built-in constructors can not be used.

function myPerson(name,age){
    var that = {}
        that.name = name
        that.age = age
        return that
}

var per1 = myPerson('handsome'.20)
var per2 = myPerson('home jun'.20)
console.log(per1,per2)
Copy the code

Now let’s talk about packaging

Same old rule, code!

var num = 123
num.abc = 'aaa'
 console.log(num.abc)//undefined
Copy the code

Why is the output undefined instead of AAA? There’s a rule called:

Primitive values cannot have properties and methods, properties and methods can only have objects, this is unique to objects!!

The types of primitive values are: string, number, Boolean, undefined, null, etc. Some familiar non-primitive values (we call reference types) are: object, Array, function.

With that in mind, let’s answer the question above

Calling a property on the original value implicitly takes place
 var num = 4
 num.len = 3
// Change process:
//new Number(4).len = 3 ->delete num.len
// Create a Number object, set len to 3, and then delete len as a primitive value, but it still exists, as defined later.

// Equivalent to the following code:
var num = new Number(4) // Type packing
num.len = 3;
delete num.len
console.log(num.len)//undefined
Copy the code

Now let’s do an interview question for Ali. I’ll post the answer in the comments section.)

// What is the output result?
var str = 'abc'
 str +=1
var test = typeof(str)
if(test.length == 6){
    test.sign = 'Typeof may return String'
 
}
console.log(test.sign)

Copy the code

Summary:

Object creation

  1. Var obj = {} / / plainObject object literal | object directly
  2. Constructor //1) System built-in constructor Object() //2) custom

Constructor internals :(when new) 1. Implicitly add this={} 2. Execute this. XXX = XXX 3. Implicitly return this two. 1. Rule: Primitive values are not allowed to have properties and methods, properties and methods can only have objects, this is unique to objects!! 2. Invoking a property on a raw value implicitly takes place