在函数内部创建方法

Vla*_*iev 2 javascript methods optimization function

我正在尝试在函数内创建方法。我可以这样一种方式:

function sample() {};
sample.show = function() { alert() };
Run Code Online (Sandbox Code Playgroud)

而且我会看到警报电话sample.show();。但是出于代码美化的原因,我想将所有方法声明移到函数内部。我尝试过:

function sample() {
    sample.show = function() { alert() };
}
Run Code Online (Sandbox Code Playgroud)

但是我得到了:TypeError: Object function sample() has no method 'show' 我尝试过的另一种方法:

function sample() {
    this.show = function() { alert() };
}
function sample() {
    sample.prototype.show = function() { alert() };
}
function sample() {
    this.prototype.method = function show () { alert() };
}
Run Code Online (Sandbox Code Playgroud)

但是结果是一样的。我什至找不到关于在函数内部创建方法的任何信息。你能给我指出正确的方法吗?

UPD:我希望能够调用sample()也可以做一些事情的函数。因此,答案中尚无解决方案。

function sample() {
    this.show = function() { alert() };
    console.log('you called "sample()"');
}
sample(); // ==> you called "sample()"
Run Code Online (Sandbox Code Playgroud)

Pat*_*ans 5

第一次尝试:

function sample() {
    sample.show = function() { alert() };
}
Run Code Online (Sandbox Code Playgroud)

这只会在sample函数上创建“静态”方法,并且仅在执行后

console.log(sample.show);
//would show undefined on the console
sample();
console.log(sample.show);
//would then show the method definition as it has now been
//defined as a property of "sample"
Run Code Online (Sandbox Code Playgroud)

第二次尝试:

function sample() {
    this.show = function() { alert() };
}
Run Code Online (Sandbox Code Playgroud)

仅当您创建样本实例时,这才有效

console.log(sample.show);
//will print undefined as there is no property "show" on sample
sample();
console.log(window.show);
//will print the function, but since sample was executed without a
//context, show is created as a property of the global object
//in this case "window"
var d = new sample();
console.log(d.show);
//will print the function as we now have a instance of sample which
//show was made a property of
console.log(sample.prototype.show);
//will show undefined as you are not actually creating the "show" method
//on the constructor sample's prototype
Run Code Online (Sandbox Code Playgroud)

现在有了原型版本:

function sample() {
    sample.prototype.show = function() { alert() };
}
Run Code Online (Sandbox Code Playgroud)

之后,您将可以通过实例或从原型链访问“ show”方法,但是要使原型链调用正常工作,您至少必须先创建一个实例

console.log(sample.prototype.show);
//will print undefined as "show" has not been defined on the prototype yet
var d = new sample();
console.log(d.show);
console.log(sample.prototype.show);
//Both will now print the function because the method has been defined
Run Code Online (Sandbox Code Playgroud)

但是最后一个:

function sample() {
    this.prototype.method = function show () { alert() };
}
Run Code Online (Sandbox Code Playgroud)

根本无法使用,因为您无法直接从实例访问原型,一旦尝试创建实例,将收到未定义的错误。

为了使其正常工作,您必须遍历构造函数链来设置方法

function sample() {
    this.constructor.prototype.method = function show () { alert() };
    //is the same as doing
    sample.prototype.method = function show(){ alert() };
}
Run Code Online (Sandbox Code Playgroud)

因此,总体而言,要使您的“美化”工作正常进行,您必须sample首先直接调用第一个调用,或者通过为其他实例创建一个调用。