var functionName = function() 不是一个函数

var functionName = function() is not a function

本文关键字:一个 函数 function functionName var      更新时间:2023-09-26

我有一个名为displayer的javascript类,由一个id和一个介于1到8之间的无符号整数指定,其中包含一些方法(initialize(),getId()和addObject)。
问题是,当我在对象上创建新的显示器实例并调用方法时,控制台会抛出一个错误,显示" TypeError: myDisplayer.initialize is not a function "...

结果是我在它上搜索了太多时间,但我仍然看不到问题来自哪里。有人有想法吗?

我插入了一个片段,以便您可以自己判断。

谢谢。

function displayer(a, b) {
  if (typeof a == typeof undefined || typeof b == typeof undefined) {
    err_msg = "The constructor provided for displayer which should be displayer(id, size) does not fit.";
    throw {
      name: "Contructor Error",
      level: "Show Stopper",
      message: err_msg,
      htmlMessage: "<span style='color:red;'>" + err_msg + "</span>",
      toString: function() {
        return this.name + ": " + this.message;
      }
    };
  } else {
    if (typeof a == 'string') {
      var id = a;
      return true;
    } else {
      var id = $(a).prop('id');
      return;
    }
    this.getId = function() {
      return id;
    };
    this.initialize = function() {
      $('#' + id).css('background', '#000000');
      $('#' + id).css('color', '#FFFFFF');
      $('#' + id).css('padding', '5px');
      $('#' + id).css('border-width', '2px');
      $('#' + id).css('border-style', 'solid');
      $('#' + id).css('border-radius', '10px');
      $('#' + id).css('border-color', '#555555');
      switch (b) {
        case 1:
          if (screen.availHeight < 600 || screen.availWidth < 800) {
            $('#' + id).hide();
            err_msg = "The selected screen resolution (800x600) oversizes the actual resolution (" + screen.availWidth + "x" + screen.availHeight + ")";
            throw {
              name: "Fit Error",
              level: "Show Stopper",
              message: err_msg,
              htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
              toString: function() {
                return this.name + ": " + this.message;
              }
            };
            return false;
          } else {
            $('#' + id).css('width', '800px');
            $('#' + id).css('height', '600px');
            return true;
          }
          break;
        case 2:
          if (screen.availHeight < 600 || screen.availWidth < 1024) {
            $('#' + id).hide();
            err_msg = "The selected screen resolution (1024x600) oversizes the actual resolution (" + screen.availWidth + "x" + screen.availHeight + ")";
            throw {
              name: "Fit Error",
              level: "Show Stopper",
              message: err_msg,
              htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
              toString: function() {
                return this.name + ": " + this.message;
              }
            };
            return false;
          } else {
            $('#' + id).css('width', '1024px');
            $('#' + id).css('height', '600px');
            return true;
          }
          break;
        case 3:
          if (screen.availHeight < 768 || screen.availWidth < 1024) {
            $('#' + id).hide();
            err_msg = "The selected screen resolution (1024x768) oversizes the actual resolution (" + screen.availWidth + "x" + screen.availHeight + ")";
            throw {
              name: "Fit Error",
              level: "Show Stopper",
              message: err_msg,
              htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
              toString: function() {
                return this.name + ": " + this.message;
              }
            };
            return false;
          } else {
            $('#' + id).css('width', '1024px');
            $('#' + id).css('height', '768px');
            return true;
          }
          break;
        case 4:
          if (screen.availHeight < 864 || screen.availWidth < 1152) {
            $('#' + id).hide();
            err_msg = "The selected screen resolution (1152x864) oversizes the actual resolution (" + screen.availWidth + "x" + screen.availHeight + ")";
            throw {
              name: "Fit Error",
              level: "Show Stopper",
              message: err_msg,
              htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
              toString: function() {
                return this.name + ": " + this.message;
              }
            };
            return false;
          } else {
            $('#' + id).css('width', '1152px');
            $('#' + id).css('height', '864px');
            return true;
          }
          break;
        case 5:
          if (screen.availHeight < 720 || screen.availWidth < 1280) {
            $('#' + id).hide();
            err_msg = "The selected screen resolution (1280x720) oversizes the actual resolution (" + screen.availWidth + "x" + screen.availHeight + ")";
            throw {
              name: "Fit Error",
              level: "Show Stopper",
              message: err_msg,
              htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
              toString: function() {
                return this.name + ": " + this.message;
              }
            };
            return false;
          } else {
            $('#' + id).css('width', '1280px');
            $('#' + id).css('height', '720px');
            return true;
          }
          break;
        case 6:
          if (screen.availHeight < 768 || screen.availWidth < 1280) {
            $('#' + id).hide();
            err_msg = "The selected screen resolution (1280x768) oversizes the actual resolution (" + screen.availWidth + "x" + screen.availHeight + ")";
            throw {
              name: "Fit Error",
              level: "Show Stopper",
              message: err_msg,
              htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
              toString: function() {
                return this.name + ": " + this.message;
              }
            };
            return false;
          } else {
            $('#' + id).css('width', '1280px');
            $('#' + id).css('height', '768px');
            return true;
          }
          break;
        case 7:
          if (screen.availHeight < 800 || screen.availWidth < 1280) {
            $('#' + id).hide();
            err_msg = "The selected screen resolution (1280x800) oversizes the actual resolution (" + screen.availWidth + "x" + screen.availHeight + ")";
            throw {
              name: "Fit Error",
              level: "Show Stopper",
              message: err_msg,
              htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
              toString: function() {
                return this.name + ": " + this.message;
              }
            };
            return false
          } else {
            $('#' + id).css('width', '1280px');
            $('#' + id).css('height', '800px');
            return true;
          }
          break;
        case 8:
          if (screen.availHeight < 1024 || screen.availWidth < 1280) {
            $('#' + id).hide();
            err_msg = "The selected screen resolution (1280x1024) oversizes the actual resolution (" + screen.availWidth + "x" + screen.availHeight + ")";
            throw {
              name: "Fit Error",
              level: "Show Stopper",
              message: err_msg,
              htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
              toString: function() {
                return this.name + ": " + this.message;
              }
            };
            return false;
          } else {
            $('#' + id).css('width', '1280px');
            $('#' + id).css('height', '1024px');
            return true;
          }
          break;
        default:
          $('#' + id).hide();
          err_msg = "The selected screen resolution (" + b + ") isn't recognized by our system. Resolutions go from 1 to 8.";
          throw {
            name: "Syntax Error",
            level: "Show Stopper",
            message: err_msg,
            htmlMessage: "<span style='color:red>" + err_msg + "<span>",
            toString: function() {
              return this.name + ": " + this.message;
            }
          };
          return false;
          break;
      }
    };
    //c = obj id, d = top pos, e = left pos
    this.addObject = function(c, d, e) {
      if (typeof d == typeof 42 && typeof e == typeof 42) {
        $('#' + id).append($('#' + c));
        posTop = $('#' + id).offset().top + d;
        posLeft = $('#' + id).offset().left + e;
        $('#' + c).offset({
          top: posTop,
          left: posLeft
        });
        return true;
      } else {
        err_msg = "The positions given for the addObject(id, posTop, posLeft) method are not numerical.";
        throw {
          name: "Syntax Error",
          level: "Show Stopper",
          message: err_msg,
          htmlMessage: "<span style='color:red'>" + err_msg + "</span>",
          toString: function() {
            return this.name + ": " + this.message;
          }
        };
        return false;
      }
    };
  }
}
function createDisplayer(id, res) {
  var myDisplayer = new displayer(id, res);
  myDisplayer.initialize();
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button onclick="createDisplayer('anId',1);">Create the displayer</button>
<br/>
<div id="anId"></div>

您在处理 a 的值时过早返回。

if (typeof a == 'string') {
  var id = a;
  return true; // remove this
} else {
  var id = $(a).prop('id');
  return; // and this
}

知道我是如何发现这一点可能对你有用。当您认为应该为某些内容分配给定值但事实并非如此时,一种常见的做法是将日志记录语句放在预期赋值之前或之后。

我在this.initialize = function() { ...之前放置了一个console.log,然后注意到它从未被记录过。这表明该函数必须在该点之前返回。