书读百遍其义自见

学习《JavaScript设计模式》一书时,前两个章节中的讲解的JavaScript基础知识,让我对属性和方法有了清晰的认识。如下是我的心得体会以及部分摘录的代码。

不同于大多数面向对象语言一样,JavaScript作为一种解释性的弱类型语言,通过自身的一些特性实现类的封装,从而实现面向对象的。面向对象编程的思想就是一些属性方法的隐藏和暴露,比如私有属性、私有方法、共有属性、共有方法等。既然JavaScript实现了面向对象,同样具有这些属性和方法。

JavaScript中包含:

  • 私有属性(私有方法)
  • 特权方法
  • 公有属性(公有方法)
  • 类静态共有公有属性(类静态公有方法)   注:对象不能访问
  • 共有属性(共有方法)
  • 静态私有属性(静态私有方法) 注:通过闭包可以实现

如下是代码实例:

 <!DOCTYPE html>
<html>
<head>
<title>属性与方法</title>
<meta charset="utf-8">
<script type="text/javascript">
var Book=function(id,name,price){
// 私有属性
var num=1;
var name,price;
// 私有方法
function checkId(){ }; // 特权方法
this.getName=function(){};
this.setName=function(){};
this.getPrice=function(){};
this.setPrice=function(){};
// 对象公有属性
this.id=id;
this.chapters=["章节1","章节2"];
// 对象公有方法
this.copy=function(){
console.log('公有方法,对象实例可访问');
};
//构造器
this.setName(name);
this.setPrice(price);
}
// 类静态公有属性(对象不能访问)
Book.isChinese=true;
// 类静态公有方法(对象不能访问)
Book.resetTime=function(){
console.log('new time');
} Book.prototype={
// 共有属性
isJSBook:false,
// 共有方法
display:function(){}
} var b1=new Book(1,'爱的教育',20);
console.log(b1.num); //undefined 对象实例无法访问私有属性
console.log(b1.id); //1 对象实例可访问公有属性
console.log(b1.isJSBook); //false 对象实例可访问共有属性
console.log(b1.isChinese); //undefined 对象实例无法访问类静态公有属性
console.log(Book.isChinese); //true 类直接访问类静态公有属性
console.log(b1.chapters); //["章节1","章节2"] 对象实例可访问公有属性 //以下验证公有属性各个对象实例之间互不影响
var b2=new Book(2,'茶花女',30);
console.log(b2.id); //
console.log(b2.chapters); //["章节1","章节2"]
b2.chapters.push("章节3");
console.log(b2.chapters); //["章节1","章节2","章节3"]
console.log(b1.chapters); //["章节1","章节2"]
</script>
</head>
<body>
</body>
</html>

通过闭包实现类的静态私有变量和静态私有方法:

 <!DOCTYPE html>
<html>
<head>
<title>属性与方法</title>
<meta charset="utf-8">
<script type="text/javascript">
var Book=(function(){
// 静态私有属性
var isChinese=true;
// 静态私有方法
var resetTime=function(){
console.log('new time');
} function _book(id,name,price){
// 私有属性
var num=1;
var name,price;
// 私有方法
function checkId(){
}; // 特权方法
this.getName=function(){};
this.setName=function(){};
this.getPrice=function(){};
this.setPrice=function(){};
// 对象公有属性
this.id=id;
this.chapters=["章节1","章节2"];
// 对象公有方法
this.copy=function(){
console.log('公有方法,对象实例可访问');
};
//构造器
this.setName(name);
this.setPrice(price);
} //构建原型
_book.prototype={
isJSBook:false,
// 共有方法
display:function(){}
} //返回类
return _book;
})(); var b1=new Book(1,'爱的教育',20);
console.log(b1.num); //undefined 对象实例无法访问私有属性
console.log(b1.id); //1 对象实例可访问公有属性
console.log(b1.isJSBook); //false 对象实例可访问共有属性
console.log(b1.isChinese); //undefined 对象实例无法访问类静态私有属性
console.log(b1.chapters); //["章节1","章节2"] 对象实例可访问公有属性 //以下验证公有属性各个对象实例之间互不影响
var b2=new Book(2,'茶花女',30);
console.log(b2.id); //
console.log(b2.chapters); //["章节1","章节2"]
b2.chapters.push("章节3");
console.log(b2.chapters); //["章节1","章节2","章节3"]
console.log(b1.chapters); //["章节1","章节2"]
</script>
</head>
<body>
</body>
</html>

JavaScript中的方法和属性的更多相关文章

  1. 全面理解Javascript中Function对象的属性和方法

    http://www.cnblogs.com/liontone/p/3970420.html 函数是 JavaScript 中的基本数据类型,在函数这个对象上定义了一些属性和方法,下面我们逐一来介绍这 ...

  2. JavaScript中的可枚举属性与不可枚举属性

    在JavaScript中,对象的属性分为可枚举和不可枚举之分,它们是由属性的enumerable值决定的.可枚举性决定了这个属性能否被for…in查找遍历到. 一.怎么判断属性是否可枚举 js中基本包 ...

  3. JavaScript中reduce()方法

    原文  http://aotu.io/notes/2016/04/15/2016-04-14-js-reduce/   JavaScript中reduce()方法不完全指南 reduce() 方法接收 ...

  4. JavaScript中的方法、方法引用和参数

    首先,我们来看一段代码,如果觉得不甚明白的,则本文会对你有益: var player = function (e) {             return (function f(m) {      ...

  5. 详解 JavaScript 中 splice() 方法

    splice() 方法是一个比较少用的方法,但是功能确实很好,并且在我们 coding 的时候,经常有需要 splice() 方法,先介绍一下该方法. 在 JavaScript 中 splice() ...

  6. JavaScript中的方法

    JavaScript中的方法 在JavaScript中,可以通过对象来调用对应的方法.在JavaScript中,有三个重要的window对象方法:用于显示警告信息的alert.用于显示确认信息的con ...

  7. JavaScript中Array方法总览

    title: JavaScript中Array方法总览 toc: true date: 2018-10-13 12:48:14 push(x) 将x添加到数组最后,可添加多个值,返回数组长度.改变原数 ...

  8. javascript中对象访问自身属性的方式

    在javascript中,通过对象的方法访问对象自身属性时,必须采用this.fieldName的方式. 原因是javascript中Function是无状态的,访问对象的属性时,必须指定当前的上下文 ...

  9. JavaScript中trim 方法实现

    Java中的 String 类有个trim() 能够删除字符串前后的空格字符.jQuery中也有trim()方法能够删除字符变量前后的字符串. 可是JavaScript中却没有对应的trim() 方法 ...

随机推荐

  1. bzoj4408 [Fjoi 2016]神秘数 & bzoj4299 Codechef FRBSUM 主席树+二分+贪心

    题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=4299 https://lydsy.com/JudgeOnline/problem.php?id ...

  2. 06.队列、python标准库中的双端队列、迷宫问题

    class QueueUnderflow(ValueError): """队列为空""" pass class SQueue: def __ ...

  3. ES集群health为yellow解决办法

    原创转载请注明出处:https://www.cnblogs.com/agilestyle/p/11766147.html Logstash导入数据后,Cerebro显示集群health的状态为yell ...

  4. JDBC连接Hive数据库

    一.依赖 pom <properties> <project.build.sourceEncoding>UTF-8</project.build.sourceEncodi ...

  5. ht-5 treemap特性

    (1)TreeMap类通过使用红黑树实现Map接口 (2)TreeMap提供按排序顺序存储键值对的有效手段,同时允许快速检索 (3)不同于散列映射,树映射保证它的元素按键的自然顺序升序排列 (4)Tr ...

  6. URL跳转漏洞

    URL跳转原理: 由于越来越多的需要和其他第三方应用交互,以及在自身应用内部根据不同的逻辑将用户引向到不同的页面,譬如一个典型的登录接口就经常需要在认证成功之后将用户引导到登录之前的页面,整个过程中如 ...

  7. 初步学习jQuery之事件

    事件 页面加载 在DOM中提供了load事件用于页面加载完毕之后执行机制,jQuery提供了ready()方法实现相似的功能,但是存在以下的区别.1.DOM中的load事件没有任何的简写形式,但是在j ...

  8. scau 17967 大师姐唱K的固有结界

    17967 大师姐唱K的固有结界 该题有题解 时间限制:1000MS  内存限制:65535K 提交次数:41 通过次数:8 收入:107 题型: 编程题   语言: G++;GCC;VC Descr ...

  9. ruby的require路径问题

    ruby1.9删除当前目录功能,require "Action.rb"不行. 用下面2种方式: require_relative "trig.rb" .rb可以 ...

  10. Java常用工具——java多线程

    一.线程的创建 方式一:继承Thread类,重写run()方法 package com.imooc.thread1; class MyThread extends Thread{ public MyT ...