💎一站式轻松地调用各大LLM模型接口,支持GPT4、智谱、星火、月之暗面及文生图 广告
>[danger]**1. JS中的构造函数** >[info]js中一般申明一个函数,在外部new这个函数得到对象,这个函数就是js的构造函数,这个函数也可以成为类。 ```javascript function foo(){ console.log('Jack'); } //实例化这个js类 var ojb = new foo(); //调用这个类 ojb.func(); ``` >[danger]**2. this 和成员变量、成员方法** ~~~ function foo(name){ //定义成员变量 this.name = name; //定义成员方法 this.func = function(){ console.log(this.name); } } //实例化这个js类 var ojb = new foo('TOM'); //调用类里面的变量 console.log(ojb.name); //调用类里面的方法 ojb.func(); ~~~ >[info]*PS:this 当前使用的是哪个对象,那this就代表的是这个对象* >[danger]**3. 删除成员** 使用delete关键词删除类里面的变量 ~~~ function foo(){ this.age = 30; this.name = 'Jack'; this.addr = 'TOM'; this.func = function(){ console.log('HTEEL'); } } var ojb1 = new foo; var ojb2 = ojb1; //共用一个存储空间(地址赋值) delete ojb2.name; //删除成员变量 ojb2 = null; // ojb2 被删除,ojb1 不受影响 console.log(ojb1); console.log(ojb2); ~~~ >[danger]**4. 练习(使用类的方式设置DOM的CSS样式)** ~~~ function setStyle(){ this.css = function(ojb,stylename,stylevalue){ ojb.style[stylename] = stylevalue; //函数内设置style属性格式,用style[属性名]格式 return this; } } var div = document.querySelector('div'); var newstyle = new setStyle(); //实例化JS对象 newstyle.css(div,'background','red').css(div,'height','100px'); //连贯调用 ~~~