this对象

整理下思路:

一般用到this中的情景:

1.构造方法中

function A(){
this.name="yinshen";
}
var a=new A();
console.log(a.name);

this指向new出来的对象实例

2.json对象中方法:

var obj={
  name:"yinshen",
  getName:function(){
  return this.name;
  }
}

this指向obj本身

3.通过apply或call方法改变方法本身作用域对象

function a(){
return this.name;
}
var b={name:"yinshen"};
a.apply(b);

this指向apply/call的传入的参数对象。

4.其它:其它情形纯属没事找抽型,可以就地正法

prototype

从物种起源说起吧:js创建一个对象必须有构造方法,我们取名为A函数,var a=new A()之后有了a对象。

对象a默认有什么属性?

  a有constructor属性指向A函数,constructor的用处在于标识对象类型

alert(a.constructor==A);
alert(a instanceof A);

  但说实话,js一般使用我们不关心对象是什么类型,我们关心他实际能做什么(属性和方法),你可以忘掉这个constructor了,除非你的场景真要做类型判断。。。

  a有个__proto__属性指向原型对象,在高级浏览器支持。firefox、chrome有,IE不兼容。这属性有什么实际用处?继续忘掉吧,除了调试的时候打印出来看看。。。

函数A默认有什么属性?

  A有prototype属性,prototype是个对象:所有A的实例共享此prototype的方法和函数。

  用处很多:

  你可以将公共的方法和公有的变量设置到prototype上,达到复用函数和属性的目的。不过要注意些问题:

1.prototype设置方法没疑问,但设置属性时,特别是数组或者obj的引用类型变量时要小心覆盖影响的问题。

A.prototype.friends=["b","c","d"];
var a1=new A();
var a2=new A();
a.friends.push("e");
alert(a2.friends);

2. A的prototype的constructor默认指向A,但prototype如果直接赋值给一个对象,会覆盖constructor,不过像之前所说很多时候我不care这个,那就忽略吧,类型判断出了问题再记起这个坑

A.prototype.getName=function(){};//不会覆盖constructor
//会覆盖constructor
A.prototype.construct={
 constructor:A,//可以这样
getName:function(){}
}

3.for in 操作a对象时会遍历出所有属性或方法,包括prototype上的,可以通过a.hasOwnProperty("name")来判断(true为自身,false为prototype)

终了画张图上来:

对象person1的constrcutor指向Person函数,person1的__proto__指向Person函数的prototype

Person函数的prototype对象的constructor属性指向Person自身

上张更经典的图吧

闭包

引入问题

(function a(){ 
   var i=1;
for(;i<10;i++){
(function(){
console.log(i);
})();
}
})()

输出:0,1,2....9 这个正常

var result=(function a(){
   var i=1,fn=[];
for(;i<10;i++){
fn[i]=function(){
console.log(i);
};
}
   return fn;
})();
console.log(result[1]());....console.log(result[9]());

输出是:10,10,10,..... 这里有问题

梳理下基础:

1.javascript的变量最小作用域是方法级。(方法里面嵌入方法)

2.javascript的作用域链是嵌套的,内部方法可以访问到外部方法定义的变量。(且内部方法依赖外部变量)

3.函数是个很特殊语言类型,它不会立即执行,函数中的变量只有当函数真正执行的那一刻才能确认。(方法返回内部方法。。。闭包)

上面的几点导致js可能存在的闭包问题:如果内部找不到i变量会在作用域链中回溯上一级,但它并不会实际保存i的值,它只是在内部记得自己引用的是外层的i变量,但这个i变量可能在函数执行时已经被改变了。这个过程对内部函数不可知。

除了自己显式的这种闭包调用,另外一个比较隐藏的情况就是setTimeout和setInternval,因为实际上原理是一样的,细细体会吧

for(var i=0;i<10;i++){
setTimeout(function(){
console.log(i)
},10);
}

4.推荐的解决:内部函数若依赖外部的变量,以方法调用的值传递来解除这种闭包的依赖。

var result=(function a(){
   var i=1,fn=[];
for(;i<10;i++){
fn[i]=(function(_i){
return function(){console.log(_i)};
})(i);
}
   return fn;
})();
console.log(result[1]());....console.log(result[9]());

this prototype 闭包 总结的更多相关文章

  1. js 原型链与继承

    var A = function(){ this.name="xiaoming"; } A.prototype.age=9; var a = new A(); console.lo ...

  2. JavaScript code 性能优化

    1 1 1 JavaScript 性能优化 prototype 闭包 Closure 内存泄漏 event system 1 定义类方法以下是低效的,因为每次构建baz.Bar的实例时,都会为foo创 ...

  3. js闭包 和 prototype

    function test(){ var p=200; function q(){ return p++; } return q; } var s = test(); alert(s()); aler ...

  4. 深入理解javascript原型和闭包(3)——prototype原型

    既typeof之后的另一位老朋友! prototype也是我们的老朋友,即使不了解的人,也应该都听过它的大名.如果它还是您的新朋友,我估计您也是javascript的新朋友. 在咱们的第一节(深入理解 ...

  5. javascript闭包,arguments和prototype

    prototype javascript中一切皆对象,并且对象的属性和方法可以任意添加,例如: var obj=function(){}; obj.name="jack"; 但是下 ...

  6. javascript学习:闭包和prototype原型使用基础

    闭包 function Person(name) { this.Username = name; var Userage = 18; //通过这种方法可以模拟私有成员 //类似于private成员 t ...

  7. 【学习笔记】深入理解js原型和闭包(3)——prototype原型

    既typeof之后的另一位老朋友! prototype也是我们的老朋友,即使不了解的人,也应该都听过它的大名.如果它还是您的新朋友,我估计您也是javascript的新朋友. 在咱们的第一节(深入理解 ...

  8. 深入理解javascript原型和闭包(3)——prototype原型 (转载)

    深入理解javascript原型和闭包(3)——prototype原型   既typeof之后的另一位老朋友! prototype也是我们的老朋友,即使不了解的人,也应该都听过它的大名.如果它还是您的 ...

  9. JavaScript学习笔记(二)——闭包、IIFE、apply、函数与对象

    一.闭包(Closure) 1.1.闭包相关的问题 请在页面中放10个div,每个div中放入字母a-j,当点击每一个div时显示索引号,如第1个div显示0,第10个显示9:方法:找到所有的div, ...

随机推荐

  1. UIView的layoutSubviews和drawRect方法何时调用 ———转

    转自:http://jianyu996.blog.163.com/blog/static/112114555201305113018814/ 首先两个方法都是异步执行.layoutSubviews方便 ...

  2. 20145208《Java程序设计》第3周学习总结

    20145208 <Java程序设计>第3周学习总结 教材学习内容总结 认识对象 类类型 在第三章的学习中,我了解到JAVA可区分为基本类型和类类型两种类型,在上周的学习中我学习了JAVA ...

  3. grootJs 系统常用API接受

    groot.absUrl(url) 把相对路径转换为绝对路径 groot.model 把vm对象转换为json 去掉系统生成的的属性groot.model groot.log 输出到控制台 兼容低版本 ...

  4. 简述WebService的使用(一)

    环境: vs版本:vs2013 windows版本:win7 IIS版本:IIS7.0 (如果觉得对您有用,请点击右下角[推荐]一下,让更多人看到,谢谢) 配置环境: 主要针对于IIS ·首先,有很多 ...

  5. 记<<ssh穿透防火墙连接内网的机器(不用路由端口映射)>>

    场景: 在家连接公司的内网服务器. 需求: 不用设置端口映射在家用putty登录公司内网服务器. 条件: 有一台公网服务器做转发,有开放端口的控制权.(公网服务器可以是阿里云ECS, 腾讯云主机这样的 ...

  6. 序列化和反序列化的几种方式(JavaScriptSerializer 、XmlSerializer、DataContractSerializer)(一)

    JavaScriptSerializer 类 为启用 AJAX 的应用程序提供序列化和反序列化功能. 命名空间:   System.Web.Script.Serialization 程序集:  Sys ...

  7. javascript基础知识拾遗

    1 下面列出的值被当作假 false null undefined '' 0 NaN 其它所有值被当作是真 console.log(undefined || true); //true console ...

  8. “耐撕”团队2016.04.14站立会议

    1. 时间 : 19:20--19:40  共计20分钟 2. 人员 : Z   郑蕊 * 组长 (博客:http://www.cnblogs.com/zhengrui0452/), P 濮成林(博客 ...

  9. iOS开发小技巧--利用苹果官方API播放视频(方法已经过时,了解一下)

  10. zoj3882 博弈

    我理解错题目意思,稀里糊涂A了.其实就是先手必胜. #include<stdio.h> int main() { int n; while(scanf("%d",&am ...