javascript中的class类构造函数

javascript中的class类构造函数

一、函数存在变量提升，但是类不存在变量提升
二、函数受函数作用域限制，但是类受块级作用域限制

<script>
{function sayHello(){console.log("hello");}class say{}}console.log(say);sayHello();
script>

此时打印出say会报错，但是可以执行sayHello（）语句，当在一个函数中定义另一个函数的时候，此时在外部进行访问时，就会报错。这是因为函数的作用域是函数作用域。
三、使用变量名.name 来获取类构造函数的名称

<script>
let person = class Person{sayHello(){console.log("hello");}}let person_1 = new person();person_1.sayHello();console.log(person.name);
script>

此时可以获取类的名称。
四、当使用new来重新定义一个函数的时候，执行以下操作：
①在内存空间中来重新开辟一个地址
②将其中的constructor中的this执行该实例对象
③立即执行该constructor中的内容
五、当定义一个类构造函数，此时constructor函数中返回的是this，此时可以设置instanceof来判断这个实例是否属于该对象

<script>class Person{constructor(){this.foo = "ssss";return {name:"xxx"}}}let person_1 = new Person();console.log(person_1 instanceof Person);
script>

这里使用的是return一个对象，因为这个对象没有设置其指向，instanceof 就是错误的。
八、类和构造函数也是存在区别的：在使用new来声明一个新的实例对象时，如果构造函数不使用new来声明定义，则此时的this指向的是window对象，当类构造函数中的this不使用new来定义，则会出现报错

<script>class Person{constructor(){console.log(this);}}let person_1 = Person();// function Person(){//   console.log(this);// }// let person_1 =Person();
script>

九 、在类构造函数中都需要使用new来进行初始化实例对象，并且都指向最初的类构造函数

<script>
class Person{constructor() {this.name = "xsy";console.log("hello");}}let person_1 = new Person();let person_2 =new person_1.constructor();console.log(person_2);
script>

十、我们可以将类和构造函数进行比较，其实两者大致相同，可以这样理解：类是构造函数的封装
在类的constructor指向的是anonymous函数。
十一、类是javascript的一等公民，可以作为数组和函数参数传入其中。
十二、在类中的constructor函数中，当每次新建一个对象的时候，如果constructor函数中的属性为引用值属性，则会在每一个实例中重新创建一个，如果是原始值则将指针指向原来的值。

<script>class Person{constructor(){this.name = new String("jack");this.sayName =function(){console.log("我是dl");};this.arr = ['jack','luck'];}}let p1 = new Person();let p2 = new Person();console.log(p1.name === p2.name);console.log(p1.sayName === p2.sayName);console.log(p1.arr === p2.arr);
script>

十三、类方法是对象属性，因此可以使用字符串，符号，或者计算的值作为键

<script>const symbolKey = Symbol("symbolkey");class Person{[symbolKey](){console.log("invoked");}["LO" + "Ve"](){console.log("hh");}}let p1 = new Person();p1.LOVe();
script>

十四、类也可以设置访问器属性

<script>class Person{set name(value){this.name_ = value;}get name(){return this.name_;}}let p1 = new Person();p1.name = "dongli";console.log(p1.name);
script>

十五、静态类方法
定义在constructor中的变量或者函数，可以在每一个实例对象中查找，没有定义在constructor中的对象，在类的原型对象中查找。使用static定义的函数，在类本身上查找。

<script>class Person {constructor(name) {this.name_ = name;}sayName() {console.log("我是dl");}static hello() {console.log("sss");}}let p1 = new Person("xsy");  //既然是Person类上面的方法，不能使用参数传入Person.hello();p1.sayName();
script>

十六、可以在类的原型上添加方法

<script>
class Person{}Person.name = "dongli";Person.prototype.sayHello=function(){console.log("你好");}console.log(Person.prototype );
script>

十七、类的生成器方法

<script>
class Person{*func(){yield 1;yield 2;yield 3;}static *funcs(){yield "one";yield "two";yield "three";}
}
let p1 = Person.funcs();
console.log(p1.next().value);
console.log(p1.next().value);
console.log(p1.next().value);
console.log(p1.next());
script>

十八、设置迭代器接口

<script>
class Person{constructor(){this.nickName = ['jack','jcc','j-co'];}*[Symbol.iterator](){yield *this.nickName.entries();}
}
let p = new Person();
for(let [index,value] of p){console.log(index,value);
}
script>

<script>class Person{constructor() {this.arr = ["javascript",'数据结构与算法','lede'];}[Symbol.iterator](){return this.arr.entries();}
}
let p = new Person();
for(let [index,value] of p){console.log(value);
}
script>

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！