浅谈javascript面向对象程序设计


Posted in Javascript onJanuary 21, 2015

ECMA-262把对象定义为:“无序属性的 集合,其属性可以包含基本值、对象或者函数”

理解对象,最简单的方式就是通过创建一个Object的实例,然后为它添加属性和方法

        var person = new Object();

        person.name = "Xulei";

        person.age = "23";

        person.job = "前端工程师";

        person.sayName = function () {

            alert(this.name);

        }

还可以这样写

        var person = {

            name: "xulei",

            age: 23,

            job: "前端工程",

            sayName: function () {

                alert(this.name)

            }

        }

一、属性类型:数据属性和访问其属性

        1、数据属性,有4个描述其行为的特性
        [Configurable]:表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性,默认值为true
        [Enumerable]:表示能否通过for-in返回属性,默认值为true
        [Writable]:表示能否修改属性,默认值为true
        [Value]:包含这个属性的数据值。默认值为undefined

        var person = {

            name: "xulei"

        }

        这里创建了一个person对象,value值就是“xulei”

要修改属性的默认特性,必须使用ECMAScript5的Object.defineProperty(属性所在的对象,属性的名字,描述符对象)
描述符对象必须是configurable、enumerable、writable、value

        var peron = {}

        Object.defineProperty(peron, "name", {

            writable: false,//属性不能被修改

            value: "徐磊-xulei"

        });
        alert(peron.name);//徐磊-xulei

        peron.name = "徐磊";

        alert(peron.name);//徐磊-xulei

        以上操作在非严格模式下赋值操作会被忽略,如果在严格模式下会抛出异常
        一旦把属性定义为不可配置的就不能把它变回可配置的了。
        在多数情况下都没有必要利用Object.defineProperty()方法提供的这些高级功能。但是对理解javascript非常有用。
        建议读者不要在ie8上使用此方法。

        2、访问其属性,有4个特性
        [Configurable]:表示能否通过delete删除属性从而重新定义属性,能否修改属性的特性,或者能否把属性修改为访问器属性,默认值为true
        [Enumerable]:表示能否通过for-in返回属性,默认值为true
        [Get]:在读取时调用的函数
        [Set]:在写入属性时调用的函数

Javascript 相关文章推荐
javascript 简单高效判断数据类型 系列函数 By shawl.qiu
Mar 06 Javascript
如何确保JavaScript的执行顺序 之jQuery.html深度分析
Mar 03 Javascript
如何让easyui gridview 宽度自适应窗口改变及fitColumns应用
Jan 25 Javascript
JavaScript中调用函数的4种方式代码实例
Jul 08 Javascript
JavaScript的removeChild()函数用法详解
Dec 27 Javascript
jquery插件bootstrapValidator数据验证详解
Nov 09 Javascript
解决vue router组件状态刷新消失的问题
Aug 01 Javascript
30分钟精通React今年最劲爆的新特性——React Hooks
Mar 11 Javascript
原生js实现each方法实例代码详解
May 27 Javascript
一文了解vue-router之hash模式和history模式
May 31 Javascript
webpack的 rquire.context用法实现工程自动化的方法
Feb 07 Javascript
nuxt 自定义 auth 中间件实现令牌的持久化操作
Nov 05 Javascript
html的DOM中Event对象onabort事件用法实例
Jan 21 #Javascript
封装好的一个万能检测表单的方法
Jan 21 #Javascript
html的DOM中Event对象onblur事件用法实例
Jan 21 #Javascript
JS简单计算器实例
Jan 20 #Javascript
jQuery元素的隐藏与显示实例
Jan 20 #Javascript
DOM基础教程之使用DOM设置文本框
Jan 20 #Javascript
DOM基础教程之使用DOM控制表单
Jan 20 #Javascript
You might like
PHP n个不重复的随机数生成代码
2009/06/23 PHP
对比分析php中Cookie与Session的异同
2016/02/19 PHP
PHP实现微信对账单处理
2018/10/01 PHP
pjblog修改技巧汇总
2007/03/12 Javascript
关于jquery append() html时的小问题的解决方法
2010/12/16 Javascript
无阻塞加载脚本分析[全]
2011/01/20 Javascript
理解JSON:3分钟课程
2011/10/28 Javascript
js 取时间差去掉周六周日实现代码
2012/12/25 Javascript
深入解析JavaScript中的变量作用域
2013/12/06 Javascript
JavaScript常用脚本汇总(二)
2015/03/04 Javascript
js贪吃蛇网页版游戏特效代码分享(挑战十关)
2015/08/24 Javascript
浅谈javascript的Touch事件
2015/09/27 Javascript
BooStrap对导航条的改造实践小结
2016/09/21 Javascript
JS实现动态给标签控件添加事件的方法示例
2017/05/13 Javascript
基于EasyUI的基础之上实现树形功能菜单
2017/06/28 Javascript
彻底解决 webpack 打包文件体积过大问题
2017/07/07 Javascript
jquery操作checkbox的常用方法总结【附测试源码下载】
2019/06/10 jQuery
微信小程序实现渐入渐出动画效果
2019/06/13 Javascript
解决Idea、WebStorm下使用Vue cli脚手架项目无法使用Webpack别名的问题
2019/10/11 Javascript
vue created钩子函数与mounted钩子函数的用法区别
2020/11/05 Javascript
[55:04]海涛DOTA2死魂复燃6.82版本介绍
2014/09/28 DOTA
Python语言技巧之三元运算符使用介绍
2013/03/04 Python
Python3 串口接收与发送16进制数据包的实例
2019/06/12 Python
python datetime中strptime用法详解
2019/08/29 Python
python 实现绘制整齐的表格
2019/11/18 Python
python异常处理try except过程解析
2020/02/03 Python
Python3 中sorted() 函数的用法
2020/03/24 Python
使用Tensorflow-GPU禁用GPU设置(CPU与GPU速度对比)
2020/06/30 Python
三只松鼠官方旗舰店:全网坚果销售第1
2017/11/25 全球购物
分家协议书
2014/04/21 职场文书
作文评语集锦大全
2014/04/23 职场文书
政风行风评议整改方案
2014/09/15 职场文书
典型事迹材料范文
2014/12/29 职场文书
幼儿园小班工作总结2015
2015/04/25 职场文书
2016年感恩教师节活动总结
2016/04/01 职场文书
如何创建一个创建MySQL数据库中的datetime类型
2022/03/21 MySQL