javascript - 有一个问题我不明白，有没有人能解释一下？

Question

来自在线资源论文的问题:

Create javascript so that the following methods 
produce the output listed next to them.

    circle = new Circle();
    console.log(circle.get_area());  // 3.141592653589793
    circle.set_radius(10);
    console.log(circle.get_area());  // 314.1592653589793
    console.log(circle);             // the radius of my circle is 10 and its area is 314.1592653589793

任何人都可以理解被问到的内容吗？

这是我在下面的评论的副本，格式很漂亮:

function Circle() {
    this.pi=3.141592653589793;
    this.radius;
}  

Circle.prototype={
    get_area: function(){
        return this.radius*this.pi;
    },
    set_radius: function(radius){  
        return this.radius=radius;
    }  
};  

circle=new Circle();
circle.set_radius(100);

好的，我已经玩过这个并且有点了解正在发生的事情的要点，尽管我不确定何时或为什么需要使用这种技术进行写作；如果有人能解释一下，我可能会对它的用途有更好的理解。

我的最终代码如下: -

function Circle(r) {
    this.pi=Math.PI;
}  

Circle.prototype={
    get_area: function(){
        return this.radius*this.pi;
    },
    set_radius: function(radius){  
        return this.radius=radius;
    }
};  

var circle=new Circle();
circle.set_radius(100);

Circle.prototype.toString=function(){
    return 'The radius of my circle is '+circle.radius+' and it\'s area is '+this.get_area();
}

console.log(circle);

我不完全确定我是否正确使用 Circle.prototype.toString=function() 因为它似乎只是创建一个字符串。

Answer 1

他们要求您创建一个名为 Circle 的构造函数。它创建的对象将具有 get_area , set_radius , 和 toString以所示方式运行的函数。 (toString 将在最终语句中使用，您将在其中输出 circle 实例的值。)他们可能希望您通过 Circle 为对象提供这些功能。原型(prototype)(见下文)。
Circle是一个构造函数，因为它创建了新对象(从技术上讲，它只是填充它们；它们是由 new 运算符创建的)。有时人们调用这些类，但它们并不是真正的基于类的 OOP 方式中的类(它们是 JavaScript 使用的真正的基于原型(prototype)的 OOP 方式中的构造函数)。

有几种方法可以做到这一点，但同样，通常你会有 Circle为 this 上的实例设置属性的函数，然后将函数分配给 Circle.prototype , 所有对象都是通过 new Circle 创建的会继承。我会举一个例子，但我的印象是这是一个学习练习，所以最好留给读者。但是有一些指针:

在构造函数内部，可以引用new创建的对象使用关键字 this 的运算符.

构造函数对象将有一个名为 prototype 的属性。 .如果您为该原型(prototype)分配属性，它们将被使用您的构造函数创建的实例继承(通过称为原型(prototype)链的东西继承)。所以如果我有一个构造函数Foo ，我可以在 bar 上设置一个属性(例如 Foo.prototype ) ( Foo.prototype.bar = /* whatever */; ) 以及通过 new Foo() 创建的所有实例将有 bar具有该值的属性。

JavaScript 中的函数是一流的对象。您可以像引用字符串或数字一样引用它们。如果我有 function foo() { /* ... */ } ，我可以设置一个变量x引用它( var x = foo; )，然后通过该变量( x(); )调用它。

就像 x可以引用一个函数，bar我上面提到的属性可以引用一个函数。

希望这能让你走上正确的轨道，而不会完全放弃游戏。

重新评论您对引用资料的评论，以了解有关 JavaScript 的更多信息:

我发现 David Flanagan(来自 O'Reilly)的 JavaScript: The Definitive Guide 一书非常好。它可能有点过时了，第五版现在已经有好几年了。

在 http://javascript.crockford.com 上有很多来自备受尊敬的 JavaScript 大师 Douglas Crockford 的文章。 ，但我警告你 Crockford 很简洁。 :-) 聪明且见多识广，即使一个人并不总是同意他的结论。

我真的不喜欢引用我的博客[因为 A)SO 不是关于自我推销，B)“贫血”没有说一半] 但是有 a couple的 posts there我认为might help .

在下面回复我的评论:真的，我不能没有一个例子就离开这个，因为这样做没有帮助。所以这里有一个构造函数和一些与之关联的函数的例子:

// A constructor function called `Person`
function Person(fname, lname) {

    // Within the constructor, we can refer to the new instance via `this`.
    // Let's remember the names we were given.
    this.firstName = fname;
    this.lastName = lname;

    // Now, the instance that is returned from `new Person(...)` will have
    // those properties on it.
}

// Let's give the Person prototype a function that returns the person's
// full name.
Person.prototype.getFullName = function() {

    return this.firstName + " " + this.lastName;
};

// Okay, let's see `Person` in action:
var p = new Person("John", "Doe");
console.log(p.firstName);     // "John" -- this is referencing the property we set in the constructor
console.log(p.getFullName()); // "John Doe" -- this calls the function we get from the prototype

// `p` has the `getFullName` function because it inherits it from the
// `Person.prototype` object.

// Let's see what happens if I try to output the instance itself:
console.log(p); // Most like you get "[object Object]" or similar -- not useful!

// In that sort of situation, JavaScript will use a function called `toString`
// to get a string equivalent of the instance. (It's more complicated than that,
// but you don't want me to go into the details here.) So let's give
// `Person.prototype` a `toString` function that does something useful:
Person.prototype.toString = function() {

    return this.getFullName();
};
// Note there that we're using `this` again. When a function is called through
// an object property (e.g., `p.toString()`), within the function call `this`
// refers to the object instance. `this` is an important and flexible concept
// in JavaScript and very much unlike its counterpart in (say) Java or C++,
// even though in simple situations (like this) it looks similar.

// Now let's try it:
console.log(p); // "John Doe", because the interpreter implicitly calls `toString` for you

// "Hey, wait a minute!" I hear you saying, "You didn't make a new `p`! How did it
// get the new function?!" The answer is it got it the same way it got `getFullName`:
// from `Person.prototype`. The `p` instance *refers* to the `Person.prototype`, it
// doesn't have a *copy* of it. So changes to `Person.prototype` show up in `p`
// (unless `p` overrides them, which we aren't doing in this example).

(该示例使用匿名函数，我是 not a fan of，但我不想在这里深入讨论命名函数。)

(OT:很挑剔，向你提出这个问题的人真的应该在一开始就声明 circle 变量:var circle; 另外，请注意 console.log 可能并不存在于所有 JavaScript 实现中——它最广为人知的是火狐+ Firebug 。)