javascript 原型、this、闭包、深拷贝

栏目: JavaScript · 发布时间: 5年前

内容简介:Function.prototype.apply(),Function.prototype.call(),Function.prototype.bind()
  • JavaScript只有一种结构:对象。
  • 每个实例对象(object)都有一个私有属性(称之为__proto__)指向它的原型对象(prototype),层层向上直到一个对象的原型对象为 null , f ---> Function.prototype ---> Object.prototype ---> null
    • Object.getPrototypeOf() 方法返回指定对象的原型
      const prototype1 = {};
          const object1 = Object.create(prototype1);
          console.log(Object.getPrototypeOf(object1) === prototype1);//true
          Object.prototype===Object.getPrototype(prototype1)  // true
      复制代码
    • Object.setPrototypeOf(obj,prototype) 方法设置一个指定的对象原型
    • obj.hasOwnProperty(prop) 方法返回一个布尔值,指定对象自身属性中是否具有指定的属性,不会遍历整个原型链

this

  • this 箭头函数其实是没有 this 的,这个函数中的 this 只取决于他外面的第一个不是箭头函数的函数的 this
function a(){
        return ()=>{
            return ()=>{
                console.log(this)
            }
        }
    }
    console.log(a()()())//window
复制代码

闭包

for ( var i=1; i<=5; i++) {
	setTimeout( function timer() {
		console.log( i );
	}, i*1000 );
}
//输出5个6,首先因为`setTime`是个异步函数,所有会先把循环全部执行完毕,这时i等于6,
for ( let i=1; i<=5; i++) {
	setTimeout( function timer() {
		console.log( i );
	}, i*1000 );
}
{ // 形成块级作用域
  let i = 0
  {
    let ii = i
    setTimeout( function timer() {
        console.log( i );
    }, i*1000 );
  }
  i++
  {
    let ii = i
  }
  i++
  {
    let ii = i
  }
}
复制代码

深拷贝

  • JSON.parse()和JSON.stringify() 能正确处理的对象只有Number、String、Arry等能够被json表示的数据结构
function deepClone(initalObj, finalObj) {    
  var obj = finalObj || {};    
  for (var i in initalObj) {        
    var prop = initalObj[i];        // 避免相互引用对象导致死循环,如initalObj.a = initalObj的情况
    if(prop === obj) {            
      continue;
    }        
    if (typeof prop === 'object') {
      obj[i] = (prop.constructor === Array) ? [] : {};            
    deepClone(prop,obj[i]);
    } else {
      obj[i] = prop;
    }
  }    
  return obj;
}
复制代码

call、apply、bind区别

Function.prototype.apply(),Function.prototype.call(),Function.prototype.bind()

  • callapply 都是为了解决改变 this 的指向。 作用相同,只是传参方式不同--第一个参数:作用域,第二个参数, call 可以接收一个参数列表, apply 只接受一个参数数组
  • bind() 方法创建一个新的函数,在调用时设置 this 关键字为提供的值
    bind() 是用来控制调用函数的范围(全局、某个类等等),在是 bind(arg1) 这个函数被调用时,arg1 是调用 bind() 函数里面的 this,不管这个函数被调用多少次,这个函数里的 this 一直是这个 arg1
    复制代码
    //mdn例子
    this.x = 9;
    var module = {
        x: 81,
        getX: function() { return this.x; }
    };
    
    module.getX(); // 81
    
    var retrieveX = module.getX;
    retrieveX();  // 9
    
    var boundGetX = retrieveX.bind(module);
    boundGetX(); // 81
    复制代码

以上所述就是小编给大家介绍的《javascript 原型、this、闭包、深拷贝》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

The Seasoned Schemer

The Seasoned Schemer

Daniel P. Friedman、Matthias Felleisen / The MIT Press / 1995-12-21 / USD 38.00

drawings by Duane Bibbyforeword and afterword by Guy L. Steele Jr.The notion that "thinking about computing is one of the most exciting things the human mind can do" sets both The Little Schemer (form......一起来看看 《The Seasoned Schemer》 这本书的介绍吧!

Markdown 在线编辑器
Markdown 在线编辑器

Markdown 在线编辑器

正则表达式在线测试
正则表达式在线测试

正则表达式在线测试

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具