草庐IT

js之new的原理和源码

zsy1006 2023-03-28 原文
new的原理即作用：
function Student(name,age){
            this.name=name;
            this.age=age;
        }
var stu=new Student("小明",18);

观察上述代码，Student是一个普通的构造函数，然后通过new对构造函数实例化得到了一个Student类型的数据。

实例语句里面的关系有如下三点：

①：stu.__proto__===Student.prototype;

②：根据规则，当构造函数没有参数的时候，（）可以省略。故可知，Student("小明",18)并不是对构造函数的调用，这里new还主动调用了构造函数

③：new还创造了一个容器，让这个容器去调用这个构造函数，并且来装产生的数据对象，并且最后返回这个填装完毕的对象

故当你写下一个new关键字时，new实质上就做了如上三件事
new的最终目的：
创造一个构造函数类别的对象出来，就像new date造出来的是date对象，new array造出来的 是Array对象一样，并且保证这里面的一些继承关系不能乱
new关键字源码：
构造函数：
function Student(name,age){
            this.name=name;
            this.age=age;
        }

 

mynew函数：
1 function mynew(fn,name,age){
2             var obj={};
3             // 修改原型关系，确定obj一定是由fn造出来的
4             obj.__proto__=fn.prototype;
5             // obj本身没有fn方法，fn是window对象的，于是obj带着借fn所要求的参数去向window借，这样的话，fn借来后obj就可以用了，fn里的this什么的指向的也就是obj了，也可用apply或bind，这也就是修改this指针的原理，this一般是谁调用指向谁
6             var result=fn.call(obj,name,age);
7             // 判断通过构造函数实例化的对象是否为对象，是的话就输出，不是的话就输出新创建的obj
8             return result instanceof Object?result:obj;
9         }

调用：

console.log(mynew(Student,"小明",18)) ;

mynew不带形参的源码，除了mynew函数略有不同，其它均相同

    function mynew(){
            var obj={};
            // 获取函数调用时传的第一个参数，即为构造函数fn
            var fn=[].shift.call(arguments);
            // 修改原型关系，确定obj一定是由fn造出来的
            obj.__proto__=fn.prototype;
            // 修改fn的this指针，arguements必须要转为以逗号相连的数据
            fn.call(obj,...arguments);
            return obj;
        }
        console.log(mynew(Student,"小明",18)) ;

箭头函数不能写new：

注意箭头函数不能用来写new的源码，

  • 箭头函数没有自己的 this，无法修改this指针
  • 箭头函数没有自己的 prototype，无法修改原型对象
new的spancolorstyleJavaScript

有关js之new的原理和源码的更多相关文章

  1. ruby-on-rails - Enumerator.new 如何处理已通过的 block ？ - 2

    我在理解Enumerator.new方法的工作原理时遇到了一些困难。假设文档中的示例:fib=Enumerator.newdo|y|a=b=1loopdoy[1,1,2,3,5,8,13,21,34,55]循环中断条件在哪里，它如何知道循环应该迭代多少次(因为它没有任何明确的中断条件并且看起来像无限循环)？ 最佳答案 Enumerator使用Fibers在内部。您的示例等效于:require'fiber'fiber=Fiber.newdoa=b=1loopdoFiber.yieldaa,b=b,a+bendend10.times.m

  2. UE4 源码阅读：从引擎启动到Receive Begin Play - 2

    一、引擎主循环UE版本：4.27一、引擎主循环的位置：Launch.cpp:GuardedMain函数二、、GuardedMain函数执行逻辑：1、EnginePreInit：加载大多数模块int32ErrorLevel=EnginePreInit(CmdLine);PreInit模块加载顺序：模块加载过程：（1）注册模块中定义的UObject，同时为每个类构造一个类默认对象（CDO，记录类的默认状态，作为模板用于子类实例创建）（2）调用模块的StartUpModule方法2、FEngineLoop::Init()1、检查Engine的配置文件找出使用了哪一个GameEngine类（UGame

  3. ruby - 在 Ruby 中，为什么 Array.new(size, object) 创建一个由对同一对象的多个引用组成的数组？ - 2

    如thisanswer中所述,Array.new(size,object)创建一个数组，其中size引用相同的object。hash=Hash.newa=Array.new(2,hash)a[0]['cat']='feline'a#=>[{"cat"=>"feline"},{"cat"=>"feline"}]a[1]['cat']='Felix'a#=>[{"cat"=>"Felix"},{"cat"=>"Felix"}]为什么Ruby会这样做，而不是对object进行dup或clone？ 最佳答案 因为那是thedocumenta

  4. Ruby:行 "m = Hash.new {|h,k| h[k] = []}"完成了什么而 "Hash.new"没有完成？ - 2

    一边学习thisRailscast我从Rack中看到了以下源代码:defself.middleware@middleware||=beginm=Hash.new{|h,k|h[k]=[]}m["deployment"].concat[[Rack::ContentLength],[Rack::Chunked],logging_middleware]m["development"].concatm["deployment"]+[[Rack::ShowExceptions],[Rack::Lint]]mendend我的问题是关于第三行。什么是传递block{|h,k|h[k]=[]}到Has

  5. ruby - 使用 Class.new 时访问外部范围 - 2

    是否有可能以某种方式访问​​Class.new范围内的a？a=5Class.new{defb;aend}.new.b#NameError:undefinedlocalvariableormethod`a'for#:0x007fa8b15e9af0>#:in`b' 最佳答案 即使@MarekLipka的回答是正确的——改变变量范围总是有风险的。这是可行的，因为每个block都带有创建它的上下文，因此您的局部变量a突然变得不那么局部了——它变成了一个“隐藏的”全局变量:a=5object=Class.new{define_method(

  6. ruby-on-rails - 在 Ruby 或 Rails 中，hash.merge({ :order => 'asc' }) can return a new hash with a new key. 什么可以返回带有已删除键的新散列？ - 2

    在Ruby(或Rails)中，我们可以做到new_params=params.merge({:order=>'asc'})现在new_params是一个带有添加键:order的散列。但是是否有一行可以返回带有已删除key的散列？线路new_params=params.delete(:order)不会工作，因为delete方法返回值，仅此而已。我们必须分3步完成吗？tmp_params=paramstmp_params.delete(:order)returntmp_params有没有更好的方法？因为我想做一个new_params=(params[:order].blank?||para

  7. ruby-on-rails - 设计中的 ArgumentError::RegistrationsController#new 错误的参数数量(2 代表 0..1) - 2

    我在关注RyanbatesRailsCast的devise和omniauth(第235集-devise-and-omniauth-revised)。当我尝试使用Twitter登录时，标题中不断出现错误。defself.new_with_session(params,session)ifsession["devise.user_attributes"]new(session["devise.user_attributes"],without_protection:true)do|user|user.attributes=paramsuser.valid?end完整跟踪:C:/Ruby20

  8. ruby-on-rails - Assets 管道损坏 : Not compiling on the fly css and js files - 2

    我开始了一个新的Rails3.2.5项目，Assets管道不再工作了。CSS和Javascript文件不再编译。这是尝试生成Assets时日志的输出:StartedGET"/assets/application.css?body=1"for127.0.0.1at2012-06-1623:59:11-0700Servedasset/application.css-200OK(0ms)[2012-06-1623:59:11]ERRORNoMethodError:undefinedmethod`each'fornil:NilClass/Users/greg/.rbenv/versions/1

  9. ruby-on-rails - Rails - 理解 application.js 和 application.css - 2

    rails新手。只是想了解\assests目录中的这两个文件。例如，application.js文件有如下行://=requirejquery//=requirejquery_ujs//=require_tree.我理解require_tree。只是将所有JS文件添加到当前目录中。根据上下文，我可以看出requirejquery添加了jQuery库。但是它从哪里得到这些jQuery库呢？我没有在我的Assets文件夹中看到任何jquery.js文件——或者直接在我的整个应用程序中没有看到任何jquery.js文件？同样，我正在按照一些说明安装TwitterBootstrap(http:

  10. ruby-on-rails - 从 ActiveAdmin has_many 表单助手中删除 "Add new"按钮 - 2

    我在事件管理员编辑页面中有嵌套资源，但我只想允许管理员编辑现有资源的内容，而不是添加新的嵌套资源。我的代码看起来像这样:formdo|f|f.inputsdof.input:authorf.input:contentf.has_many:commentsdo|comment_form|comment_form.input:contentcomment_form.input:_destroy,as::boolean,required:false,label:'Remove'endendf.actionsend但它在输入下添加了“添加新评论”按钮。我怎样才能禁用它，并只为主窗体保留f.ac

随机推荐