这在 javascript 中没有按预期填充数据答案

【问题标题】：this in javascript not populating data as expected这在 javascript 中没有按预期填充数据
【发布时间】：2013-03-15 17:17:46
【问题描述】：

我的代码 -

<script type="application/javascript">
var firstObject = {
sayHello : function(){
        document.write("My name is "+ this.myName +"<br>");
},
myName : "Swapnesh Sinha"
};
var secondObject = {myName : "Sanjay Sinha"};

document.write("First one " + firstObject.sayHello() );
document.write("<br>");
document.write("Second one "+ secondObject.myName); 
</script>

来源 - http://learn.jquery.com/javascript-101/this-keyword/

期待输出 -

First one Swapnesh Sinha
Second one Sanjay Sinha

意外的输出（从我的感觉）-

My name is Swapnesh Sinha
First one undefined
Second one Sanjay Sinha

让我知道为什么它返回undefined 但是源提到返回名称？或者我这边弄错了什么

【问题讨论】：

你的 sayHello 函数不返回任何东西，它只是执行一个document.write()，因此默认返回undefined
在 sayHello 函数中用 return 替换 document.write()

标签： javascript oop dom object this

【解决方案1】：

在您的第一个document.write 中，您调用了一个函数，并要求将函数的返回值连接到字符串“First one”。

函数被评估，此时“我的名字是 Swapnesh Sinha”通过对象内部的document.write 调用输出。然而，该函数调用没有返回值，因此它是undefined，它被连接到“第一个”，然后被打印出来。

【讨论】：

换句话说，将sayHello中的document.write替换为return
澄清一下，该函数确实返回了一个未定义类型的值。

【解决方案2】：

这是工作小提琴：JsFIDDLE

作为大多数 jQuery 开发人员，这是您无法理解的：JavaScript 范围。

基本上，为了通过this 访问属性，它必须嵌套在Object.prototype 中。

更正

当您内联定义对象属性时，调用this 仍将指向正确的对象。然而，我给你的模式虽然不太流行，但却是一种更简洁、更好的方法。

prototype 是 JavaScript 的 OOP 方式。如果您正在寻找可靠的 OOP 风格的 JS 以及正确定义模型、提高代码可维护性和更好的编码风格，最好使用我给您的模式定义类，因为它可以让您在静态函数之间做出明显的区分和班级。这也是 JavaScript 的自然流程，一切都是对象。

在高级 JavaScript 编程（强大的 Ajax 应用程序或由于某种原因浏览器必须执行更高级计算的应用程序）中，始终首选以下样式。放置在命名空间下的静态函数仍然是单独定义的：

var namespace = {};
namespace.firstStaticFunc = function() {/*do stuff etc;*/};
namespace.secondStaticFunc = function() { return !1; };

您使用定义模式的唯一原因是枚举和哈希映射。例如：

var typesOfChicken = {
    RED: 'red',
    BLUE: 'blue'
};

上面的内容总是用于国际化和避免硬编码值之类的事情。此外，它可以帮助 JS 缩小器更好地工作。鉴于上述情况，您可以说：

console.log(typesOfChicken.RED);// will print red.
console.log("red");// wil still print red

但是，当我想将红色更改为其他内容时，使用枚举我只需要进行一次更改。此外，缩小器可以用 a.b 替换 typesOfChicken.RED，而 "RED" 将始终为“RED”。这是不可缩小的。

var firstObject = function() { };
firstObject.prototype.myName = "Swapnesh Sinha";//this will not be nested as an instance property.
firstObject.prototype.sayHello = function() {
    alert(this.myName);// will now correctly display Swapnesh Sinha
};
// to use your first object.
var instance = new firstObject();
instance.sayHello();

要正确利用作用域，请使用我给你的模式，这是一种面向对象的模式，也是在 JS 中定义类的正确方法。

现在你有一个很好的方式来组织你的 JavaScript 代码，它更容易维护，范围更明显，最重要的是你可以立即区分静态函数和类。

【讨论】：

呃，这不正确。正如其他人所建议的那样，他唯一的问题是不了解 return 和 document.write() 的工作原理。你完全错了。你不需要把东西放在原型上就可以在函数调用内部使用this 指的是调用函数的对象（例如firstObject）。你根本不需要原型。
但你确实在说不正确的事情。你在骗他。你的答案是错误的。
这句话是错误的：“在你的例子中，你正在做一个简单的赋值，所以在你的 sayHello 函数中，这实际上是指向窗口对象而不是 firstObject。”这是不真实的。在 sayHello 函数内部，this 指的是 firstObject。你可以从输出中看出这一点。

【解决方案3】：

在 sayHello 函数中用 return 替换 document.write()

【讨论】：