1.常用的方式就是Obj
export const A = {
a: 111,
b: 222,
c: () => { …… …… }
// d: () => { this.a …… …… }
}
const {a,b,c,d} = A;
- 适合用于当前页面的一些操作, 或者utils
d()这样会报错，因为里面的this都不知道指向谁
2.从上面方法中来解决this指向问题，那就用 class 来创建
export class A {
a=111;
b=222;
c=() => {…… ……};
d=() => { this.a …… …… }
}
let n = new A();
- 这种方法用
class构建,就不会报，this指向问题 - 用
new出来的实物，this它就指向n，n.d()可以调用this.a的数据 - wocao，但是我发包到npm, 我install安装调用时，老是报我一个感觉像是
loader的错误，我没搞好最终…… - 但在我本地
new它，调用是可以的，一定是哪里我没搞好
3. 还有一种就是直接用方法包方法，这也可以搞定this指向问题
export const A = () => {
let a=111;
let b=222;
let c=() => {…… ……};
let d=() => { a …… …… };
return {
a,b,c,d
}
}
const {a,b,c,d} = A();
- 在一个方法里声名的
变量和func, 调用时当然不需要使用this.xxx - 反正一个方法里
return出的变量都是，公用相互牵制的 - 最终我弄了一个这样的写法，
publish到npm上
4. 用构造函数, 解决this
export function A() {
this.a=111;
this.b=222;
this.c = () => {…… ……}
this.d = () => {this.a …… ……}
}
const T = new A();
T.d();
- 链接： www.jianshu.com/p/f9792fdd9…
- 构造函数，也可以称之类，构造函数就是类, 对构造函数使用
new运算符，就能生成实例，并且this变量会绑定在实例对象上 - 自动生成一个对象，
this指向这个新创建的对象，函数自动返回这个新创建的对象
5. Prototype 原型，继承来写
export function A() {
this.a=111;
this.b=222;
}
A.prototype.c = function() {…… ……}
A.prototype.d = function() {this.a …… ……}
const T = new A();
T.d();
- 每一个构造函数都有一个
prototype属性，指向另一个对象 - 对象的所有属性和方法，都会被构造函数的实例继承
- 属性写构造函数里面, 方法写原型里面
结语
前端react QQ群：
788023830----React/Redux - 地下老英雄前端交流 QQ群：
249620372----FRONT-END-JS前端（我们的宗旨是，为了加班，为了秃顶……，仰望大佬），希望小伙伴们加群一起学习
