Javascript writable特性介绍

 更新时间:2015年02月27日 11:21:33   作者:huangxincheng  
这篇文章主要介绍了Javascript writable特性介绍,本文用浅显易懂的语言讲解了writable的特性,需要的朋友可以参考下

  说起js中的那些特性标记,总觉得有些怪怪的,那为什么要说到这个attribute,起源于对一个问题的疑问,我们都知道window对象其实就是

浏览器窗口的一个实例,既然是一个实例,那这个实例就应该有“属性”和“方法“,比如下面这样:

我们平时都在使用function的时候,都会定义一些属性,比如name,age等等,并且还可以对他们进行delete,set和update操作。

那么下面问题来了,既然我的person对象的name都可以动态修改,按照这个道理的话,我也应该可以修改window下的undefined值,然后就非常感兴趣的想看一看。

结果还是可想而知,我并没有成功修改undefined的值,那为什么会这样呢?没有道理呀,它又不是上一篇所说的包装类型,但我们不得不尊重结果,这就说明js底层肯定是做了些什么才会导致这样的结果,其实在底层js默认用了Writable=false标记才让undefined属性不可写入,下面具体看看。

 

一:[Writable]特性

  说到属性是否可写,也许你会联想到C#中的get/set访问器,又或者是readonly关键字,下面你肯定会感兴趣我应该怎么做到属性的只读操作。在js中你只要使用defineProperty方法就可以了。

 从上面的例子中可以看到三点好玩的东西:

<1>:  我使用了defineProperty方法将person.name变成了只读字段,那有人要说了,这明明是方法,怎么会是特性,特性在我的思维里面就是

         【xxx】模式,所以这就是js的不同之处,毕竟js没有语法糖,所以定义特性只能是通过底层公开的方法来定义,也就是defineProperty。

 

<2>:  我在方法中不仅看到了writable,还有一个configurable,那这个是干什么的?其实这个就是基础配置,告诉js引擎是否可以delete,update属性,当我把configurable设为false的时候,你就不可以delete p.Name了,因为这会是一个无效操作。  

     

看完了这些我觉的你应该明白了,为什么undifined不能delete和update了。都是标记做的怪,是不是觉得很有意思?

<3>: 下一个值得思考的问题就是js引擎到底是怎么做到的,在C#里面也是有Atrribute,并且这个Atrribute被编译器编译后会记录到元数据中,然后你就可以放心大胆的使用反射来获取你的Atrribute中的任何值,比如说Serializable序列化类,它就是告诉SerializableFormat怎么去反射读取类,哪些字段可以序列化,哪些不可以,不可以的你需要用NonSerialized标记。

复制代码 代码如下:

 [Serializable]
     public class Test
     {
         [NonSerialized]
         public string Name;
    }

从图中可以看到IL中已经记录了Name为notserialized特性了,我们知道js中并没有反射,所以突破口自然就在defineProperty方法里面,但是比较遗憾,我们看不到这个方法底层的源码到底是怎么样的,所以就不知道它对Name这个字段到底做了什么才可以动态的导致它不可写,只能根据理解去猜测js引擎可能会发生的行为。

相关文章

  • 一文解决前端JS小数运算精度问题

    一文解决前端JS小数运算精度问题

    在做项目的时候,前端需要在表格的底部做一个汇总的功能,在采用reduce对当前属性所有值汇总时,发现汇总结果存在好长的小数位,本文给大家介绍了如何解决前端JS小数运算精度问题,需要的朋友可以参考下
    2024-02-02
  • 用javascript实现模拟火焰

    用javascript实现模拟火焰

    用javascript实现模拟火焰...
    2007-10-10
  • HTML页面滚动时获取离页面顶部的距离2种实现方法

    HTML页面滚动时获取离页面顶部的距离2种实现方法

    获取离滚动页面的顶部距离有两种方法一是DOM;而是jquery,具体的实现如下,感兴趣的朋友可以尝试操作下
    2013-09-09
  • 浅析JavaScript中的变量提升

    浅析JavaScript中的变量提升

    这篇文章主要介绍了浅析JavaScript中的变量提升,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下
    2022-06-06
  • Javascript中的arguments与重载介绍

    Javascript中的arguments与重载介绍

    这篇文章主要介绍了Javascript中的arguments与重载介绍,本文讲解了Javscript 重载、Javascript arguments不是一个数组等内容,需要的朋友可以参考下
    2015-03-03
  • 很棒的js Tab选项卡切换效果

    很棒的js Tab选项卡切换效果

    这篇文章主要介绍了很棒的js Tab选项卡切换效果,简单的选项卡切换特效,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-08-08
  • javascript实现简易计算器功能

    javascript实现简易计算器功能

    这篇文章主要为大家详细介绍了javascript实现简易计算器功能,实现四则运算,小数点,回退,归0等功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-09-09
  • TypeScript之元组、数组及as const的使用

    TypeScript之元组、数组及as const的使用

    TypeScript中的元组、数组和as const关键字对于类型安全性和代码可读性非常重要,本文主要介绍了TypeScript之元组、数组及as const的使用,感兴趣的可以了解一下
    2023-10-10
  • 基于原生JS封装的Modal对话框插件的示例代码

    基于原生JS封装的Modal对话框插件的示例代码

    这篇文章主要介绍了基于原生JS封装的Modal对话框插件的示例代码,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2020-09-09
  • JavaScript实现时钟滴答声效果

    JavaScript实现时钟滴答声效果

    本文给大家分享一段js实例代码实现时钟滴答声效果,效果逼真,非常不错,具有参考借鉴价值,需要的朋友参考下吧
    2017-01-01

最新评论