美文网首页
Javascript new 对象的过程

Javascript new 对象的过程

作者: LenHong | 来源:发表于2020-04-10 11:06 被阅读0次

首先看一下下面的代码

function User(name , age, career) {
    this.name = name
    this.age = age
    this.career = career 
}
const user = new User('ryan', 19, 'fe')
console.log(user)  // {name: "ryan", age: 19, career: "fe"}
function newUser(name , age, career) {
  return {
    name,
    age,
    career ,
  }
}
const newuser = newUser('ryan', 19, 'fe')
console.log(newuser)  // {name: "ryan", age: 19, career: "fe"}

想想这两种获取对象的方式有什么不同?

再看看下面的代码

function User(name , age, career) {
    this.name = name
    this.age = age
    this.career = career 
}
User.prototype.sayName = function () {
    console.log("Hello")
}
const user = new User('ryan', 19, 'fe')
console.log(user)  // {name: "ryan", age: 19, career: "fe"}
user.sayName() // Hello
function newUser(name , age, career) {
  return {
    name,
    age,
    career ,
  }
}
newUser.prototype.sayName = function () {
    console.log("Hello")
}
const newuser = newUser('ryan', 19, 'fe')
console.log(newuser)  // {name: "ryan", age: 19, career: "fe"}
newuser.sayName() // Uncaught TypeError: newuser.sayName is not a function

看到这里是不是感觉好像明白了什么

new 的过程和普通的函数返回不同,new 其实是一种继承的方式, 通过new,实例与构造函数通过原型链连接了起来出来,所以实例能访问到构造函数的属性,具体过程如下

  1. 开辟一个块内存,创建一个空对象
  2. 执行构造函数,对这个空对象进行构造
  3. 给这个空对象添加proto属性
  __proto__ = User.prototype  

相关文章

  • Javascript new 对象的过程

    首先看一下下面的代码 想想这两种获取对象的方式有什么不同? 再看看下面的代码 看到这里是不是感觉好像明白了什么 n...

  • JavaScript 纯粹对象

    JavaScript 纯粹对象1、定义:通过 "{}" 或者 "new Object" 创建的对象,像new Da...

  • js内置对象

    在JavaScript中,一切都是对象或者可作为对象处理。 JavaScript内置对象:1,本地对象(通过new...

  • 日期对象-Date

    1、创建Date对象 在JavaScript中,创建日期对象必须使用“new语句”。使用关键字new新建日期对象时...

  • JavascriptDate

    JavaScript Date Date 对象 Date 对象用于处理日期与时间。 创建 Date 对象: new...

  • JS事件循环机制

    javascript 是单线程。 new Promise() // new 一个对象瞬间执行的, .then 是异...

  • 2018-05-18 原型链

    1:普通对象与函数对象 JavaScript分为普通对象和函数对象,通过new Function创建的对象都是函数...

  • JavaScript基础之创建对象

    JavaScript对象的创建 在JavaScript中创建一个对象有三种方式。可以通过对象直接量、关键字new和...

  • HTML+JS动态获取当前时间

    效果图: JavaScript 中 Date 对象 创建 Date 对象的语法: var myDate=new D...

  • JavaScript new 关键字

    new 关键字 在JavaScript中, new 关键字用来创建一个类(模拟类)的实例对象。 实例化对象之后, ...

网友评论

      本文标题:Javascript new 对象的过程

      本文链接:https://www.haomeiwen.com/subject/suxqictx.html