This is the fourth day of my participation in the August Text Challenge.More challenges in August

The data type

Basic types of

Number String Boolean undefined null
Any numerical Arbitrary string true/false undefined null
typeof typeof typeof typeof/=== = = =

Object (reference) type

Object Array Function
Any object Special object (internal data order/data subscript) Special object (executable)
typeof/instanceof instanceof typeof

Note: Typeof cannot distinguish between types :null and Object, Object and Array

Issues related to

  1. Undefined is null.
  • Undefined means the definition has no value assigned
  • Nulll is defined and assigned, but null
  1. When do I assign a variable to null?
  • Initial assignment, indicating that object \ will be assigned
  • Make the object garbage (to be collected by the garbage collector) before finishing
  1. Strict distinction between variable types and data types?

  • Js variables themselves do not have a type, the type of the variable is actually the type of the data in the variable memory

  • Variable type:

    • Primitive type: A variable that holds data of primitive type
    • Reference type: A variable that holds the address value of an object

  • Data object basic type: Saves the data object type of the basic type: saves the address value

Data, variables and memory

What is data

Readable, transferable ‘something’ that holds specific information in memory

Everything is data, and functions are data

The target of all operations in memory: data

Including (arithmetic operations, logical operations, assignment, running functions)

What is a variable?

Its value is how much it is allowed to change while the program is running

A variable corresponds to a small piece of memory in which its value is stored

What is memory?

Storage space created when a memory module is powered on (temporary)

A piece of memory contains two aspects of data

  • Internally stored data
  • Address value data

Classification of memory space

  • Stack space: global and local variables
  • Heap space: objects

The relationship between memory, data and variables

  • Memory is a container for storing different data
  • Variables are memory identifiers through which we can manipulate (read/write) data in memory

Issues related to

1. Assignment and memory issues

Var a = XXX, what does a hold in memory?

XXX is the basic data, which is the data saved

XXX is an object and holds the address value of the object

XXX is a variable that holds the memory contents of XXX (which may be basic data or address values)

2. The problem of reference variable assignment

Two reference variables refer to the same object. One variable modifies the internal data of the object, and the other variable sees the modified data

Two reference variables point to the same object, so that one reference variable points to the other object, and the other reference variable still points to the previous object

var obj1 = {name: 'Tom'}
  var obj2 = obj1
  obj2.age = 12
  console.log(obj1.age)  / / 12
 function fn (obj) {
    obj.name = 'A'
  }
  fn(obj1)
  console.log(obj2.name) //A


  var a = {age: 12}
  var b = a
  a = {name: 'BOB'.age: 13}
  b.age = 14
  console.log(b.age, a.name, a.age) // 14 Bob 13

  function fn2 (obj) {
    obj = {age: 15}
  }
  fn2(a)
  console.log(a.age) / / 13
Copy the code

3. Data transmission

When a variable parameter is passed when a FUNCTION is called by js, it is passed by value or by reference

Understanding 1: All values (base/address values) are passed

Understanding 2: Either value passing or reference passing (address value)

var a = 3
  function fn (a) {
    a = a +1
  }
  fn(a)
  console.log(a) / / 3

  function fn2 (obj) {
    console.log(obj.name)  //tom
  }
  var obj = {name: 'Tom'}
  fn2(obj)
Copy the code

4. How does the JS engine manage memory

  1. Memory life cycle
  • Allocate a small memory space and get the use of it
  • Store data and perform repeated operations
  • Free up small memory space
  1. Free memory
  • Local variables: the function is automatically released after execution
  • Object: becomes garbage object ==> Garbage collector 2 collects
 var a = 3
  var obj = {}
  obj = undefined
  function fn () {
    var b = {}
  }
  fn()  //b is automatically released, and the object pointed to by b is collected by the garbage collector at a later point
Copy the code

object

What is an object?

An encapsulation of multiple data

A container used to hold multiple pieces of data

An object represents a thing in reality

Why objects?

Manage multiple data in a unified manner

Object composition

Attribute: Consists of the attribute name (string) and the attribute value (arbitrary)

Method: a special attribute (the attribute value is a function)

How do I access object internal data?

Attribute name: Easy to encode and sometimes unusable

[' attribute name ']: Cumbersome encoding, universal

Question: When must it be used[' Attribute name ']The way?

The attribute name contains special characters: - space The attribute name is indeterminatevar p = {}
  //1. Add a property to the p object: Content Type: text/json
  // p.content-type = 'text/json' // not available
  p['content-type'] = 'text/json'
  console.log(p['content-type'])

  //2. The attribute name is indeterminate
  var propName = 'myAge'
  var value = 18
  // p.propname = value // invalid
  p[propName] = value
  console.log(p[propName])
Copy the code

function

What is a function

A package of n statements that implement a specific function

Only functions can be executed; other types of data cannot be executed

How do you define a function?

Function declarations, expressions

How is a function called (executed)

Test () calls obj.test() directly through the objectnew test()          newCall test.call()/apply(obj) defines the function by temporarily making test an obj method callfunction fn1 () {   // Function declaration
    console.log('fn1()')}var fn2 = function () { / / expression
    console.log('fn2()')
  }
  fn1()
  fn2()   // Call directly
  
var obj = {}
  function test2 () {
    this.xxx = 'hello'
  }
  // obj.test2() is not directly available
  test2.call(obj) // Or test2.apply(obj) // a function can be called as a method specifying any object
  console.log(obj.xxx)  // How are you
Copy the code

The callback function

What is a callback function

  1. You define
  2. You don’t have the
  3. But he finally did it (under certain conditions or at certain times)

Common callback functions

  • The DOM event callback function ==> the DOM element on which the event occurred
  • Timer callback ==>window
  • Ajax request callback function
  • Lifecycle callback function
 // dom event callback function
document.getElementById('btn').onclick = function () {
    alert(this.innerHTML)
  }

 // Timer callback function
setTimeout(function () {
    alert('It's time.'+this)},2000)
Copy the code

Anonymous function calls

  • Hide the implementation
  • Does not pollute the external (global) namespace
  • Use it to encode JS modules
  (function () { // The anonymous function calls itself
    var a = 3
    console.log(a + 3)
  })()

  var a = 4
  console.log(a) ; (function () {  // Notice that the parentheses are added;
    var a = 1
    function test () {
      console.log(++a)
    }
    window$=function () { // Expose a global function
      return {
        test: test
      }
    }
  })()

  $().test() $is a function. $returns an object
Copy the code

This in the function

What is this

Any function is essentially called from an object, and if it is not specified directly it is a window

All functions have a variable this inside them

Its value is the current object on which the function is called

How do I determine the value of this?

test(): ——–window

p.test():——-p

New test():—- Newly created object

p.call(obj):—-obj

  function Person(color) {
   console.log(this)
   this.color = color;
   this.getColor = function () {
     console.log(this)
     return this.color;
   };
   this.setColor = function (color) {
     console.log(this)
     this.color = color;
   };
 }

 Person("red"); / / this is who? window

 var p = new Person("yello"); / / this is who? p

 p.getColor(); / / this is who? p

 var obj = {};
 p.setColor.call(obj, "black"); / / this is who? obj

 var test = p.setColor;
 test(); / / this is who? window

 function fun1() {
   function fun2() {
     console.log(this);
   }

   fun2(); / / this is who? window
 }
 fun1();
Copy the code

The last

This article serves as my study summary, at the same time shares to everybody because the personal technology is limited, if has found the mistake or has the question place, welcome to point out or gives advice! Thank you very much!