js中this[name]与this.name的区别

js学习过程中遇到个奇怪的问题，为什么使用this.name就会出现错误提示，但是this[name]就是正常的？
报错提示为：
Uncaught TypeError: methods.fun2 is not a function

    <script>
    Function.prototype.addMethod = function(name,fn){
        this[name] = fn;//这里用this.name就不行，为什么？
    };
    var methods = new Function();//没有{}
    methods.addMethod('fun2',function(){
        console.log("绿色污染");
    });
    methods.fun2();
    </script>

能详细解说下何时使用this.name何时使用this[name]吗？谢谢大圣

中括号法可以用变量作为属性名,而点方法不可以，中括号法可以用数字作为属性名,而点语法不可以，中括号法可以使用js的关键字和保留字作为属性名,而点语法不可以，这里的name是变量

这个一下子有点无从说起，说到哪算哪吧，
this.propName 等同于this["propName"]，注意有引号, []下标一般是数字和字符， 点号后面直接属性名，不加引号，比如：this."fun2" =fun（不合法）
在此处即this[name]即this["fun2"]与this.name的区别
function(name,fn){
this.name = fn; 此处this.name的name不是参数name的值，而是这个function即this的name属性，
而你的本意是，
this[name] =fn ，也即是 this.(name的值)即this.fun2 = fun
（运行态为：this.fun2=fn 或 this["fun2"]=fn)
}
另外函数是有 .name的，即函数名，只是
(new Function()）.name 是匿名函数的名称。

个人愚见，不知道讲清楚没

首先我觉得你的写法就有问题 为什么要用Function而不是 Object或者自定义类
如下 如[name] 调用this.fn() , name 调用 this.name
function Person(){
}

Person.prototype.addMethod = function(name,fn){
this.name = fn;
}

var person = new Person();
person.addMethod('fun2',function(){
console.log("绿色污染");
});
person.name();

function Person(){
}
Person.prototype.addMethod = function(name,fn){
this[name] = fn;
}

var person = new Person();
person.addMethod('fun2',function(){
console.log("绿色污染");
});
person.fun2();

另外解释下 你上面的例子为什么不行
按理说Function 继承 Object 上面的例子应该也能正常运行 但是Function是一个特俗的Object
Function.name 为 获取函数的名称。 参照https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype

如需运行上述例子 更换name为name1（但不建议这么写 ）
Function.prototype.addMethod = function(name,fn){
this.name1 = fn;//这里用this.name就不行，为什么？
};
var methods = new Function();//没有{}
methods.addMethod('fun2',function(){
console.log("绿色污染");
});
methods.name1();

中括号是引用属性，点是要先定义再使用吧

function(name,fn){this.name } 这里如果是电脑的话，会问参数name，和点后的name是不是一个，显然你会回答不是，所以，参数不要做特殊，实在不行，参数是xyz都行，不要有歧义