Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/381.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
只读属性可以在纯JavaScript中实现吗?_Javascript_Browser - Fatal编程技术网

只读属性可以在纯JavaScript中实现吗?

只读属性可以在纯JavaScript中实现吗?,javascript,browser,Javascript,Browser,查看正则表达式示例(标题为“使用匹配结果创建数组”),我们有如下语句: input:一个只读属性,反映正则表达式所匹配的原始字符串 索引:一个只读属性,它是字符串中匹配项的从零开始的索引 等等。。。是否可以在JavaScript中创建自己的对象,该对象将具有只读属性,或者这是为特定浏览器实现的内置类型保留的特权?可以在JavaScript中创建只读属性,这些属性可以通过getter方法获得。这通常称为“模块”模式 YUI博客对此有很好的描述: 文章片段: YAHOO.myProject.myMo

查看正则表达式示例(标题为“使用匹配结果创建数组”),我们有如下语句:

input:一个只读属性,反映正则表达式所匹配的原始字符串

索引:一个只读属性,它是字符串中匹配项的从零开始的索引


等等。。。是否可以在JavaScript中创建自己的对象,该对象将具有只读属性,或者这是为特定浏览器实现的内置类型保留的特权?

可以在JavaScript中创建只读属性,这些属性可以通过getter方法获得。这通常称为“模块”模式

YUI博客对此有很好的描述:

文章片段:

YAHOO.myProject.myModule = function () {

//"private" variables:
var myPrivateVar = "I can be accessed only from within YAHOO.myProject.myModule.";

//"private" method:
var myPrivateMethod = function () {
    YAHOO.log("I can be accessed only from within YAHOO.myProject.myModule");
}

return  {
    myPublicProperty: "I'm accessible as YAHOO.myProject.myModule.myPublicProperty."
    myPublicMethod: function () {
        YAHOO.log("I'm accessible as YAHOO.myProject.myModule.myPublicMethod.");

        //Within myProject, I can access "private" vars and methods:
        YAHOO.log(myPrivateVar);
        YAHOO.log(myPrivateMethod());

        //The native scope of myPublicMethod is myProject; we can
        //access public members using "this":
        YAHOO.log(this.myPublicProperty);
    }
};

}(); // the parens here cause the anonymous function to execute and return

Edit:自编写此答案以来,EcmaScript 5标准化了一种使用
Object.defineProperty
更好的新方法,并支持更新的浏览器。看见如果需要支持“较旧”的浏览器,可以使用此答案中的一种方法作为后备方法


在Firefox、Opera 9.5+、Safari 3+、Chrome和IE(通过v11测试)中,您可以定义getter和setter属性。如果只定义一个getter,它将有效地创建一个只读属性。您可以在对象文本中或通过调用对象上的方法来定义它们

var myObject = {
    get readOnlyProperty() { return 42; }
};

alert(myObject.readOnlyProperty); // 42
myObject.readOnlyProperty = 5;    // Assignment is allowed, but doesn't do anything
alert(myObject.readOnlyProperty); // 42
如果您已经有一个对象,可以调用
\uuuu defineGetter\uuu
\uu defineGetter\uuu

var myObject = {};
myObject.__defineGetter__("readOnlyProperty", function() { return 42; });
当然,这在web上不是很有用,因为它在Internet Explorer中不起作用


您可以从或中阅读更多关于它的信息。

这里有一个指向Douglas Crockford“Javascript中的私有成员”页面的链接……在我看来,如果只提供getter方法,而不提供setter,这些将是只读的:

使用,您可以使用Object.defineProperty定义只读属性。在松散模式下,解释器将忽略对属性的写入,在严格模式下,解释器将抛出异常

示例来自:

var obj={};
Object.defineProperty(obj,“”{
值:“”,
可写:false,
可枚举:正确,
可配置:true
});
提供了一种声明只读属性的方法。在后台,它声明了一个私有字段,并为其公开getter/setter函数。根据便利性和具体目标,bob.js提供了多种方法来完成同样的事情。下面是一种使用
属性的面向对象实例的方法(其他方法允许在对象本身上定义setter/getter):


最后,未定义
p.name.set\u value
,因为它是只读属性。

此处为只读属性或变量

<script>
Object.defineProperties(window, {
  "selector": { value: 'window', writable: false }
});

alert (window.selector);  // outputs window

selector ='ddd';          // testing because it belong to the global object
alert (window.selector);  // outputs window
alert (selector);         // outputs window

window.selector='abc';
alert (window.selector);   // outputs window
alert (selector);          // outputs window
</script>
顺便说一句,这是一段简短的测试代码,非常有用,因为JQuery假装不赞成选择器属性

<script>
Object.defineProperties(window, {
  "selector": { value: 'window', writable: false }
});

alert (window.selector);  // outputs window

selector ='ddd';          // testing because it belong to the global object
alert (window.selector);  // outputs window
alert (selector);         // outputs window

window.selector='abc';
alert (window.selector);   // outputs window
alert (selector);          // outputs window
</script>

对象。定义属性(窗口{
“选择器”:{value:'window',可写:false}
});
警报(窗口选择器);//输出窗口
选择器='ddd';//测试,因为它属于全局对象
警报(窗口选择器);//输出窗口
警报(选择器);//输出窗口
window.selector='abc';
警报(窗口选择器);//输出窗口
警报(选择器);//输出窗口

因此,您已经测试了一个只读属性或变量。

您将看到我为颜色定义了setter和getter,因此可以对其进行修改。另一方面,一旦定义了对象,品牌就变成只读的。我相信这就是你一直在寻找的功能

        function Car(brand, color) {
            brand = brand || 'Porche'; // Private variable - Not accessible directly and cannot be frozen
            color = color || 'Red'; // Private variable - Not accessible directly and cannot be frozen
            this.color = function() { return color; }; // Getter for color
            this.setColor = function(x) { color = x; }; // Setter for color
            this.brand = function() { return brand; }; // Getter for brand
            Object.freeze(this); // Makes your object's public methods and properties read-only
        }

        function w(str) {
            /*************************/
            /*choose a logging method*/
            /*************************/
            console.log(str);
            // document.write(str + "<br>");
        }

        var myCar = new Car;
        var myCar2 = new Car('BMW','White');
        var myCar3 = new Car('Mercedes', 'Black');

        w(myCar.brand()); // returns Porche
        w(myCar.color()); // returns Red

        w(myCar2.brand()); // returns BMW
        w(myCar2.color()); // returns White

        w(myCar3.brand()); // returns Mercedes
        w(myCar3.color()); // returns Black

        // This works even when the Object is frozen
        myCar.setColor('Green');
        w(myCar.color()); // returns Green

        // This will have no effect
        myCar.color = 'Purple';
        w(myCar.color()); // returns Green
        w(myCar.color); // returns the method

        // This following will not work as the object is frozen
        myCar.color = function (x) {
            alert(x);
        };

        myCar.setColor('Black');
        w(
            myCar.color(
                'This will not work. Object is frozen! The method has not been updated'
            )
        ); // returns Black since the method is unchanged

是的,我们可以在JavaScript中为对象设置只读属性。它可以通过私有变量和
object.defineProperty()
方法来实现

请参见下面的示例,该示例演示了具有只读属性的对象

function Employee(name,age){
    var _name = name;
    var _age = age;

    Object.defineProperty(this,'name',{
        get:function(){
            return _name;
        }
    })
}

var emp = new Employee('safeer',25);
console.log(emp.name); //return 'safeer'
emp.name='abc';
console.log(emp.name); //again return 'safeer', since name is read-only property

好的!我在Firefox、Opera和Chrome上进行了测试,但在IE上不起作用。另外一点需要注意的是,这是任何javascript规范的一部分吗?它不是当前规范的一部分。我相信它计划用于下一版本的ECMAScript,但现在,它只是一些其他浏览器支持的Mozilla扩展。IE仍然不支持它;)对于您的实用程序,IE自第9版起就支持此技术。这里有一个很好的兼容性表:我在这里问了一个类似的问题:如果一个人试图创建一个现有对象的完全不可变的副本(即具有深度只读/不可变属性的对象),这可能会有帮助:防止向对象添加新属性(尽管现有属性可以更改)并防止对对象进行所有更改。和都得到了很好的支持。我不敢相信这没有更多的选票。你知道它到底是怎么工作的吗?私有和只读是有区别的。私有变量(以及Crockford在JavaScript中实现它的方式)只是私有的,这意味着可以在类(构造函数)内部访问,但不能在外部公开,因此显然不能更改无法访问的内容。只读属性可能对外公开,但不会更改。是否真的有必要对五年半前的“仅链接”答案进行向下投票?目前的限制还没有到位。注意:这与IE9+兼容,所以是今天的+1。这个答案提示使用
Object.freeze()
。ECMAScript 5添加了
对象.seal
对象.freeze
方法。seal方法将阻止添加属性,但允许写入/编辑属性。
Object.freeze
方法将完全锁定对象,对象将保持冻结时的状态
          Porche
          Red
          BMW
          White
          Mercedes
          Black
          Green
          Green
          function () { return color; }
          Black
function Employee(name,age){
    var _name = name;
    var _age = age;

    Object.defineProperty(this,'name',{
        get:function(){
            return _name;
        }
    })
}

var emp = new Employee('safeer',25);
console.log(emp.name); //return 'safeer'
emp.name='abc';
console.log(emp.name); //again return 'safeer', since name is read-only property