Question

我使用以下JavaScript，我认为它是面向对象的。其他人不同意这是面向对象的。

window.onload = function () {
var myphotos;
var currentImage;
var totalImageCount;

function initSlideImages(){
    myphotos = new Array (
            "slide_image_1",
            "slide_image_2",
            "slide_image_3",
            "slide_image_4",
            "slide_image_5"
        );
    currentImage = 1;
    totalImageCount = myphotos.length;

}

initSlideImages(); // Initialise slideshow

function nextPhoto(){
    currentImage++;
    if (currentImage > totalImageCount) {
        currentImage = 1;
    }
    var theImage = document.getElementById("slide_image");
    if (theImage != null){
        theImage.src = "images/portfolio/" + theImage.id + "_" + currentImage + ".jpg";
    }
}

function previousPhoto(){
    currentImage--;
    if (currentImage == 0){
        currentImage = totalImageCount;
    }
    var theImage = document.getElementById("slide_image");
    if (theImage != null){
        theImage.src = "images/portfolio/" + theImage.id + "_" + currentImage + ".jpg";
    }
}

var slide_prev = document.getElementById("slide-prev");
if (slide_prev != null){
    slide_prev.onclick = function() {
        previousPhoto();
    }
}

var slide_next = document.getElementById("slide-next");
if (slide_next != null){
    slide_next.onclick = function() {
        nextPhoto();
    }
}

}

您是否同意这是面向对象的JavaScript？我相信它是。有构造函数（例如initSlideImages）和文字符号对象（例如myphotos，currentImage）。根据我对OO JS的理解，“slide_prev”和“slide_next”是我所知道的方法。

我是对的，还是需要重新访问面向对象的JavaScript 101？

Answer 1

这是一种传统的JavaScript，与OOJS无关。 OOJS创建新对象和成员函数。 OOJS的一个例子是：

function Person() { }
var person1 = new Person();
var person2 = new Person();

或类似的东西：

var myObject = {  

};

这就是你定义方法的方法：

function myObject(){  
    this.iAm = 'an object';  
    this.whatAmI = function(){  
        alert('I am ' + this.iAm);  
    };  
};

或者，文字版本是这样的：

var myObject = {  
    iAm : 'an object',  
    whatAmI : function(){  
        alert('I am ' + this.iAm);  
    }  
}

<强>参考

Answer 2

有构造函数（例如initSlideImages）

函数initSlideImages不用作构造函数。

和文字符号对象（例如myphotos，currentImage）。

在我认为你的意思中，这些不是文字。它们只是普通的旧全局变量。即使它们是，这与JavaScript中的OOP没有太大关系。

根据我对OO JS的理解，
“slide_prev”和“slide_next”是我所知道的方法。

那些不是方法。

我是对的，还是需要重新访问面向对象的JavaScript 101？

你离右边很远。您的帖子中的术语都没有准确使用。是的，你应该从头开始。

Answer 3

您的代码看起来比面向对象更具程序性。面向对象通常意味着封装和继承。在面向对象的JavaScript中，您的代码通常如下所示：

// Constructor
function Slider(photos) {
  this.photos = photos;
  this._init();
}

// Methods
Slider.prototype._init = function() {
  // grab selectors, add events, initialization logic
};

Slider.prototype.count = function() {
  return this.photos.length;
};

Slider.prototype.next = function() {
  //...
};

Slider.prototype.prev = function() {
  //...
};

var photos = [
  "slide_image_1",
  "slide_image_2",
  "slide_image_3",
  "slide_image_4",
  "slide_image_5"
];
var slider = new Slider(photos);

slider.next(); // go to next slide

Answer 4

这不是面向对象的JS。没有使用'new'运算符的对象实例化。没有为'类似'构造函数定义属性。

重构面向对象的代码如下：

onMessageReceived()

这是面向对象的JavaScript吗？

4 个答案: