美文网首页
js常见原生方法重写汇总(一)

js常见原生方法重写汇总(一)

作者: isSunny | 来源:发表于2022-03-28 17:17 被阅读0次
Object.create

原理:创建对象,并且现有的对象来提供新创建的对象的proto

function objectCreate(fn){
  function Fn(){};
  Fn.prototype = fn;
  return new Fn();
}
new

原理:创建实例对象,方法执行并让this指向该实例对象,分析返回的结果。

function _new(fn,...args){
  let obj = Object.create(fn.prototype);
  let result = fn.call(obj,...args);
  if(typeof result==="object"&&result!==null){
    return result;
  }
  return obj;
}
instanceof

用于检测构造函数prototype 属性是否出现在某个实例对象的原型链上。

function _instanceof(a,b){
  if(typeof a!=="object"||a===null){
    return false;
  }
  let pro = Object.getPrototypeOf(a);
  while(true){
    if(pro==null) return false;
    if(pro==b.prototype){
     return true;
    }
    pro = Object.getPrototypeOf(pro);
  }
}

console.log(_instanceof(new String("111"),String));//true
call,apply

都是改变this,不同的是传参不同,call是一个一个传,apply是传一个数组。

Function.prototype._call=function(contxt,...args){
  if(typeof this!=="function"){
    throw Error("this is not function");
  }
  contxt = contxt||window;
  if(typeof contxt!=="object"||typeof contxt!=="function"){
    if(typeof contxt==="bigint"||typeof contxt==="symbol"){
      contxt = Object(contxt);
    }else{
      contxt = new contxt.constructor(contxt);
    }
  }
  let key = Symbol("key");
  contxt[key] = this;
  let result = contxt[key](...args);
  delete contxt[key];
  return result;
}

var a = '小红';
let obj = {
  a:'小白',
  myName:function(){
    console.log(this.a);
  }
}

function myName(){
  console.log(this.a);
}
myName(); //小红
myName._call(obj);//小白
bind

bind和call,apply都是改变this,不同的是bind不是立即执行,属于柯里化函数思想。

Function.prototype._bind = function(contxt,...args){
  return (...innerArgs)=>{
    this.call(contxt,...args.concat(...innerArgs));
  }
}
function myName(){
  console.log(this.a);
}
myName();
myName._bind(obj)();


相关文章

  • js常见原生方法重写汇总(一)

    Object.create 原理:创建对象,并且现有的对象来提供新创建的对象的proto。 new 原理:创建实例...

  • js常见原生方法重写汇总(二)

    reduce reduce 为数组中的每一个元素依次执行回调函数,不包括数组中被删除或从未被赋值的元素,接受四个参...

  • OC与JS交互

    1.OC重写JS里边的方法事件JS回调OC的原生方法 1.uiwebView 导入系统的处理JS文件 import...

  • JS中的盒模型

    查看JS盒模型相应的CSDN JS中最常见的原生DOM的属性和方法

  • WKWebView与vue.js的交互

    原生调用js的方法 js写法 Swift写法 js调用原生的方法 js写法 Swift写法 1.创建和设置JSOb...

  • js关于数组的方法汇总

    js关于数组的方法汇总

  • 重写JS方法

    1. 浅拷贝 2. 深拷贝 对象深度合并 3. 重写promise

  • 第四天2018-10-24

    switf原生与html.js交互 目的:实现点击更换图片的功能原理:点击->js调用原生方法->在原生的方法里面...

  • Android webview 与 js(Vue) 交互

    js 与原生交互分为两种情况:js 调用原生方法,原生调用 js 方法。 本文将对这两种情况分别讲解,H5 端用 ...

  • zone.js

    zone.js 是angular2 实现事件的一种方式,它把原生的js的事件给重写了。比如 click 。

网友评论

      本文标题:js常见原生方法重写汇总(一)

      本文链接:https://www.haomeiwen.com/subject/dgmpjrtx.html