2、new关键字、继承、堆栈、深拷贝、浅拷贝

已于 2024-02-25 19:24:58 修改
阅读量529 收藏 5
点赞数 4
文章标签： javascript 开发语言 ecmascript
于 2024-02-22 19:47:07 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/m0_58779986/article/details/136242050
版权

一、new关键字的底层原理

1、new关键字的作用

  • 实例化一个对象返回一个新对象
  • 让构造函数中的this指向实例化对象

2、new关键字的底层原型

  • var p1 = {} 创建了新对象，开辟内存空间
  • Person.call(p1)通过call方法改变函数Person中的this指向，指向实例兑现p1
  • p1.__proto__==Person.prototype p1的指针指向构造函数原型，地址相同，属性和方法都能继承

二、原型的指向是否可以改变

function Animal() { }
Animal.prototype.name = "小狗"

function Dog() { }
Dog.prototype.color = "金毛"
Dog.prototype = new Animal()

console.log(Animal.prototype.constructor == Animal)//true
console.log(Dog.prototype.constructor == Dog);//false
console.log(Dog.prototype.constructor == Animal);//true

三、3种继承

  • 原型继承、构造方法继承(call方法继承)、拷贝继承

1、原型继承

  • 目的：让学生对象(子类)继承人对象(父类)的属性和方法，相当于继承人的构造函数和原型中的属性和方法
//1、人的构造函数
function Person(name){
	this.name = name
	this.work = function () {
	console.log(this.name + "热爱工作")
	}
}
//2、人的原型
Person.prototype.age = 26
Person.prototype.playCode = function (){
	console.log(this.name + "喜欢敲代码")
}
//3、学生的构造函数
function Student(sex) {
	this.sex = sex
	this.eat = function () {
	 console.log(this.name + "喜欢吃零食")
	}
}
//----------------必须要写在子类的原型的上面-----------------
Student.prototype = new Person("小明")

//4、学生的原型
Student.prototype.className = "web前端"
Student.prototype.learn = function () {
	console.log(this.name + "喜欢学习")
}
//
console.log(Student.prototype.constructor == Preson)//true
var stu = new Student("男生")

//1、学生构造函数中的属性和方法
console.log(stu.sex)//男生
stu.eat()//小明喜欢吃零食
//2、学生原型中的属性和方法
console.log(stu.className)//web前端
stu.learn()//小明喜欢学习
// 3、人构造函数中的属性和方法
console.log(stu.name)//小明
stu.work()//小明热爱工作
// 4、人原型中的属性和方法
console.log(stu.age)//26
stu.playCode()//小明喜欢敲代码

2、构造继承（call方法继承）

//1、人的构造函数
function Person(name, age) {
    this.name = name
    this.age = age
    this.work = function () {
        console.log(this.name + "热爱工作")
    }
}
//2、人的原型
Person.prototype.sex = "男生"
Person.prototype.basketball = function () {
     console.log(this.name + "喜欢打篮球")
}
//3、学生的构造函数
//---------注意----------------
function Student(score, x, y) {
    this.score = score
    this.study = function () {
        console.log(this.name + "喜欢学习")
    }
//Student构造函数中的this指向实例化对象stu，stu对象有Student属性--------------
//stu==this
    Person.call(this, x, y)
}
Student.prototype = new Person()
//4、学生的原型
Student.prototype.className = "web31"
Student.prototype.playCode = function () {
    console.log(this.name + "喜欢敲代码");
}
//---------注意----------------
var stu = new Student(100, "小花", 18)
// var p1 = new Person("小花",18)

// 1、学生构造函数中的属性和方法
console.log(stu.score)
stu.study(
// 2、学生原型中的属性和方法
console.log(stu.className)
stu.playCode()
// 3、人员构造函数中的属性和方法
console.log(stu.name)
console.log(stu.age)
stu.work()
// 4、人员原型中的属性和方法
console.log(stu.sex)
stu.basketball()

3、拷贝继承

//人的构造函数
function Person(name) {
    this.name = name
    this.work = function () {
        console.log(this.name + "热爱工作");
    }
}
//人的原型
Person.prototype.age = 26
Person.prototype.code = function () {
    console.log(this.name + "喜欢敲代码");
}
//学生的构造函数
function Student(sex) {
    this.sex = sex
    this.eat = function () {
        console.log(this.name + "喜欢吃零食")
    }
}
//学生的原型
Student.prototype.className = "web前端"
Student.prototype.study = function () {
    console.log(this.name + "喜欢学习");
}

var stu = new Student("男生")
var p = new Person("小明")
//-------------主要代码主要代码----------
for (x in p) {//循环父类
    stu[x] = p[x]
}

// 1、学生构造函数中的属性和方法
console.log(stu.sex)//男生
stu.eat()//小明喜欢吃零食
// 2、学生原型中的属性和方法
console.log(stu.className)//web前端
stu.study()//小明喜欢学习
// 3、人员构造函数中的属性和方法
console.log(p.name);//小明
p.work()//小明热爱工作
// 4、人员原型中的属性和方法
console.log(p.age);//26
p.code()//小明喜欢敲代码

四、堆栈

JavaScript的变量存储方式：栈(stack)和堆(heap)

  • 1、栈：自动分配内存空间，系统自动释放，里面存放的是基本类型和引用类型的地址

  • 2、堆：动态分配的内存，大小也不定，也不会自动释放。里面存放引用类型的值

    image-20240222154456005

五、深拷贝与浅拷贝(引用类型)

  • 基本类型：简单的数据段—栈 传值
  • 引用类型：可能有多个值 传址
    地址(引用、指针)—栈
    值—堆
    栈中的地址指向堆中的值

1、浅拷贝

  • 会影响原来的值

数组的浅拷贝

var arr1 = [1,2,3]
var arr2 = arr1
console.log(arr2)//[1,2,3]
arr2.push(4)
console.log(arr2)//[1,2,3,4]
console.log(arr1)//[1,2,3,4]

对象的浅拷贝

var obj1 = {
	name: "小明",
	age: 18,
}
var obj2 = obj1
obj2.sex = "男生"
console.log(obj2);//{name: '小明', age: 18, sex: '男生'}
console.log(obj1);//{name: '小明', age: 18, sex: '男生'}

2、深拷贝

  • 不会影响原来的值

数组的深拷贝

// 1、for循环
var arr3 = [1,2,3]
var arr4 = []
for(var i = 0;i < arr3.length; i++){
	arr4.push(arr3[i])
}
console.log(arr4)//[1,2,3]
arr4.push(4)
console.log(arr4)//[1,2,3,4]
console.log(arr3)//[1,2,3]

//2、slice
var arr1 = [1,2,3]
var arr2 = arr1.slice(0)
arr2.push(5)
console.log(arr2);//[1,2,3,5]
console.log(arr1);//[1,2,3]

//3、concat()
var arr1 = [1,2,3]
var arr2 = arr1.concat()
console.log(arr2)//[1,2,3]
arr2.push(6)
console.log(arr2)[1,2,3,6]
console.log(arr1)[1,2,3]

对象的深拷贝

//1、for循环
var obj1 = {
	x: 1,
	y: 2,
}
var obj2 ={ }
for(x in obj1) {
	obj2[x] = obj1[x]
}
console.log(obj2);//{x: 1, y: 2}
obj2.z = 3
console.log(obj2);//{x: 1, y: 2, z: 3}
console.log(obj1)//{x: 1, y: 2}

六、练习

var fun = function () { }
fun.prototype = {
    name: 'peter',
    age: 25
}
var a = new fun();
var b = new fun();
console.log(a.name, b.name);//peter peter
fun.prototype.name = 'jack';
console.log(a.name, b.name);//jack jack
// console.log(a.__proto__ == fun.prototype); true
fun.prototype = {};
// console.log(a.__proto__ == fun.prototype); false  因为fun的原型为空  a的原型指针不变
fun.prototype.name = 'tom';console.log(a.name, b.name);//jack jack
b.constructor.prototype.name = 'kitty';

function A() {}
function B(a) {
    this.a = a;
}
function C(a) {
    if (a) {
        this.a = a;
    }
}
A.prototype.a = 1;
B.prototype.a = 1;
C.prototype.a = 1;
console.log(new A().a);//1
console.log(new B().a);//undefined
console.log(new C(2).a);//2
console.log(new C(0).a);//1

//方法没有会报错  属性没有 undefined
var F = function () {
}
Object.prototype.a = function () {
    console.log('a()')
}
Function.prototype.b = function () {
    console.log('b()')
}
var f = new F()
f.a()//a()  构造函数没有   F没有原型   Object有
f.b()//报错   构造函数没有    F没有原型  Object没有.b  会报错
F.a()//a() 没构造函数  有原型   Object有
F.b()//b()

var P = function () { }
P.prototype.aaa = function () {
    alert("ddd")
}
var a = new P();
var num = 10;//v ar  num = new Number(10)
console.log(P.__proto__ == Function.prototype);//true
console.log(P == a.constructor);//true
console.log(a.__proto__ == P.prototype);//true
console.log(P.prototype.__proto__ == Object.prototype);//true
console.log(a.prototype);//undefined
console.log(Number.__proto__ == Function.prototype);//true
console.log(Number.prototype == num.__proto__);//true
console.log(Function.__proto__ == Function.prototype);//true
console.log(Function.prototype == P.__proto__);//true
console.log(Function.prototype.__proto__ == Object.prototype);//true
console.log(Object.__proto__ == Function.prototype);//true
console.log(Object.prototype.__proto__ == null);//true
Python核心编程之序列下篇
LYX_WIN
12-08 1232
难道它们 的名字现在不应该都是'jane'了吗?正如我们在本章的开头所讨论的,无论 list()还是 tuple()都不可能做完全的转换(见 6.1.2 节).也就是说,你传给 tuple()的一个列表对象不可能变成一个元组,而你传给 list()的 对象也不可能真正的变成一个列表.虽然前后两个对象(原来的和新的对象)有着相同的数据集 合(所以相等 == ),但是变量指向的却不是同一个对象了(所以执行 is 操作会返回 false).还 要注意,即使它们的所有的值都相同,一个列表也不可能"等于"一个元组.
C/C++常见面试题（三）
发狂的小花的博客
12-20 1372
宏定义中的两个##符号是连接运算符，在预处理阶段用于将两个标识符（identifier）连接在一起形成一个新的标识符。这种操作称为标识符的拼接（token concatenation）。// 将a和b拼接成abreturn 0;在上述代码中，CONCAT宏定义使用了##连接运算符，将传入的参数a和b进行拼接。在printf()语句中，我们通过将a和b拼接成了ab，最终输出结果为10。
js new关键字
weixin_30216561的博客
05-28 126
要创建构造函数的实例，肯定要使用到new关键字，但是，到底需要哪些过程呢？ 我们以下面为例，首先创建一个构造函数 function dog(){ this.name='happy' } 接下来我们分步骤来解析创建实例的过程： 1.首先，需要创建一个空对象 var obj={} 2.接下来我们需要把obj的__proto__属性指向构造函数的prototype, obj.__p...
关键字 NEW
oszcoszc的专栏
01-10 280
新引入的 New 子句可以创建一个新的对象实例，或者指定对某个类型参数的构造函数约束。 备注 在类型参数列表中，New 约束指定所提供的类型必须公开可访问的无参数构造函数。有关类型参数和约束的更多信息，请参见类型列表。 在声明或赋值语句中，New 子句必须指定一个可从中创建实例的已定义类。这意味着该类必须公开调用代码可以访问的构造函数。 可以在声明语句或赋值语句中使用 New 子句。该语句
new 关键字
最新发布
weixin_50600749的博客
09-25 393
否则一般都是在栈上存储。
new关键字~
东北玛丽的优快云
02-28 817
作用：通过调用构造函数创建对象 new关键字的执行过程： ① 在内存中创建了一个空的Object类型的对象（看不见） ② 让this关键字指向这个空的对象（看不见） ③ 通过this给这个对象添加属性和方法（看的见） ④ 将对象 返回给用new关键字调用构造函数的 调用者(看不见) 备注：Object在JS中是祖宗类（构造函数），所有不同类型的对象，都直接或间接的继承于它 ...
js new关键字详解
灰太狼-铜豌豆的博客
11-21 3329
和其他高级语言一样javascript中也有new关键字，我们以前认知的new是用来创建一个类的实例对象，但在js中万物皆是对象，为何还要new关键字呢，其实js中new关键字不是用来创建一个类的实例对象，而是用于继承。 接下来，本文将带你一起来探索JS中new的奥秘... 1 2 3 4 5 6 7 8 9
Java高频面试基础问题与知识点整理
热门推荐
张彦峰的博客
11-04 171万+
Java高频面试知识点总结：覆盖高频基础知识考点+高频集合知识点深入分析+高频多线程与并发编程面试题汇总+其他扩展考察等。
C/C++面试宝典2024版(最新版)
学无止尽，谨言慎行！
04-02 3万+
面试基础前言new、delete、malloc、free关系delete与 delete []区别C和C++ 的共同点？不同之处？继承的优缺点C++有哪些性质（面向对象特点）子类析构时要调用父类的析构函数吗？多态，虚函数，纯虚函数求下面函数的返回值（微软）什么是“引用”？申明和使用“引用”要注意哪些问题？将“引用”作为函数参数有哪些特点？在什么时候需要使用“常引用”？将“引用”作为函数返回值类型的...
C++ 随笔二 拷贝构造 虚函数（多态）引用
weixin_42649617的博客
04-01 817
一、C++为何复杂 C++提供了更多的内存模型。第一种就是提供了太多的可以放对象的地方，如堆栈中、栈中、全局数据区里面。第二种就是提供了太多可以访问对象的方式，直接访问、指针访问、引用访问。 JAVA的内存模型要简单很多，所有对象都只能放在堆里面，然后只有一种方式去访问那个对象，就是通过引用。（当然，也可以说成是指针。但因为JAVA只有一种方式去访问，所以就把星号去掉，然后JAVA开发者和别人说...
C#中New关键字的三种用法
游子的博客
03-26 9778
三种用法如下： 　　在 C# 中，new 关键字可用作运算符、修饰符或约束。 　　1）new 运算符：用于创建对象和调用构造函数。这种大家都比较熟悉，没什么好说的了。 　　2）new 修饰符：在用作修饰符时，new 关键字可以显式隐藏从基类继承的成员。 　　3）new 约束：用于在泛型声明中约束可能用作类型参数的参数的类型。 　　关于第二种用法看下例： 　　
C++new关键字
weixin_49891405的博客
03-02 687
【代码】C++new关键字。
new关键字介绍
wanghao312的博客
04-11 552
在C++中，new关键字用于动态分配内存，它允许程序在运行时请求内存。当使用new分配内存时，会调用构造函数来初始化该内存，使其成为相应类型的对象。成功分配后，new返回一个指向该分配内存的指针。
第六十一课.new关键字
xuenixiang.com
02-23 157
我们在代码里写下关键字new，并在new之后跟上之前定义好的类: MyClass myClass = new MyClass();   这个关键字new，也在这个时候被虚拟机解析到了，并且在虚拟机识别到new关键字之后就会使用虚拟机提供的new指令去创建所指定的对象。它会大致经历如下过程：   校验。检查这个指令的参数是否能在常量池中定位到一个符号引用，并检查这个符号引用代表的类是否已...
前端必备知识——new 关键字
m0_69853343的博客
01-02 1069
会暂停函数的执行，直到等待的 Promise 对象的状态变为解决状态，并返回解决结果。前端开发中经常可以看见 const aa = new xxx ，aa是对象，那么 new后面跟的 xxx指的是什么？关键字声明一个函数，该函数将返回一个 Promise 对象。执行构造函数的代码：调用构造函数，并传入相应的参数，以初始化对象的属性和状态。设置对象的原型链：新创建的对象会继承构造函数的原型对象。是一个包含响应数据的普通对象，而不是一个Promise对象。关键字指向新创建的对象，使得构造函数可以操作新对象。
用关键字new创建对象 new都做了什么（随笔）
但愿人长久 千里共婵娟
04-09 9533
深入讨论new操作符创建新实例对象的过程。
C++ new关键字详解
希望能帮助大家，希望大家多多支持，你们的支持是我前进的动力。
12-17 2万+
一.new的基本用法 1.c++通过new关键字进行动态分配内存。 2.new开辟的空间存储在堆上，而我们定义的变量存储在栈上。 3.new分配的空间使用delete释放，new[] 使用 delete[]。 4. int* pi = new int(5);//表示动态分配一个int ，初始化为 5 int* pa = new int[5];//表示动态分配一个数组，数组大小为5 ...
new关键字的作用和底层原理
m0_51496828的博客
03-07 725
一、new关键字的作用 1、实例化对象，返回一个新对象 2、让构造函数中的this指向实例化对象 二、new关键字的底层原理 1、创建了新对象，开辟内存空间，地址存在栈中，数值存在堆中 2、通过call()方法改变构造函数中this的指向，指向实例化对象 3、实例化对象的指针指向构造函数的原型，地址相同，属性和方法都能继承
【C++】C++中的new关键字用法详解
qq_35902025的博客
04-26 4万+
C++new用法详解
计算机面试必备：操作系统、C++与设计模式解析
以及面向对象编程的关键概念，如构造函数、虚函数、静态成员函数、拷贝构造与赋值运算符、列表初始化、多态、静态绑定与动态绑定、`explicit`、`mutable`、`volatile`、`internal`关键字、继承、堆栈溢出、重载操作...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值