Question

查看此代码。这是一个非常简单的JavaScript对象，使用Module Pattern实现（您可以在this fiddle address查看实时示例）

var human = function() {
    var _firstName = '';
    var _lastName = ''
    return {
        get firstName() {
            return _firstName;
        }, get lastName() {
            return _lastName;
        }, set firstName(name) {
            _firstName = name;
        }, set lastName(name) {
            _lastName = name;
        }, get fullName() {
            return _firstName + ' ' + _lastName;
        }
    }
}();
human.firstName = 'Saeed';
human.lastName = 'Neamati';
alert(human.fullName);

但是，IE8不支持JavaScript get和set关键字。您可以对其进行测试并查看MDN。

如何使此脚本与IE8兼容？

Answer 1

如何使此脚本与IE8兼容？

完全改变它。例如，不使用访问器属性，而是使用常规属性和函数的组合：

human.firstName = 'Saeed';
human.lastName  = 'Neamati';
alert(human.getFullName());

其他人建议在IE中使用DOM对象并使用Object.defineProperty()添加属性。虽然它可能有用，但我强烈建议不要使用这种方法，原因有几个，例如你编写的代码可能在所有浏览器中都不兼容：

var human = document.createElement('div');
Object.defineProperty(human, 'firstName', { ... });
Object.defineProperty(human, 'lastName',  { ... });
Object.defineProperty(human, 'children',  { value: 2 });

alert(human.children);
//-> "[object HTMLCollection]", not 2

至少Chrome确实如此。无论哪种方式，编写适用于您想要支持的所有浏览器的代码都更安全，更容易。您编写代码以利用getter和setter所获得的任何便利都会因您专门针对Internet Explorer 8编写的额外代码而丢失。

当然，除了性能降低之外，您还无法在对象上使用for...in循环以及使用您认为属性时可能出现的混乱已定义但已预先存在于DOM对象上。

Answer 2

你不能（ as Andy answered ）

最接近的选择是

var human = function() {
    var _firstName = '';
    var _lastName = '';

    return {
        firstName: function() {
            if (arguments.length === 1) {
                _firstName = arguments[0];
            }
            else {
                return _firstName;
            }
        },
        lastName: function() {
            if (arguments.length === 1) {
                _lastName = arguments[0];
            }
            else {
                return _lastName;
            }
        },
        fullName: function() {
            return _firstName + ' ' + _lastName;
        }
    };
}();

human.firstName('Saeed');
human.lastName('Neamati');

alert(human.fullName());

http://jsfiddle.net/gaby/WYjqB/2/

演示

Answer 3

IE8支持DOM节点上的getter和setter，所以如果你真的想拥有getter和setter，你可以这样做：

var objectForIe8 = $("<div></div>")[0];    
Object.defineProperty(objectForIe8, "querySelector", {
    get: function() {
        return this.name;
    },
    set: function(val) {
        this.name = val+", buddy";  
    }
});
// notice you can overwrite dom properties when you want to use that property name
objectForIe8.querySelector = "I'm not your guy"; 

alert(objectForIe8.querySelector);

请注意，这会给您带来一些重要的性能影响，因此如果您需要创建数千个此类对象，我将不会使用此技术。但如果你不担心这个特定物体的表现，它会让你感到震惊。如果你不关心ie8性能，并且只是想让它工作，那么只使用ie8这种技术，你就是金色的：）

Answer 4

在http://robertnyman.com/2009/05/28/getters-and-setters-with-javascript-code-samples-and-demos/

上查看

扩展对象的未来和ECMAScript标准化方法各种方法都是通过Object.defineProperty。这是怎么回事 Internet Explorer选择实现getter和setter，但确实如此不幸的是到目前为止只能在Internet Explorer 8中使用，而不是在任何其他网络浏览器。此外，IE 8仅在DOM节点上支持它，但是未来版本计划在JavaScript对象上支持它好。

您可以在http://robertnyman.com/javascript/javascript-getters-setters.html#object-defineproperty

的同一网站上找到测试用例

Object.defineProperty(document.body, "description", {
    get : function () {
        return this.desc;
    },
    set : function (val) {
        this.desc = val;
    }
});
document.body.description = "Content container";

结果：

document.body.description = "Content container"

IE8中的JavaScript getter支持

4 个答案: