javascript中new方法怎么使用

这篇文章主要介绍"javascript中new方法怎么使用"，在日常操作中，相信很多人在javascript中new方法怎么使用问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答"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) // xuedingeconsole.log(person.have) // catconsole.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) // xuedingeconsole.log(newPerson.have) // 20console.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) // undefinedconsole.log(person.have) // undefinedconsole.log(person.car) // leikesasiconsole.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) // xuedingeconsole.log(person.have) // catconsole.log(person) // Person{name: "xuedinge", age: "20"}

当返回值是普通对象时，跟没有返回值时，结果是一致的。

到此，关于"javascript中new方法怎么使用"的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注网站，小编会继续努力为大家带来更多实用的文章！