如何在Javascript中動態設置功能/對象名稱，因爲它顯示在Chrome中

Question

這是Google Chrome調試器一直在困擾我的東西，我想知道是否有辦法解決它。

我正在使用大量面向對象的JS（使用Joose框架），並且當我調試我的代碼時，我的所有類都被賦予非感性的初始顯示值。要明白我的意思，試試這個在Chrome控制檯：

var F = function() {}; 
var myObj = new F(); 

console.log(myObj); 

輸出應該是一個單一的線，你可以擴展看到myObj所有屬性，但你看到的第一件事就是▶ F。

我的問題是，因爲我的面向對象框架，每個單個對象實例化得到相同的'名稱'。這看起來的代碼負責，這是像這樣：

getMutableCopy : function (object) { 
    var f = function() {}; 
    f.prototype = object; 
    return new f(); 
} 

這意味着在調試器，初始視圖始終是▶ f。

現在，我真的不希望被改變了人們什麼 Joose如何實例化對象（getMutableCopy ...？），但好像有什麼事我可以添加到這個，這樣我可以提供我自己的名字，那會很棒。

，我已經看了一些東西，但不能隨地獲取：

> function foo {} 
> foo.name 
    "foo" 
> foo.name = "bar" 
    "bar" 
> foo.name 
    "foo" // <-- looks like it is read only 

Answer 1

正常使用window[name]像

var name ="bar"; 
window["foo"+name] = "bam!"; 
foobar; // "bam!" 

這將導致你的功能，如：

function getmc (object, name) { 

    window[name] = function() {}; 
    window[name].prototype = object; 
    return new window[name](); 

} 

但是然後

foo = function(){}; 
foobar = getmc(foo, "bar"); 
foobar; // ▶ window 
foobar.name; // foo 
x = new bar; x.name; // foo .. not even nija'ing the parameter works 

因爲你不能EVAL return語句（eval("return new name()");），我想，你就完蛋了

Answer 2

雖然這是醜陋的，你可以通過eval（）函數騙：

function copy(parent, name){ 
    name = typeof name==='undefined'?'Foobar':name; 
    var f = eval('function '+name+'(){};'+name); 
    f.prototype = parent; 
    return new f(); 
} 

var parent = {a:50}; 
var child = copy(parent, 'MyName'); 
console.log(child); // Shows 'MyName' in Chrome console. 

當心：你只能使用與函數名一樣有效的名字！

附錄：爲了避免對每一個對象實例化eval ING，使用緩存：

function Cache(fallback){ 
    var cache = {}; 

    this.get = function(id){ 
    if (!cache.hasOwnProperty(id)){ 
     cache[id] = fallback.apply(null, Array.prototype.slice.call(arguments, 1)); 
    } 
    return cache[id]; 
    } 
} 

var copy = (function(){ 
    var cache = new Cache(createPrototypedFunction); 

    function createPrototypedFunction(parent, name){ 
    var f = eval('function '+name+'(){};'+name); 
    f.prototype = parent; 
    return f; 
    } 

    return function(parent, name){ 
    return new (cache.get(name, parent, typeof name==='undefined'?'Foobar':name)); 
    }; 
})(); 

Answer 3

這並不能完全解決問題，但我會建議重寫對類的原型toString方法。例如：

my_class = function() {} 
my_class.prototype.toString = function() { return 'Name of Class'; } 

您仍然會看到原來的類名，如果你直接在控制檯輸入my_class的一個實例（我不認爲這是可能做到這事），但你會得到錯誤消息中的好名字，我覺得這很有幫助。例如：

a = new my_class() 
a.does_not_exist() 

會給出錯誤信息：「類型錯誤：類對象名稱沒有方法‘does_not_exist’」

Answer 4

我一直在玩這個圍繞在過去3小時，終於拿到了它至少幾分優雅使用新功能的其他線程的建議：

/** 
* JavaScript Rename Function 
* @author Nate Ferrero 
* @license Public Domain 
* @date Apr 5th, 2014 
*/ 
var renameFunction = function (name, fn) { 
    return (new Function("return function (call) { return function " + name + 
     "() { return call(this, arguments) }; };")())(Function.apply.bind(fn)); 
}; 

/** 
* Test Code 
*/ 
var cls = renameFunction('Book', function (title) { 
    this.title = title; 
}); 

new cls('One Flew to Kill a Mockingbird'); 

如果你運行上面的代碼，你應該看到下面的輸出到您的控制檯：

Book {title: "One Flew to Kill a Mockingbird"} 

Answer 5

我覺得這是動態設定函數的名稱的最好方式：

Function.prototype.setName = function (newName) { 
     Object.defineProperty(this,'name', { 
      get : function() { 
       return newName; 
      } 
     }); 
    } 

現在你只需要調用setName方法

function foo() { } 
foo.name; // returns 'foo' 

foo.setName('bar'); 
foo.name; // returns 'bar' 

foo.name = 'something else'; 
foo.name; // returns 'bar' 

foo.setName({bar : 123}); 
foo.name; // returns {bar : 123} 

Answer 6

Object.defineProperty(fn, "name", { value: "New Name" }); 

會做的伎倆並且是最高性能的解決方案。沒有評估。

Answer 7

到@ Piercey4答案相似，但我不得不設置name爲實例，以及：

function generateConstructor(newName) { 
    function F() { 
    // This is important: 
    this.name = newName; 
    }; 

    Object.defineProperty(F, 'name', { 
    value: newName, 
    writable: false 
    }); 

    return F; 
} 

const MyFunc = generateConstructor('MyFunc'); 
const instance = new MyFunc(); 

console.log(MyFunc.name); // prints 'MyFunc' 
console.log(instance.name); // prints 'MyFunc'