js variable types and prototypes

Variable types and calculations

• What types can be obtained using typeof in js

  • typeof undefined //undefined
  • typeof “abc” //string
  • typeof 123 //number
  • typeof true //boolean
  • typeof {} //object
  • typeof null //object
  • typeof [] //object
  • typeof console.log //function

• When to use === When to use ==

  • if (obj.a == null){

    ​ //Equivalent to obj.a === null || obj.a === undefined, short form. This is the recommended way of writing in the jquery source code

    ​ //All other situations are used ===

    }

• What are the built-in functions in js

  • Object
  • Array
  • Boolean
  • Number
  • String
  • Function
  • Date
  • RegExp
  • Error

• Which types of js variables are classified according to the storage method, and describe their characteristics

  • Basic data type
    • The value is stored in the stack memory
  • Application data type
    • The value is stored in the heap memory, if there is a negative value, then all you get is a pointer

• How to understand JSON

  • JSON is just a js object

    • Common method

      JSON.stringify({a:10, b:20})

      JSON.parse(’{“a”:10, “b”:20}’)

• How to accurately determine whether a variable is an array type

  • instanceof Array

• Write a prototype chain inheritance example

  • All reference types (arrays, objects, functions) have object characteristics and can be extended freely (except for "NULL" accidents)

  • All reference types (arrays, objects, functions) have an __proto__attribute, and the attribute value is an ordinary object

  • All functions have a prototype attribute, and the attribute value is also an ordinary object

  • For all reference types (arrays, objects, functions), the __proto__property value points to the "prototype" property value of its constructor

  • When trying to get a certain property of an object, if the object itself does not have this property, it will look for it __proto__(that is, the prototype of its constructor).

    // 动物
    function Animal(){
            
            
        this.eat = function() {
            
            
            console.log('animal eat');
        }
    }
    
    // 狗
    function Dog(){
            
            
        this.bark = function() {
            
            
            console.log('dog bark')
        }
    }
    Dog.prototype = new Animal()
    // 哈士奇
    var hashiqi = new Dog()
    

    hasOwnProperty() The method returns a boolean value indicating whether the object has the specified property (that is, whether it has a specified key).

• Describe the process of NEW an object

  • Create an object
  • this points to this new object
  • Execute the code, that is, assign a value to this
  • Return this

• How to use the prototype chain in zepto (or other framework) source code

  // 构造函数
  function DomElement(selector) {
        
        
      var result = document.querySelectorAll(selector)
      var length = result.length
      var i
      for (i = 0; i < length; i++) {
        
        
          this[i] = selectorResult[i]
      }
      this.length = length
  }
  // 修改原型
  DomElement.prototype = {
        
        
      constructor: DomElement,
      get: function (index) {
        
        
          return this[index]
      },
      forEach: function (fn) {
        
        
          var i
          for (i = 0; i < this.length; i++) {
        
        
              const elem = this[i]
              const result = fn.call(elem, elem, i)
              if (result === false) {
        
        
                  break
              }
          }
          return this
      },
      on: function (type, fn) {
        
        
          return this.forEach(elem => {
        
        
              elem.addEventListener(type, fn, false)
          })
      }
  }
  
  // 使用
  var $div = new DomElement('div')
  $div.on('click', function() {
        
        
      console.log('click')
  })