JS中的闭包‘原型’原型链

一、闭包

1、首先,什么是闭包?你了解闭包吗?
闭包就是能够读取到函数内部变量的函数,通俗一点,就是函数A中的函数B,被函数A外部的一个变量引用的时候,就创建了一个闭包
2、什么时候会用到闭包?
一般是函数封装的时候,再就是使用定时器的时候。
3、上几个基本的闭包的例子(各位看能不能回答正确)

function a(){
     var i=0;
     function b(){
         alert(++i);
     }
     return b;
}

var c = a();
c();//?
c();//?
c();//?

各位想一想,依次会弹出什么?
答案:依次弹出1,2,3
解释:i是函数a中的一个变量,它的值在函数b中被改变,但是函数b中的值不会根据函数a的定义而改变,因为作用域不同。函数b中的值每执行一次,i就会在原来的基础上加1。并且,函数b的值会一直保存在内存中
当我们需要在模块中定义一些变量,并希望这些变量一直保存在内存中但又希望不会被“污染”全局的变量时,就可以使用闭包来定义这个模块。

闭包的作用:1、它可以读取函数内部的变量,2、让这些变量的值始终保持在内存中

var num = new Array();
for(var i=0; i<4; i++){
    num[i] = f1(i);
}
function f1(n){
     function f2(){
         alert(n);
     }
     return f2;
}
num[2]();
num[1]();
num[0]();
num[3]();

想一想,答案是什么?
答案:2,1,0,3
解释:for循环用来循环赋值,一共循环了4次,相当于生成了四个函数f1(n),num[2]实际上就是f1(2),num[1]就是f1(1)…依次类推,所以答案就是2,1,0,3。

闭包的优缺点
优点
1、减少全局变量
2、封装
3、私有化
缺点
1、使用闭包会占有内存资源,过多使用闭包会导致内存溢出等
解决内存溢出:把那些不需要的变量,垃圾回收不走的变量赋值为null。

二、原型和原型链

1、原型的概念
每个对象都会在内部初始化一个属性,就是原型(prototype)。
通俗一点,原型就是一个模板,更为准确来说是一个对象模板。
2、原型链是什么?
当我们访问一个对象时,如果对象内部不存在这个属性,那么它就会去prototype里找这个属性,这个prototype又会又自己对的prototype,于是就这样一直找下去,也就是我们平时所说的原型链的概念。
可能有点绕,举个例子,如果我们要找一个人,(如果我们不知道人这个概念)首先从最外层找起,就是生物→ 动物 → 人 ,这个过程就创建了原型链。
3、一个原型链继承和构造函数继承的例子

function Animal(name) {
    this.name = name
}

Animal.prototype.getName = function() {
    console.log(this.name)
}

var animal1 = new Animal('Kate')
var animal2 = new Animal('Lucy')

//对象animal1 和 animal2共享方法getName
animal1.getName()
animal2.getName()

这个就是一个利用prototype去继承的例子!

//父类:人
function Person () {
   this.head = '脑袋瓜子';
   this.emotion = ['喜', '怒', '哀', '乐']; //人都有喜怒哀乐
}
//子类:学生,继承了“人”这个类
function Student(studentID) {
    this.studentID = studentID;
    Person.call(this);
}

var stu1 = new Student(1001);
console.log(stu1.emotion); //['喜', '怒', '哀', '乐']

这个利用call改变this指向,然后构造学生去继承了人的情感。
如果你明白了以上,那么下面例子的答案是什么?

var A=function(){}

A.prototype.n=1

var b=new A()

A.prototype={
     n:2,
     m:3
}

var c=new A()

console.log(b.n,b.m,c.n,c.m)//多少

答案:1,undefined,2,3。
解释:b继承A,所以b.n就为1,而m在A中找不到,所以为undefined,以此类推,c继承的时候A添加了n和m,所以c.n和c.m分别是2和3。

既然有了undefined,那么undefined和null的区别你知道吗?
undefined是一个表示"无"的原始值;
null用来表示尚未存在的对象。

那再给你出个题

var F=function(){};

Object.prototype.a=function(){
     console.log('a()')
};

Function.prototype.b=function(){
     console.log('b()')
}

var f=new F();

f.a()//?
f.b()//?
F.a()//?
F.b()//?

答案应该为a()、报错找不到b这个函数、a()、b()。(如果你能瞬间回答出这个答案就代表你已经了解原型和原型链了)

如果以上内容都很轻松的看懂回答出来,那说明你的基础还不错,加油!

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值