Ref: https://github.com/reactjs/rfcs/pull/147#issuecomment-623740218

React version: 0.0.0-experimental-e5d06e34b

## Steps To Reproduce

1. createMutableSource that contains functions
2. getSnapshot returns one of the functions

Link to code example:

https://codesandbox.io/s/jovial-dew-1eg4t?file=/src/App.js

## The current behavior

If getSnapshot returns a function, it will run the function in render. This results in various errors.

My workaround: return an object wrapping a function, and destruct on caller.

> For now, you can work around this by returning a function that returns your function

I don't know how this works as workaround.

## The expected behavior

It would be nice if returning a function just works.

Note: this is not a rare use case in my library https://github.com/dai-shi/use-context-selector
because we often pass `[state, setState]` in a context value.
if (hookTypesDev !== null) {
      hookTypesUpdateIndexDev++;
      if (hookTypesDev[hookTypesUpdateIndexDev] !== hookName) {
        warnOnHookMismatchInDev(hookName);
      }
    }
  }
}
function checkDepsAreArrayDev(deps: mixed) {
  if (__DEV__) {
    if (deps !== undefined && deps !== null && !Array.isArray(deps)) {
      
      
      console.error(
        '%s received a final argument that is not an array (instead, received `%s`). When ' +
          'specified, the final argument must be an array.',
        currentHookNameInDev,
        typeof deps,
      );
    }
  }
}
function warnOnHookMismatchInDev(currentHookName: HookType) {
  if (__DEV__) {
    const componentName = getComponentName(currentlyRenderingFiber.type);
    if (!didWarnAboutMismatchedHooksForComponent.has(componentName)) {
      didWarnAboutMismatchedHooksForComponent.add(componentName);
      if (hookTypesDev !== null) {
        let table = '';
        const secondColumnStart = 30;