SoFunction
Updated on 2025-03-02

Example of data binding function implementation of native javascript similar to vue [Observer Mode]

This article describes the implementation of vue-like data binding functions in native JavaScript. Share it for your reference, as follows:

Observer mode

let observer = {
    /*Subscription Feature*/
    addSubscriber: function (cb) {
      (cb);
    },
    /*Unsubscribe function*/
    removerSubscriber: function (cb) {
      let index = (cb);
      (index, 1)
    },
    // Publish function    publish: function (what) {
      for (let i in ) {
        if (typeof [i] == "function") {
          [i](what);
        }
      }
    },
    // Make each object subscribe    make:function(obj){
      for(let key in this){
        obj[key] = this[key];
      }
       = [];
    },
  }

Examples of usage

  // Define the object    let o = {};
    // Implement data binding and implement publish and subscribe function    (o);
    // Release    $("#num").oninput = function(){
      ();
    };
    // Square function    (function(num){
      $("#sqrnum").value = (num,2);
    });
    (function(num){
      $("#cubenum").value = (num,3);
    });
    (function(num){
      $("#fourFangnum").value = (num,4);
    });
    (function(num){
      $("#sqrtnum").value = (num);
    });
  }
  function $(str){//#box .cls p
    if((0)=="#"){
      return ((1));
    }else if((0)=="."){
      return ((1));
    }else{
      return (str);
    }
  }

Interested friends can use itOnline HTML/CSS/JavaScript front-end code debugging and running toolshttp://tools./code/WebCodeRunTest the above code running effect.

For more information about JavaScript, you can also view the topic of this site: "JavaScript object-oriented tutorial》、《Summary of JavaScript Errors and Debugging Skills》、《Summary of JavaScript data structure and algorithm techniques》、《JavaScript traversal algorithm and skills summary"and"Summary of JavaScript mathematical operations usage

I hope this article will be helpful to everyone's JavaScript programming.