javascript中new的用法是什么
在JavaScript中,new运算符用于创建一个自定义对象实例,或者是一个构造函数内置对象的实例;new创建出来的实例可以访问构造函数Person内的属性。
本教程操作环境:windows10系统、javascript1.8.5版、Dell G3电脑。
javascript中new的用法是什么
new 的用途
new:new 运算符用于创建一个自定义对象实例,或者是一个构造函数内置对象的实例。啥意思呢,有点拗口,我们先看个栗子先。
new F() 时,发生了什么
第一版
栗子在这:
function Person(name, age) { this.name = name this.age = age console.log(this) // Person{name: "xuedinge", age: "20"} } Person.prototype.have = "cat" const person = new Person("xuedinge", "20") console.log(person.name) // xuedinge console.log(person.have) // cat console.log(person) // Person{name: "xuedinge", age: "20"}
从这个栗子中,我们可以看到,new 具有以下能力:
1、new 创建出来的实例可以访问构造函数Person内的属性;
2、new 创建出来的实例可以访问构造函数原型上的属性;
3、new 可以将构造函数中的this绑定到新创建出来的对象上;
那我们就先针对new的这三个能力先实现一下:
function fakeNew(Fn) { // 创建一个空对象 let obj = new Object() // 将新对象的原型指针指向构造函数的原型 obj.__proto__ = Fn.prototype // 处理除了 Fn 以外的剩余参数 Fn.apply(obj, [].slice.call(arguments, 1)) return obj }
看下效果
function Person(name, age) { this.name = name this.age = age console.log(this) // Person {name: "xuedinge", age: "20"} } Person.prototype.have = "cat" function fakeNew(Fn) { // 创建一个空对象 let obj = new Object() // 将新对象的原型指针指向构造函数的原型 obj.__proto__ = Fn.prototype // 处理除了 Fn 以外的剩余参数 Fn.apply(obj, [].slice.call(arguments, 1)) return obj } const newPerson = fakeNew(Person, "xuedinge", "20") console.log(newPerson.name) // xuedinge console.log(newPerson.have) // 20 console.log(newPerson) // Person {name: "xuedinge", age: "20"}
看样子跟new的能力比较相像了。但是当构造函数里有返回值时,是怎么样子的呢,再看个:
// 当返回值是对象时: function Person(name, age) { this.name = name this.age = age console.log(this) // Person {name: "xuedinge", age: "20"} return { car: "leikesasi" } } Person.prototype.have = "cat" const person = new Person("xuedinge", "20") console.log(person.name) // undefined console.log(person.have) // undefined console.log(person.car) // leikesasi console.log(person) // {car: "leikesasi"}
可以看出,当构造函数有返回值是对象时,new创建的实例对象就是构造函数返回的结果,当返回值是普通对象时呢,看下面这个:
// 当返回值是普通值时: unction Person(name, age) { this.name = name this.age = age console.log(this) // Person{name: "xuedinge", age: "20"} return "leikesasi" } Person.prototype.have = "cat" const person = new Person("xuedinge", "20") console.log(person.name) // xuedinge console.log(person.have) // cat console.log(person) // Person{name: "xuedinge", age: "20"}
当返回值是普通对象时,跟没有返回值时,结果是一致的。
相关推荐:javascript学习教程
以上就是javascript中new的用法是什么的详细内容,更多请关注php中文网其它相关文章!
下一篇:有哪些听音乐的小程序
免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。
☉本站的源码不会像其它下载站一样植入大量的广告。为了更好的用户体验以后坚持不打水印
☉本站只提供精品织梦源码,源码在于可用,不在多!!希望在这里找到你合适的。
☉本站提供的整站织梦程序,均带数据及演示地址。可以在任一源码详情页查看演示地址
☉本站所有资源(包括源码、模板、素材、特效等)仅供学习与参考,请勿用于商业用途。
☉如有其他问题,请加网站客服QQ进行交流。