前言:
眼前看官们对“js工厂模式 构造函数”都比较关怀,姐妹们都想要了解一些“js工厂模式 构造函数”的相关文章。那么小编也在网络上网罗了一些有关“js工厂模式 构造函数””的相关内容,希望朋友们能喜欢,大家快快来学习一下吧!作者:极客小俊
一个专注于web技术的80后
你不用拼过聪明人,你只需要拼过那些懒人 你就一定会超越大部分人!
什么是面向对象编程?
面向对象的英文全称:Object Oriented Programming , 简称OOP
首先我们要先了解面向过程的编程思想, 就是代码从上到下都没有封装的意思,某些代码裸露在外、没有模块化、代码杂乱无章的写法. 并且还不好维护,也不便于后期二次修改
面向对象的编程思想: 通俗地说就是要具备代码好维护、代码重用性高、耦合度低、高内聚、模块化、便于修改
名词解释:
高内聚: 指一个软件模块是由相关性很强的代码组成,只负责一项任务,也就是常说的单一责任原则。
低耦合: 指让每个模块尽可能地独立完成某个特定的子功能。
面向对象的主要特点:
抽象:抓住核心问题, 去掉相关性不强的代码, 把类似一样的功能性代码放在一起、[把这个功能所需要的相同功能代码抽取出来,然后进行封装]封装:只能通过对象来访问方法 [提高可维护性]继承:从已有对象上继承出新的对象 [提高代码重用性]多态:让同一个[接口] 被不同的对象所继承或者实现,从而产生不同的处理方式
js是一门基于对象的语言
js是一门解释型的语言
js是一门脚本语言、弱类型语言!
分析什么是对象?
对象:具有特征和行为或者说 有属性和方法, 具体特指的某一个事物
对象的组成
属性 就是变量 表示一个对象的状态 对象下面的变量就叫做:属性
方法 就是函数 表示一个对象的行为过程 对象下面的函数就叫做:方法
javascript创建对象的三种基本方式1.调用系统的构造函数创建对象
创建对象也叫实例化对象, Object是系统的构造函数
//语法 var 变量名 = new Object();
如何添加对象的属性和方法
添加属性: 如何添加属性?
var 变量名 = new Object(); 变量名.属性名=值;
添加方法: 如何添加方法?
var 变量名 = new Object(); 变量名.方法名=function(){ ..代码段... } 或 function 函数名(){ } 变量名.方法名=函数名;
案例:
var obj=new Object(); obj.name='张三'; obj.age=33; obj.city='重庆'; obj.say=function(){ alert('张三说话了!'); } console.log(obj);
这种创建方式的缺点是:
1.如果使用这种方式创建了多个对象、会产生对象不能分辨出到底属于哪一个类型!
2.每创建 一个对象都需要new Object() 一次 耗费内存空间、 不能一次性创建多个对象
小知识: 如何判断某一个对象引用变量是不是属于某一个类型?
语法: 对象引用变量名称 instanceof 类名称 返回true就是属于这个类 返回false不属于这种类型
this关键字的基本使用
在当前的对象方法中,可以使用this关键字代表当前对象
小知识: 访问对象属性和方法的另一种写法: 对象[“属性名”] 或 对象方法名
案例代码如下:
var obj2=new Object(); obj2.name='李四'; obj2.age=66; obj2.city='北京'; obj2.say=function(){ console.log('李四说话了'); console.log(this.name); } console.log(obj2["name"]); obj2["say"]();2.工厂方式与构造函数
工厂方式也可以叫做封装函数
优点: 代码复用性提升、不同的数据当做参数进行传递
自定义构造函数创建对象
了解一下如何一次性创建多个对象?
工厂方法 方法1: 首先把创建对象的系统构造对象相关代码封装在一个函数中,不同的数据当做参数进行传递,然后返回创建好的对象
案例代码如下:
function createObject(username,age){ var obj=new Object(); obj.name=username; obj.age=age; obj.city='重庆'; obj.say=function(){ console.log(this.name+'的年龄是:'+this.age); } return obj; } var obj1=createObject('张三',23); var obj2=createObject('李四',66); obj1.say(); obj2.say();
工厂方法 方法2:自定义构造函数创建对象, 自己定义一个构造函数,创建对象
优点: 可以区分出对象引用属于哪一类
案例代码如下
//Person就是构造函数 function Person(username,age,city){ this.name=username; this.age=age; this.city=city; this.say=function(){ console.log(this.name+'的年龄是:'+this.age); } } var obj1=new Person('张三',33,'北京市'); var obj2=new Person('李四',66,'重庆市'); obj1.say(); obj2.say();
小结: 通过上面的案例可以小结出一个概念: 就是函数如果前面有new关键字,那么这个函数就是构造函数,否则就是一个普通函数
==在javascript中使用new关键字来修饰一个 普通函数的解答
系统做4件事情
首先这个函数就成为了 构造函数, 因为 new 后面跟一个函数 这样的函数就叫构造函数在内存中开辟一块(申请一块空闲的空间)空间,存储创建的新对象构造函数中的this就设置为当前的对象就是说当new写在一个函数前面的时候、这个函数中的this就是创建出来的对象、并且函数的返回值直接默认就是this了 隐式返回,可以使用如下代码进行测试得出结论 function Obj() {
}
//观察返回值
console.log(Obj()); //undefined
console.log(new Obj()); //Obj {}
//所以this这个对象会返回, [ 这里的返回是自动的 无需在构造函数中使用return]如果有设置对象的属性和方法就设置值3.字面量的方式创建对象
json对象是创建对象的一种字面量表示形式
var 变量名 = { } //这就叫字面量方式创建对象
案例代码
var obj={};obj.name='张三';obj.age=22;obj.city='北京市';obj.fn=function () { console.log('我的名字叫'+this.name+' 我的年龄是:'+this.age+' 我在'+this.city+'生活和工作!');}obj.fn();
推荐写法:
字面量优化后的形式:其实就是json数据格式的形式 [推荐写法]
案例代码
var obj2={ name:'张三', age:22, city:'北京市', fn:function () { console.log(this); console.log('我的名字叫'+this.name+' 我的年龄是:'+this.age+' 我在'+this.city+'生活和工作!'); }};obj2.fn();
注意: var obj =new Object() 与 var obj = { } 是完全一样的 只是一个在内存中的堆区中开空间 而另一个在栈区开辟空间
function Obj() { }var test=new Obj(); //在内存中的堆区中开空间console.log(test);var json={} //在栈区开辟空间 用完即释放console.log(json);
极客小俊@今日头条,首发原创技术文章
如果喜欢话请 "点赞 评论 收藏" 一键三连
大家的支持就是我坚持下去的动力!
标签: #js工厂模式 构造函数 #js中实例化对象什么意思 #js工厂函数跟构造函数