带不带protype的区别

Posted 晨落梦公子

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了带不带protype的区别相关的知识,希望对你有一定的参考价值。

总结写在前面:

  ①:带有protype:表示类的扩展,必须new后才能使用。

  ②:不带protype:属于静态方法,直接调用即可。

 

html代码:

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <script src="show.js"></script>
 7 </head>
 8 <body>
 9 <script src="main.js"></script>
10 </body>
11 </html>

protype:

show.js代码:

 1 window.meng = window.meng || {};
 2 (function () {
 3 
 4     function Show(name) {
 5         this._name=name;
 6     }
 7     Object.defineProperty(Show.prototype,"name",{
 8         get:function () {
 9             return this._name;
10         }
11     });
12     Show.prototype.showCloth=function () {
13       console.log(this.name+"穿着皮大衣");  
14     };
15 
16     meng.Show=Show;
17 
18 
19 })();

main.js代码:

1 (function () {
2    
3     var per=new meng.Show("meng");
4     per.showCloth();
5    
6 })();

效果:

  输出meng穿着皮大衣。

 

no protype:

show.js代码:

 1 window.meng = window.meng || {};
 2 (function () {
 3 
 4     function Show(name) {
 5         this._name=name;
 6     }
 7     Show.showName=function () {
 8       console.log("静态方法");
 9     };
10     
11     meng.Show=Show;
12 
13 
14 })();

main.js代码:

1 (function () {
2 
3     // var per=new meng.Show("meng");
4     // per.showCloth();
5 
6     meng.Show.showName();
7 })();

效果:

  输出:静态方法。

 

自己的认知:带有protype的扩展方法在js里面举足轻重,必须学会,而又常用。

      不带protype的静态方法,不喜欢用,感觉不符合面向对象的观念。

        但有时候用用也未尝不可。各有千秋吧。

        有某些特殊时候用了会有奇效。都记住吧。

以上是关于带不带protype的区别的主要内容,如果未能解决你的问题,请参考以下文章

new关键字创建对象带不带{}的区别

nodejs npm insttall 带不带-g这个参数的区别

用cp命令拷贝文件,源目录后带不带斜杠的区别

标准c库函数与Linux下系统函数库 区别 (即带不带缓冲区的学习)

nginx中配置proxy_pass详解,末尾带不带斜杠/的区别

QT中头文件带不带.h的问题