简体   繁体   English

尝试将方法附加到类原型时,为什么代码会中断?

[英]Why does my code break when I try to attach my methods to the class prototype?

I'm trying to create a button class that toggles a video or image carousel. 我正在尝试创建一个用于切换视频或图像轮播的按钮类。 Whenever I attach my methods to the prototype, my code fails. 每当我将方法附加到原型时,我的代码都会失败。

I'm attempting to use the Design Pattern: Revealing Prototype Pattern 我正在尝试使用“设计模式:揭示原型模式”

https://scotch.io/bar-talk/4-javascript-design-patterns-you-should-know https://scotch.io/bar-talk/4-javascript-design-patterns-you-should-know

my code pen: https://codepen.io/Woodenchops/pen/QRzeXX?editors=0010 我的密码笔: https : //codepen.io/Woodenchops/pen/QRzeXX?editors=0010

function playToggle(props) {

  console.log(this);

  this._parentElement = props.parentElement;
  this._button = props.button;
  this._playing = props.playing;
  this._props = props;
  this._mediaType = props.mediaType;
  this._video_id = props.videoID;
  this._caroursel_id = props.carouselID;

}

playToggle.prototype = function () {

// methods here

}()

(function () {

  var video = document.querySelectorAll('.container');

  videoArray = [];

  video.forEach(function (vid) {
    videoArray.push(new playToggle({
      parentElement: vid,
      button: '.playpause',
      playing: true,
      mediaType: 'video',
      videoID: '.myVideo'
    }))
  });

})();

I have console logged this in the prototype, and it returns the window object instead. 我有控制台登录this原型,并返回窗口对象来代替。 I have also tried using bind to bind it to the class - with no luck 我也尝试过使用bind其绑定到类-没有运气

You have not defined the prototype properly 您没有正确定义原型

playToggle.prototype.thePrototypeName = function() {..}

 var play = new playToggle();
 play.thePrototypeName()

Console Log Result 控制台日志结果

Object: playToggle {}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

相关问题 尝试刷新usestate时为什么程序会中断? - Why does my program break when I try to refresh the usestate? 当我将脚本类型设置为模块时,为什么我的 D3 代码会中断? - Why does my D3 code break when I set the script type to module? 当我将 Tableau 示例中的 URL 更改为另一个 URL 时,为什么我的代码会中断? - Why does my code break when I change the URL in the Tableau sample to another URL? 为什么当我尝试通过添加类来使用 jQuery 隐藏我的 CSS 三角形时它不起作用? - Why when I try to hide my CSS triangle with jQuery by adding a class does it not work? 为什么此循环会破坏我的代码? - Why does this loop break my code? 当我尝试在组件上使用数组方法时,为什么我的数组变量未在我的组件中定义? - Why is my array variable undefined in my component when I try to use array methods on it? 为什么在尝试清理事件处理程序时,该事件处理程序代码会中断? - Why does this event handling code for ender break when I try to clean it up some? 无法在我的JQuery原型类上引用方法 - Cannot reference methods on my JQuery prototype class 为什么我不能在我的javascript代码中继承Animal类的原型? - Why can't I inherit the prototype of the Animal class in my javascript code? 为什么当我通过 jQuery 将它附加到回调时,我传递给 function 的 functionToCallOnOk 没有被调用? - Why functionToCallOnOk I pass to my function does not get called when I attach it to callback via jQuery?
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM