JavaScript Code to Fix Undefined Not Function Callbacks

These utility functions help you fix undefined is not a function error in JavaScript callbacks by providing robust validation and error handling for callback-based code.

Safe Callback Invoker #

function safeCallback(callback, ...args) {
    if (typeof callback === 'function') {
        try {
            return callback(...args);
        } catch (error) {
            console.error('Callback execution error:', error);
            return null;
        }
    }
    console.warn('Callback is not a function:', typeof callback);
    return null;
}

// Usage
safeCallback(myFunction, arg1, arg2);
safeCallback(undefined, arg1, arg2); // Safe - won't crash

Callback Validator #

function validateCallback(callback, required = true) {
    if (required && !callback) {
        throw new Error('Callback is required but not provided');
    }
    
    if (callback && typeof callback !== 'function') {
        throw new TypeError(`Expected function, received ${typeof callback}`);
    }
    
    return true;
}

// Usage
function asyncOperation(data, callback) {
    validateCallback(callback);
    setTimeout(() => callback(data), 1000);
}

Context-Preserving Callback Wrapper #

function bindCallback(obj, methodName) {
    if (!obj || typeof obj[methodName] !== 'function') {
        return () => console.warn(`Method ${methodName} not found or not a function`);
    }
    return obj[methodName].bind(obj);
}

// Usage
const processor = {
    name: 'DataProcessor',
    process: function(data) { console.log(`${this.name}:`, data); }
};

const boundCallback = bindCallback(processor, 'process');
setTimeout(boundCallback, 1000); // Context preserved

Default Callback Provider #

function withDefaultCallback(callback, defaultCallback = () => {}) {
    return typeof callback === 'function' ? callback : defaultCallback;
}

// Usage
function processData(data, callback) {
    const safeCallback = withDefaultCallback(callback, 
        (result) => console.log('Default handler:', result)
    );
    
    const result = data.map(x => x * 2);
    safeCallback(result);
}

Async Callback Handler #

async function safeAsyncCallback(asyncCallback, ...args) {
    if (typeof asyncCallback !== 'function') {
        console.warn('Async callback is not a function');
        return null;
    }
    
    try {
        const result = await asyncCallback(...args);
        return result;
    } catch (error) {
        console.error('Async callback error:', error);
        return null;
    }
}

// Usage
async function fetchData(url, onSuccess) {
    try {
        const response = await fetch(url);
        const data = await response.json();
        await safeAsyncCallback(onSuccess, data);
    } catch (error) {
        console.error('Fetch error:', error);
    }
}

Callback Timeout Handler #

function timeoutCallback(callback, timeout = 5000) {
    if (typeof callback !== 'function') {
        return () => console.warn('Invalid callback provided');
    }
    
    return function(...args) {
        const timeoutId = setTimeout(() => {
            console.warn('Callback execution timeout');
        }, timeout);
        
        try {
            const result = callback(...args);
            clearTimeout(timeoutId);
            return result;
        } catch (error) {
            clearTimeout(timeoutId);
            console.error('Callback error:', error);
            throw error;
        }
    };
}

// Usage
const timedCallback = timeoutCallback(mySlowFunction, 3000);
timedCallback(data);

Complete Callback Utility Class #

class CallbackUtils {
    static validate(callback, required = true) {
        if (required && !callback) {
            throw new Error('Required callback not provided');
        }
        
        if (callback && typeof callback !== 'function') {
            throw new TypeError('Callback must be a function');
        }
        
        return true;
    }
    
    static safe(callback, ...args) {
        if (typeof callback === 'function') {
            try {
                return callback(...args);
            } catch (error) {
                console.error('Callback error:', error);
            }
        }
        return undefined;
    }
    
    static withDefault(callback, defaultFn = () => {}) {
        return typeof callback === 'function' ? callback : defaultFn;
    }
    
    static bind(obj, methodName) {
        if (obj && typeof obj[methodName] === 'function') {
            return obj[methodName].bind(obj);
        }
        return () => console.warn(`Method ${methodName} not available`);
    }
    
    static debounce(callback, delay = 300) {
        let timeoutId;
        return function(...args) {
            clearTimeout(timeoutId);
            timeoutId = setTimeout(() => {
                CallbackUtils.safe(callback, ...args);
            }, delay);
        };
    }
}

// Usage examples
CallbackUtils.validate(myCallback);
CallbackUtils.safe(uncertainCallback, data);
const boundMethod = CallbackUtils.bind(obj, 'method');
const debouncedCallback = CallbackUtils.debounce(callback, 500);

Error Recovery Wrapper #

function recoverableCallback(callback, fallbackCallback) {
    return function(...args) {
        try {
            if (typeof callback === 'function') {
                return callback(...args);
            } else {
                throw new Error('Primary callback is not a function');
            }
        } catch (error) {
            console.warn('Primary callback failed, using fallback:', error.message);
            if (typeof fallbackCallback === 'function') {
                return fallbackCallback(...args);
            }
            console.error('Fallback callback also unavailable');
        }
    };
}

// Usage
const robustCallback = recoverableCallback(
    riskyCallback,
    (data) => console.log('Fallback processed:', data)
);

Interactive Example #

Usage Tips #

1. Always validate callbacks before invoking them
2. Use default parameters for optional callbacks
3. Wrap risky callbacks with error handling
4. Preserve context when binding object methods
5. Implement fallback strategies for critical operations

These utilities help you fix undefined is not a function error in JavaScript callbacks by providing defensive programming patterns and robust error handling for callback-based code.

Customization #

Modify these utilities based on your specific needs:

• Add custom error logging
• Implement retry mechanisms
• Add performance monitoring
• Create domain-specific validation rules

Related Code #

• JavaScript Error Handling Utilities
• Async Callback Management
• Function Validation Helpers