js进阶第五天

一、数组的常见操作

pop() 删除最后一个

shift() 删除第一个

push() 追加 添加到最后面

unshift() 添加到 第一个位置

二、闭包技术详解

1.1 什么是闭包

  • 闭包实际上是一种函数,所以闭包技术也是函数技术的一种;闭包能做的事情函数几乎都能做。

  • 闭包技术花式比较多,用法也比较灵活,一般开发人员在学习闭包的时候都会遇到瓶颈,主要是因为闭包技术的分界线并不明显。几乎无法用一个特点去区分。

  • 当一个内部函数被其外部函数之外的变量引用时,就形成了一个闭包。

    function A(){
       function B(){
           console.log("Hello XMG!");
       }
       return B;
    }
    var b = A();
    b();//Hello XMG!
    
  • 闭包的最大用处有两个:一个是可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。

**1.2 **封闭作用域

  • JavaScript的GC机制

    • 在javascript中,如果一个对象不再被引用,那么这个对象就会被GC回收,否则这个对象一直会保存在内存中。
  • 封闭作用域

    • 封闭作用域又称值为封闭空间,还有一个昵称叫小闭包,以及匿名函数自调。

    • 基本结构:

      
      (function(){})();
      ;(function(){})();
      +(function(){})();
      -(function(){})();
      ?(function(){})();
      
  • **技术最大目的: 全局变量私有化 **

  • 技术优点:

    • 不污染全局空间!

    • 内部所有的临时变量执行完毕都会释放不占内存。

    • 可以保存全局数据。

    • 更新复杂变量。

1.3 作用域链

  • 嵌套之间的函数会形成作用域链,每次对变量的访问实际上都是对整条作用域链的遍历查找。先查找最近的作用域,最后再查找全局作用域。如果在某个作用域找到了对量就会结束本次查找过程。
  • **对于作用域全局作用域查找快,还是局部作用域查找快? **
  • 局部作用域查找要远远大于全局作用域查找的速度。所以高级的程序设计一般是尽量避免全局查找。
  • 每次访问都是对作用域链的一次遍历查找其中全局作用域是最耗费时间的。
  • 解决方案:
    • 当前目标使用完以后,在退出作用域之前储存这个目标,就可以在下次取到上一次的目标。
  • 补充:

    变量的生命周期
    任何一个变量在内存中都是一个引用,这个变量是有自己的生命周期。周期结束意味着被销毁。 一个变量在它当前的作用域内被声明那一刻相当于变量出生,整个当前作用域执行完毕并退出作用域相当于变量的寿命终止。

1.4 保存作用域

  • 保存作用域是一种更高级的闭包技术,如果函数嵌套函数,那么内部的那个函数将形成作用域闭包。简单的说,这种闭包能够达到的好处就是让指令能够绑定一些全局数据去运行;

  • 基本结构:

     var A=function(){
         return function(){};
     }
  • 优点:

    • 全局数据隐藏化

    • 可以让某个指令运行时候绑定一些隐藏的全局数据在身上。

  • 一句话: 将数据绑定在指令上运行,让指令不再依赖全局数据。

三、面向对象


对象是什么?
对象就是带有属性和方法的数据类型!

任何一门高级语言都要面向对象,JavaScript则是基于原型的面向对象语言,因此,我们的思维要由面向过程转向面向对象

Snip20161217_2.png

面向对象:

面向对象里面:类和对象

类是对象的抽象,而对象是类的具体实例

一切事物皆对象 JavaScript 一切皆对象


 类 和 对象

 对象 女朋友
 小白 你有对象了吗? 泛指 女朋友
 昨天陪你打LOL的那个女生是你对象吗? 特指 某一个女朋友

 在座的有喜欢吃香蕉的吗?
 你手中那根香蕉熟了吗? 特指对象(具体的实例)

面向对象的特性:

  • 抽象

    • 抽象就是忽略一个主题中与当前目标无关的那些方面,以便更充分地注意与当前目标有关的方面。
  • 封装

    • 封装是把过程和数据封闭起来,对数据的访问只能通过开放的接口。
  • 继承

    • 子类对象继承使用父类的属性和方法。
  • 多态

    • 多态是指两个或多个属于不同类的对象,对于同一个消息(方法调用)作出不同响应的方式。

2.1 构造函数

所有的构造函数有一个特点:首字母大写;

在js中我们可以理解为只要执行以后能够返回新的对象的函数就是构造函数。

构造函数技巧的最大目的:创造完全独立的对象,互相之间不影响。

2.2 关键词new

  • 将一个函数变成对象并返回

  • 在这个函数的内部将this指向函数本身。

  • new这个关键词实际上能够将任何函数直接变成一个对象。它只有在和构造函数配合的时候才有用,它相当于可以化简构造函数自己创造对象和返回对象的步骤。

2.3 构造器(constructor) 和 原型属性 (prototype)

在任何一个对象中都有构造器和原型属性,包括原生的对象,比如: Date, Array等;

  • constructor 返回对创建此对象的 构造函数的引用

  • prototype 让我们有能力向对象添加属性和方法

    prototype它的作用就是构造函数的一个共享库;在这个共享库里面存储的所有数据将来都会被所有的新对象公用。 这样大大降低了创建方法的成本。

  • 原型共享库是谁使用的?

    • 构造函数使用原型库,所有将来的对象共享这个原型库。
    • 如果把方法都写在构造函数的原型库里面,将来还可以通过原型继续拓展。 、
  • 原型的工作原理

    • 在网页发布以后,原型的工作会自动做以下两件事情:
    第一:自动将原型库中的所有内容都放在将来的对象身上;
    第二:如果共享库中的内容发生变化会自动更新所有对象上的数据。
  • 注意:

    • 在面向对象的写法当中,原型的共享库里面所有的方法中的this默认情况都会指向将来的对象。

    • 只有在两个情况会发生变化,那么这两个情况一定要检查作用域:

     第一:如果在事件的作用域中,this的指向会变成事件源。
     第二:如果在定时器的作用域中,this的指向会变成window。
![28731-106.jpg](http://upload-images.jianshu.io/upload_images/9199255-77b4be5ae7224219.jpg?imageMogr2/auto-
orient/strip%7CimageView2/2/w/1240)
![50216-106.jpg](http://upload-images.jianshu.io/upload_images/9199255-c2b2b3b0114855ca.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,530评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 86,403评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,120评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,770评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,758评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,649评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,021评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,675评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,931评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,659评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,751评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,410评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,004评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,969评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,203评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,042评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,493评论 2 343

推荐阅读更多精彩内容

  • 继承 一、混入式继承 二、原型继承 利用原型中的成员可以被和其相关的对象共享这一特性,可以实现继承,这种实现继承的...
    magic_pill阅读 1,049评论 0 3
  • 1,javascript 基础知识 Array对象 Array对象属性 Arrray对象方法 Date对象 Dat...
    Yuann阅读 889评论 0 1
  • 原文:http://dmitrysoshnikov.com/ecmascript/javascript-the-c...
    jaysoul阅读 472评论 0 0
  • 作者:Dmitry A. Soshnikov编译地址:http://dmitrysoshnikov.com/ecm...
    IT程序狮阅读 3,333评论 2 12
  • 1. 用var操作符声明的变量与省略var操作符声明的变量的区别 在JavaScript中,是通过var关键字来声...
    科研者阅读 1,021评论 0 8