JS高阶总结

1.0对象的基本概念

当我们把相对应的功能都封装到了对应的对象后,想要使用这个功能只需要找到相应的对象即可。

2.0面向对象

面向对象就是  一件事让谁来做  这个谁就是对象

面向对象过程就是  一件事该怎么做

三大特性

1. 封装性

把具体的步骤,封装到不同的对象中。对外提供接口让外部可以使用这个功能

2. 继承性

所谓继承就是自己没有, 别人有,拿过来为自己所用, 并成为自己的东西

3. 多态性  只做了解

多态只在强类型的预览中有

3.0创建对象的方法

字面量表示法  var xxx= { }

new创建方法  var xxx = new Object()

工厂模式  

构造函数  

function Person(xxxx) 构造函数首字母大写。

在使用构造函数的时候要使用new关键字,不使用new关键字会当做普通函数使用

4.0原型的基本概念

JS中创建的每一个函数都有一个 prototype 原型属性 这个属性也是一个对象  可以通过它向对象添加属性和方法在标准中,这是一个隐藏属性。该属性指向的是这个对象的原型。

5.0 原型的使用

1.可以直接把我们希望共享的属性 添加到 prototype 的属性中

2.重新为 prototype属性 赋值一个新的对象

6.0原型中的属性

通过构造函数创建的对象中 会有一个 属性 指向原型

__proto__  可以访问原型。

一般不会使用__proto__来修改

兼容不好  功耗大


constructor 属性

构造函数中有原型,原型中有constructor属性,constructor属性指向了构造函数

在编码时一般用不到 constructor 这个属性

但是如果我们在使用原型时 直接为原型 赋值 一个新的对象 为了保证他们的 三角关系存在 可以人为的把 constructor 添加进去

7.0 原型链

对象 都有原型

原型 也是对象

对象 又有原型

原型 又是对象

但是 并不是 一直找不到头

顶级的是 Object的原型

对象的.__proto__

构造函数Object.prototype

所有对象的 顶级的原型 都是 Object.prototype

这种一直查找原型的关系 称之为 原型链

8.0  object原型的常见属性

1. hasOwnProperty  对象是否拥有某个属性 只能够获取自身的属性

2. isPrototypeOf 对象a 是不是 对象b的原型

3. propertyIsEnumerable 属性 是否可以被 遍历

4. toString    toLocaleString

5. valueOf 复杂数据类型 跟普通数据类型进行运算时会调用 对象的 valueOf() 看看是否可以运算  如果还是不能运算 会接着调用 toSting()方法

8.0  Function的常见问题

Function也是构造函数  能够点出原型 

 Function的原型链的顶级 也是Object

在js中 函数也是对象

函数怎么用 函数名() $('div')

对象怎么用 对象.属性()  $.ajax()

自己写的构造函数 相当于 调用了 Function 来创建

自己定义的构造函数 相当于 创建了Function的实例对象

9.0  Function中可以使用的属性

函数直接通过console.log()无法查看属性

可以用  console.dir  来查看属性

1.  length 形参的 个数

2.  name 函数的名字

3. arguments 获取 函数被调用时 接收到的 实参  调用函数是 传入的实参个数不同 ,结果不同

4. caller  函数 在哪个函数中 被调用 返回的是谁

如果直接是在全局环境中调用的 那么为 null

主要用在 匿名函数的 递归上

10.eval 函数

js的解析器 可以把传入的 字符串解析为 js代码

可以用来解析 json

他可以解决低版本的IE中没有 JSON.parse方法的问题

eval()直接往里面写内容就会当成就是内容进行解析

面0试问题:如何解决低版本的ie中JSON.parse无法使用?

// 1.导入JSON2.js 2.eval()方法

11. 作用域 

1. 什么是作用域? --

变量的 作用范围

js中   xxx 能够创建 作用域? -- 函数

js中 有没有 块级作用域? -- 没有

2. 全局作用域

1.最外层的函数和在最外层的函数外定义的变量

2.未定义直接赋值的变量自动拥有全局作用域

12.作用域链

函数能够创建作用域

函数中 可以继续声明函数

函数能能够创建作用域

函数中 可以继续声明函数

根据这种关系创建出来的 层层叠叠的 作用域的 链式结构 称之为 作用域链

就像套娃一样一个里面套一个

13.  词法作用域  (静态作用域)

词法作用域的变量的值 跟函数调用的位置没有关系 只跟定义的位置有关

14.  变量的提升

js的代码在运行的时候有 会先进行预解析(预解析会先把函数的 变量声明 var xxx 函数的声明  function(){ }  )

这就是变量的提升 。

变量提升的特殊的情况

1.函数同名  会指定最后一个  因为从上至下运行 上面的会被覆盖掉

2.变量和函数同名  不对变量进行提升 只提升函数

3.预解析(变量的提升)是分作用域的

4.预解析(变量的提升)是分段的

预解析提升变量时 只能提升到他所在的那个 script 标签的顶部 不能跨标签

只是在预解析时要注意  执行时可以理解是在一起的

5.函数的表达式不会被提升  声明部分会被提升

6.  条件式函数声明    如果在条件语句中 定义了函数 不会直接提升函数的声明 而是把函数名作为变量 把变量名的 声明 提升

15. 递归

什么是递归:

递归就是在函数的内部 调用函数的自身  没有跳出条件的话就是死循环

设定一个跳出的条件 不能一直循环。

用递归的获取所有元素

// 找个框把找到的东西扔进去

var  tabo = [ ]

// 递归开始

function body (n){

// 先找传过来的子代

var son = n.children;

// 循环这些子代

for(var i=0; i

// 获取当前子代

var sondren = son[i];

// 把这些子代扔框里

tabo.push(sondren);

// 开始递归

body(sondren);

}

}

16.  闭包

在函数的内部定义函数。

function f1(){

function f2(){}

}

2.闭包的作用

延长变量的生命周期。

变量的封装对外提供有限的访问  避免被他人的肆意更改。

3.闭包的问题

闭包会造成内存浪费问题。

闭包不能滥用。

4.在什么地方使用

封装时会用到 。

17.  缓存

缓存作用

提升运行速度

有大小限制

如果使用的大小超过了限制

把之前缓存的东西删除

18.  自执行函数

(function( ){ }) ()

(function( ){ }( ))

自己执行自己就是自执行函数,使用 自执行函数 要注意跟 上面 和 下面 的代码隔离(;) 隔离符号

19. 沙箱

在沙箱中的操作被限死在当前作用域,不会对其他模块和个人沙箱造成任何影响。

19.each循环数组

在js的 ES5中 新添加了 forEach 循环方法

简化了for循环但是并不能完全替代它。

使用时需要传入一个  参数(是回调函数)

回调函数的的参数有(当前循环元素,当前循环元素的索引,当前循环的数组)

20.  map循环数组

map的用法跟forEach一样 它能够返回一个新的数组

map方法可以获取到 我在回调函数中 返回的元素 最后拼接成一个新的数组

21. 函数调用方法 

1. 直接调用

function eat(){}

eat();

this --->window

2.方法调用

var obj = {eat:function(){console.log(this);}}

obj.eat();

// this----> obj

// this--->obj

obj['eat']();

3. 构造函数调用

this---->指向 创建出来的对象

function Person(){

console.log(this);

}

new Person();

22.  2种创建对象的方法

1.0 工厂模式

function animalFactory(color, food) {

var obj = new Object();

console.log(this);

obj.color = color;

obj.food = food;

return obj;

}

2.0  寄生模式

function Person(color,food){this.color=color;this.food=food;}

构造函数

只要调用了 构造函数 在构造函数中的 this 指向的是 通过这个 构造函数 实例化的对象

23.  上下文的调用

函数().

函数.call(参数)

函数.apply(参数)

方法中的  this  是谁 取决于    调用    方法的方式

直接调用函数----------》  window

方法调用---------------》  对象

构造函数--------------》  实例化的对象

2.  如何在上下文调用模式下 传递参数

call 方法  如果要传递 参数 给 函数 直接在第二个参数开始 依次往后写即可

apply 方法 如果要传递 参数 给 函数 直接在第二个参数传入数组  伪数组即可

*注意

调用 call/apply方法时,如果不传入任何的参数 this 指向的是?--->window

调用 call/apply方法时,传入的如果是值类型,会被包装为对应的引用类型?

调用 call/apply方法时,传入的如果是 null undefined 指向window

24.获取类型

如何获取类型

1.0 调用 toString() 方法;

toString(); 把调用 toString的那个对象的 类型 格式化为[object Object];

Object.prototype.toString.call(arr)

2.0自己实现类似 tostring 方法

Object.prototype.mytoString = function () {

var result = '';

result += '[';

result += (typeof this);

result += ' ';

result += this.__proto__.constructor.name;

result += ']'

console.log(result);

return result;

}

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,029评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,238评论 3 388
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,576评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,214评论 1 287
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,324评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,392评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,416评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,196评论 0 269
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,631评论 1 306
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,919评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,090评论 1 342
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,767评论 4 337
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,410评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,090评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,328评论 1 267
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,952评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,979评论 2 351

推荐阅读更多精彩内容

  • 继承 一、混入式继承 二、原型继承 利用原型中的成员可以被和其相关的对象共享这一特性,可以实现继承,这种实现继承的...
    magic_pill阅读 1,056评论 0 3
  • 1,javascript 基础知识 Array对象 Array对象属性 Arrray对象方法 Date对象 Dat...
    Yuann阅读 899评论 0 1
  • ECMAScript关键字 delete do else finally function in instance...
    doudou2阅读 718评论 0 0
  • 一曲离骚惹人醉,半尽笑颜问心愧,待君衣锦把乡归,忘年泪,莫问杨柳凋残碎。
    凤临阁阅读 177评论 1 0
  • 今天还是很困!就很谜! 总之今天又摸了一整天(。)除了下班前观察了一下品值花用户的数据集之外就没干什么正事,而且初...
    真昼之月阅读 135评论 0 0