Edit Javascript function

Is it possible to edit a JavaScript function after the page has loaded? I want to edit a function dynamically after Loading.开发者_如何学C

You can't edit a function, but you can replace it, e.g.:

var myFunc = function() { return "Hello World"; };

myFunc = function() { return "Goodbye"; };

javascript functions are objects, so can be replaced by setting a new value. Is this what you mean?

Unless you are trying to hack some code that doesn't belong to you, the better solution is to write a more flexible initial javascript function who's behavior can be adapted based on conditions (parameters passed, environment, other state, data fetched from other sources, etc...). Then, the one function you have can be written once initially to handle all your different circumstances.

You can even use design patterns such as passing in callback functions that can be used to adapt the behavior at runtime. If you desire many callbacks, you can pass in an object that has a number of different optional methods and call those during your function. In this way you can significantly alter the behavior of the main function without ever changing it's code by passing in different callback functions.

For example, let's assume we have a parsing function that takes some tagged data structure as input and returns an array of results. We want to be able to modify the behavior of this parsing function by passing in callbacks. So, we write the parsing function to take a callback object. That callback object contains one or more methods (all of which are optional) and a state variable that is passed to each callback. Anyone who has worked with ajax or any asynchronous networking in Javascript will recognize the callback object concept. Here's some pseudo code for such a process that shows how the callback object can be used. A real function would obviously be a lot more involved than this one, but it hopefully illustrates the concept:

function parseMyData(data, callbacks) {
    var output = [];                    // output we accumulate
    var currentTag;
    callbacks = callbacks || {};        // make the callbacks object optional

    // do any preprocessing that the caller specified
    if (callbacks.preProcessData) {
        data = callbacks.preProcessData(data, callbacks.state);
    }

    [[code to parse to the first tag in the data (after doing so currentTag contains the tag we just parsed)]]

    // give our callback object the opportunity to do something to this tag or return null to skip it
    if (callbacks.preProcessTag {
        currentTag = callbacks.preprocessTag(currentTag, callbacks.state);
    }
    if (currentTag) {
        [[code here for the default processing of the tag that will push results into the output array]]
    }
    return(output);
}

If you want to add an action to the existing function you can "hijack" it by putting it in a temporary variable and calling it within your overwritten function. E.g.

// The original function.
function sayName(name) {
    alert(name);
}

// Temporary variable for original function.
var __sayHello = sayName;

// Overwrite the original function, adding extra actions.
sayName = function(name) {
    alert('Hello');
    // Call the original function using its temporary variable.
    __sayHello(name);
}

// Call the overwritten function.
sayName('Bob');

How to edit a function - 101.

If we reconsider that editing a function at runtime is not absolutely changing the guts of the function, but rather changing what the function guts are digesting, then I would say functions are already built to do just that.

example 1 - The guts cannot be changed.

function one(){
  return true;
}
// one() => true;
// Note: We could still change the output without changing the guts.
// !one() => false;

example 2 = The guts can be created to digest a dynamic call.

function one(payload){
  return payload;
}
// one(true) => true;
// one(false) => false;
// one('whatever I want to feed the guts to digest');
// => 'whatever I want to feed the guts to digest';

These are quite simple examples, but since you did not provide any real examples as to what you are trying to do, we have to assume you are attempting normal patterns of programming.

Considering NORMAL patterns of programming, it wouldn't be the function itself that needs to change, rather how you are calling it.

example 3 - Give the choice of which function to the caller.

function firstChoice(payload){
  return http.post(payload);
}

function secondChoice(choice){
  return `Do something else with ${choice}`;
}

// And where you make the choice, perhaps after a click event handler...

function onClick(choice, payload){
  choice ? firstChoice(payload) : secondChoice(choice);
}

Functions are supposed to be small bricks with which you build logic. Give them something small to do, then select between them based on your logic.

To answer your question, in my opinion, assuming normal programming needs...

"Is it possible to edit a JavaScript function after the page has loaded?" YES.

Use arguments in your function definition to add the dynamic ability to suit your needs.