js中的面向对象(一)封装
1.简单的封装(定义)
var cat1 = {};
cat1.name = '阿黄';
cat1.sex = '男';
cat1.age = 11;
//cat2也同样具有三个属性
var cat2 = {};
cat2.name = '小黑';
cat2.sex = '女';
cat2.age = '10';
把cat1和cat2看成是一个对象,ta们都具有三个属性。
缺点:一时如果有多个对象,写起来就比较麻烦,二是实例和原型之间没有任何联系;
2.原始模型封装(在1的基础上进行改进)
function Cat(name,sex,age){
return {
name:name,
sex:sex,
age:age
} }
var cat1 = Cat('小黄','男','11');
var cat2 = Cat('小黑','女','10');
alert(cat1.name);
缺点:cat1和cat2没有什么内在联系,不能反应他们是同一原型对象的实例
3.构造函数的封装
function Cat(name,age,sex){
this.name = name;
this.sex = sex;
this.age = age;
}
var cat1 = new Cat('小黄','男','11');
var cat2 = new Cat('小黑','女','10');
表面上是没有什么缺点,但是如以下代码
function Cat(name,age,sex){
this.name = name;
this.sex = sex;
this.age = age;
this.type = '猫科动物';
}
var cat1 = new Cat('小黄','男','11');
var cat2 = new Cat('小黑','女','10');
cat1和cat2都是属于猫科动物,但是在创建对象原型Cat的实例cat1和cat2时都会创建一次type属性;这样就会造成内存的浪费。
4.prototype模式
function Cat(name,sex,age){
this.name = name;
this.sex = sex;
this.age = age;
}
Cat.prototype.type = '猫科动物';
Cat.prototype.say = function (){alert("喵喵");};
var cat1 = new Cat();
alert(cat1.type);
原理:Javascript规定,每一个构造函数都有一个prototype
属性,指向另一个对象。这个对象的所有属性和方法,都会被构造函数的实例继承。
个人理解是将相同的属性“放在”一个内存之中,当创建cat1和cat2实例时,他们的属性都会指向同一个内存,从而不用重复创建。
prototype验证
1)isPrototypeOf
2)hasOwnProperty
3)in
本文参考
js中的面向对象(一)封装的更多相关文章
- 前端 ---JS中的面向对象
JS中的面向对象 创建对象的几种常用方式 1.使用Object或对象字面量创建对象 2.工厂模式创建对象 3.构造函数模式创建对象 4.原型模式创建对象 1.使用Object或对象字面量创建对象 ...
- python 全栈开发,Day52(关于DOM操作的相关案例,JS中的面向对象,定时器,BOM,client、offset、scroll系列)
昨日作业讲解: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉, ...
- 前端JavaScript(3)-关于DOM操作的相关案例,JS中的面向对象、定时器、BOM、位置信息
小例子: 京东购物车 京东购物车效果: 实现原理: 用2个盒子,就可以完整效果. 先让上面的小盒子向下移动1px,此时就出现了压盖效果.小盒子设置z-index压盖大盒子,将小盒子的下边框去掉,就可以 ...
- Day046--JavaScript-- DOM操作, js中的面向对象, 定时
一. DOM的操作(创建,追加,删除) parentNode 获取父级标签 nextElementSibling 获取下一个兄弟节点 children 获取所有的子标签 <!DOCTYPEhtm ...
- 《JS中的面向对象技术》
内容要点: 1.什么是对象:JS权威指南学习总结-第六章 ,(有句话:一切都是对象) 2.什么面向对象 使用对象时,只关注对象提供的功能,不关注其内部细节,比如jQuery.面向对象是一种通用思想,并 ...
- js中的面向对象入门
什么是对象 我们先来看高程三中是如何对对象进行定义的 "无序属性的集合,其属性可以包括基本值.对象或者函数",对象是一组没有特定顺序的的值.对象的没个属性或方法都有一个俄名字,每个 ...
- JS中OOP之模拟封装和继承和this指向详解
大家好,今天我带大家学习一下js的OOP, 大家都知道,面向对象有三个基本特征,继承,封装和多态,面向对象的语言有那么几种,C++,PHP,JAVA等,而功能强大的JS可以模拟实现面向对象的两大特征, ...
- 深入解读 Js 中的面向对象编程
前言:今天看了一篇文章觉得很不错,所以给大家分享一下,也许很多人都看过面向对象编程甚至写过这样博客,觉得面向对象编程就那样,没啥好说的,那可能是因为你对这方面知识已经了解,可以选择性跳过.那如果有更通 ...
- js中的面向对象程序设计
面向对象的语言有一个标志,即拥有类的概念,抽象实例对象的公共属性与方法,基于类可以创建任意多个实例对象,一般具有封装.继承.多态的特性!但JS中对象与纯面向对象语言中的对象是不同的,ECMA标准定义J ...
- js中的面向对象--类似于类的概念
创建对象的几种常用方式 1.使用Object或对象字面量创建对象 2.工厂模式创建对象 3.构造函数模式创建对象 4.原型模式创建对象 1.使用Object或对象字面量创建对象 使用object va ...
随机推荐
- Architecture:话说科学家/工程师/设计师/商人
从使命.目的.行为的不同,可以归类人群到科学家.工程师.设计师.商人等等.使命分别是:1.携带当下社会的财富对未来探索,希望引发变革:2.掌握工程全貌.完成整个工程的圣经周期:3.在工程的设计层面做文 ...
- css3基础篇三
CSS3 文本阴影 在 CSS3 中,text-shadow 可向文本应用阴影. 您能够规定水平阴影.垂直阴影.模糊距离,以及阴影的颜色: 实例 向标题添加阴影: h1 { text-shadow: ...
- php多进程防止出现僵尸进程
对于用PHP进行多进程并发编程,不可避免要遇到僵尸进程的问题. 僵尸进程是指的父进程已经退出,而该进程dead之后没有进程接受,就成为僵尸进程(zombie)进程.任何进程在退出前(使用exit退出) ...
- [转载]查看Linux系统硬件信息实例详解
linux查看系统的硬件信息,并不像windows那么直观,这里我罗列了查看系统信息的实用命令,并做了分类,实例解说. cpu lscpu命令,查看的是cpu的统计信息. blue@blue-pc:~ ...
- [bzoj4477 Jsoi2015]字符串树 (可持久化trie)
传送门 Solution 复习下tire( ̄▽ ̄)/ 裸的可持久化tire,我用树剖求了下LCA Code #include <cstdio> #include <cstring&g ...
- [cf 1015f] Bracket Substring (dp+kmp)
传送门 Solution 设dp方程dp[now][pos][red][fla]表示还有now个位置,pos表示匹配到第几位,red表示左括号数-右括号数,fla表示是否已经是给定串的字串 暴力转移即 ...
- noip模板复习
自己敲模板还是有很多容易错的地方 写在注释里面了 LCA #include<bits/stdc++.h> #define REP(i, a, b) for(register int i = ...
- 【codeforces 793D】Presents in Bankopolis
[题目链接]:http://codeforces.com/contest/793/problem/D [题意] 给你n个点, 这n个点 从左到右1..n依序排; 然后给你m条有向边; 然后让你从中选出 ...
- netty使用MessageToByteEncoder 自定义协议(四)
开发应用程序与应用程序之间的通信,程序之前通信 需要定义协议,比如http协议. 首先我们定义一个协议类 package com.liqiang.SimpeEcode; import java.sql ...
- WordPress 在Ubuntu下安装插件、主题输入FTP及无法创建目录的问题
1.安装新主题.插件需要输入FTP的账户密码 如果不想输入的话可以使用在wp-config.php文件中添加脚本方式. define("FS_METHOD","direc ...