我对“这个”摸不着头脑JavaScript 中的声明。请有人帮忙

发布于 2024-10-20 20:59:15 字数 1842 浏览 1 评论 0原文

好吧，一天后我设法将问题范围缩小到两行代码。也许我试图错误地使用这个声明。

        function scheduleItemView(myId){
            this.update = function(show){
                document.getElementById(this.id+'-title').innerHTML = show.title +": "+ show.startDate;
                document.getElementById(this.id+'-title-overlay').innerHTML = show.title +": "+ show.startDate;
                document.getElementById(this.id+'-description').innerHTML = truncate(show.description,190);
                document.getElementById(this.id+'-time-start').innerHTML = show.startTime;
                document.getElementById(this.id+'-time-end').innerHTML = show.endTime;
            };
            this.id=myId;
            return true;
        }

        function nowNextView(){
            this.now = new scheduleItemView('now');
            this.next = new scheduleItemView('next');
            this.update = function(type,args){
                var myshow=args[0];

    // problem is below. I have to use the global name to access the update method.   
                    myNowNextView.now.update(myshow.now);
                    myNowNextView.next.update(myshow.next);

    // whereas what I want to do is reference them using the "this" command like below.
    //  this.now.update(myshow.now);
    //  this.next.update(myshow.next);
    // the above doesnt work. The update method in scheduleItemView is not seen unless referenced globally
    // BUT even more infuriating, this.now.id does return "now" so it can access the object, just not the method
    // any ideas?

            };
         }

然后实例化对象

var myNowNextView = new nowNextView();

，然后运行该方法：

myNowNextView.update(stuff);

我试图描述程序体内的问题。代码中没有抛出任何错误，在它不情愿地告诉我它找不到该方法之前，我必须执行 try/catch。设计是否有缺陷？我可以不这样做吗？预先非常感谢，史蒂夫

原文

Ok after a day I managed to narrow down the problem to 2 lines of code. Maybe I am trying to use the this statement incorrectly.

        function scheduleItemView(myId){
            this.update = function(show){
                document.getElementById(this.id+'-title').innerHTML = show.title +": "+ show.startDate;
                document.getElementById(this.id+'-title-overlay').innerHTML = show.title +": "+ show.startDate;
                document.getElementById(this.id+'-description').innerHTML = truncate(show.description,190);
                document.getElementById(this.id+'-time-start').innerHTML = show.startTime;
                document.getElementById(this.id+'-time-end').innerHTML = show.endTime;
            };
            this.id=myId;
            return true;
        }

        function nowNextView(){
            this.now = new scheduleItemView('now');
            this.next = new scheduleItemView('next');
            this.update = function(type,args){
                var myshow=args[0];

    // problem is below. I have to use the global name to access the update method.   
                    myNowNextView.now.update(myshow.now);
                    myNowNextView.next.update(myshow.next);

    // whereas what I want to do is reference them using the "this" command like below.
    //  this.now.update(myshow.now);
    //  this.next.update(myshow.next);
    // the above doesnt work. The update method in scheduleItemView is not seen unless referenced globally
    // BUT even more infuriating, this.now.id does return "now" so it can access the object, just not the method
    // any ideas?

            };
         }

object is then instantiated with

var myNowNextView = new nowNextView();

and then I run the method:

myNowNextView.update(stuff);

I tried to describe the problem within the body of the program. No error in the code was thrown, and I had to do a try/catch before it grudgingly told me that it couldn't find the method.
Is the design flawed somehow? can I not do this?
Many thanks in advance,
Steve

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

若无相欠,怎会相见 2024-10-27 20:59:15

function scheduleItemView(myId){
this.update = function(show){
  document.getElementById(this.id+'-title').innerHTML = show.title +": "+ show.startDate;
  document.getElementById(this.id+'-title-overlay').innerHTML = show.title +": "+ show.startDate;
  document.getElementById(this.id+'-description').innerHTML = truncate(show.description,190);
  document.getElementById(this.id+'-time-start').innerHTML = show.startTime;
  document.getElementById(this.id+'-time-end').innerHTML = show.endTime;
};
this.id=myId;
}

function nowNextView(){
var myshow=args[0];
var scope = this;
this.now = new scheduleItemView('now');
this.next = new scheduleItemView('next');
this.update = function(type,args){
      scope.now.update(myshow.now);
      scope.next.update(myshow.next);
};
}

function scheduleItemView(myId){
this.update = function(show){
  document.getElementById(this.id+'-title').innerHTML = show.title +": "+ show.startDate;
  document.getElementById(this.id+'-title-overlay').innerHTML = show.title +": "+ show.startDate;
  document.getElementById(this.id+'-description').innerHTML = truncate(show.description,190);
  document.getElementById(this.id+'-time-start').innerHTML = show.startTime;
  document.getElementById(this.id+'-time-end').innerHTML = show.endTime;
};
this.id=myId;
}

function nowNextView(){
var myshow=args[0];
var scope = this;
this.now = new scheduleItemView('now');
this.next = new scheduleItemView('next');
this.update = function(type,args){
      scope.now.update(myshow.now);
      scope.next.update(myshow.next);
};
}

回复收藏 0 原文

两人的回忆 2024-10-27 20:59:15

我认为学习一下 javascript 中的闭包确实可以让你受益匪浅。看起来您正在尝试将传统的 OO 方法应用于 js 对象，但这不会给您带来预期的结果。

我建议阅读这篇文章，了解使用闭包的简单方法：
http://howtonode.org/why-use-closure

像这样：

<html>
<head>
<script type="text/javascript"> 

  function createScheduleItemView(myId){

    var _show = false

    return {
        setShow : function setShow(show) {
            _show = show
        }, 
        update : function update(){
            document.getElementById( myId +'-title').innerHTML = _show.title;

        }
      }

   }

   function createNowNextView(){

       var _now  = createScheduleItemView('now');
       var _next = createScheduleItemView('next');

       return { 
            publicVar : "Example",
            update : function update(args) {
                var myshow=args[0];
                _now.setShow(myshow.now)
                _now.update();
                _next.setShow(myshow.next)
                _next.update();
            }

        };
     }

   function runIt() {
        nowNextView = createNowNextView()
        args = []
        showArgs = {
            now : {title : "Beauty and the Beast"},
            next : {title: "I did it myyyyyy way"}
        }
        args.push(showArgs)
        nowNextView.update(args)

        //Private variables can not be accessed
        //console.log(nowNextView._now)
        //undefined
        //
        //But anything you return in the object is public
        //console.log(nowNextView.publicVar)
        //Example

   }


</script>
</head>
<body onload="runIt()">

<h3>Now Showing:</h3>
<p id="now-title"></p>

<h3>Up Next:</h3>
<p id="next-title"></p>

 </body>
 </html>

I think you could really benefit from studying closures a bit in javascript. It seems like you are trying to apply a traditional OO approach to js objects, and that won't give you the results you are expecting.

I would recommend reading over this post for an easy way to use closures:
http://howtonode.org/why-use-closure

Something like this:

<html>
<head>
<script type="text/javascript"> 

  function createScheduleItemView(myId){

    var _show = false

    return {
        setShow : function setShow(show) {
            _show = show
        }, 
        update : function update(){
            document.getElementById( myId +'-title').innerHTML = _show.title;

        }
      }

   }

   function createNowNextView(){

       var _now  = createScheduleItemView('now');
       var _next = createScheduleItemView('next');

       return { 
            publicVar : "Example",
            update : function update(args) {
                var myshow=args[0];
                _now.setShow(myshow.now)
                _now.update();
                _next.setShow(myshow.next)
                _next.update();
            }

        };
     }

   function runIt() {
        nowNextView = createNowNextView()
        args = []
        showArgs = {
            now : {title : "Beauty and the Beast"},
            next : {title: "I did it myyyyyy way"}
        }
        args.push(showArgs)
        nowNextView.update(args)

        //Private variables can not be accessed
        //console.log(nowNextView._now)
        //undefined
        //
        //But anything you return in the object is public
        //console.log(nowNextView.publicVar)
        //Example

   }


</script>
</head>
<body onload="runIt()">

<h3>Now Showing:</h3>
<p id="now-title"></p>

<h3>Up Next:</h3>
<p id="next-title"></p>

 </body>
 </html>

回复收藏 0 原文

~没有更多了~