Skip to content

[js] 第134天 请写出如下代码运行的结果并解释为什么?[代码] #1122

Open
@haizhilin2013

Description

@haizhilin2013
Collaborator

第134天 请写出如下代码运行的结果并解释为什么?[代码]

    var type = 'images';
    var size = {width: 800, height: 600};
    var format = ['jpg', 'png'];

    function change(type, size, format){
        type = 'video';
        size = {width: 1024, height: 768};
        format.push('map');
    }

    change(type, size, format);

    console.log(type, size, format);

Activity

NicholasBaiYa

NicholasBaiYa commented on Aug 28, 2019

@NicholasBaiYa
type = 'images';
size = {width: 800, height: 600};
format = ['jpg', 'png', 'map'];

format : push会改变原数组;
type, size : 函数内部(函数声明是一个独立的代码块)改变的只是函数的参数值,不会影响到外部声明的变量。

LinStan

LinStan commented on Aug 28, 2019

@LinStan
images 
{width: 800, height: 600}
 ["jpg", "png", "map"]

type和size相当于局部变量更改值,但是不会影响全局环境下的type和size。
format的push方法是在数组尾部插入一个元素,改变了format

xxf1996

xxf1996 commented on Aug 28, 2019

@xxf1996

最后的打印结果为:images { width: 800, height: 600 } [ 'jpg', 'png', 'map' ]

实际上就是函数形参的传递根据实参值的类型分为值复制(对应基本类型)和引用复制(对应引用类型);

通过值复制的值无论怎么改变都不会影响原来的值(对应type变量的情况),而通过引用复制的值改变后原值也会改变(对应format变量的情况),但是直接改变引用本身并不会影响其他引用(即引用另一个引用类型的值时,原值的其他引用不会改变;对应size变量的情况);

参考:《你不知道的JavaScript(中卷)2.5小节》

yangshan010

yangshan010 commented on Aug 28, 2019

@yangshan010

images {width: 800, height: 600} ['jpg', 'png','map]

type 与size,在执行上下文中,因为是形参,活动对象会创建type、size两个属性,并被赋值,函数的参数,本质是传值。type与size在活动对象中,一开始被赋值 ‘images'、‘{width: 800, height: 600}’,后来又被重新改写,
不影响全局的变量,format 一开始初始化时,同sise、type,但是在format不是重新赋值操作,是在原来的基础上,修改了原数组。

zkh7809956

zkh7809956 commented on Aug 28, 2019

@zkh7809956

存储方式不同,值复制存储方式为堆,引用类型的为栈

mwangshuxin

mwangshuxin commented on Aug 28, 2019

@mwangshuxin

考察基础的题啊

haizhilin2013

haizhilin2013 commented on Aug 28, 2019

@haizhilin2013
CollaboratorAuthor

考察基础的题啊

来,看看你的理解呢。

kaixinfu

kaixinfu commented on Aug 28, 2019

@kaixinfu

type:基本数据类型,值传递,是不会变的;其他俩是引用赋值:size相当于1. var size; 2. size = {width: 800, height: 600};原来的引用没有变,format使用了push方法,push是会改变数组本身的

Konata9

Konata9 commented on Aug 28, 2019

@Konata9

这题与函数参数定义、传值、引用类型、作用域有关。

	var type = 'images'; // 基础类型
	var size = {width: 800, height: 600}; // 引用类型
	var format = ['jpg', 'png']; // 引用类型

	// js 以函数作为作用域,定义在函数内部的变量与外部的变量相互不影响
	function change(type, size, format){
		// 函数接受了三个参数,在函数生成上下文的时候,会先进行变量的声明和提升
		// 尽管与全局变量名称相同,但是是互不影响的

		// var type = type;
		// var size = size;
		// var format = format;

		// 对变量进行赋值
		// 由于作用域的关系,会先找到定义在 change 中的 type,而非全局的 type
		// 如果在 change 中没有定义过 type 即没有作为参数的话,则这么赋值会影响全局的 type
		type = 'video';

		// 同样对 change 内的 size 进行赋值,这里赋的是 size 的引用地址,实际与全局的 size 指向同一个对象
		// 所以如果进行了 size.dpi = 666 类似的操作,就会影响到全局的 size
		size = {width: 1024, height: 768};

		// format 是引用类型,因此指向的内存引用与全局的相同
		// 所以 push 方法会对全局的 format 产生影响
		format.push('map');
	}

	change(type, size, format);

	console.log(type, size, format);

	// 'images', {width:800, height:600}, ['jpg', 'png', 'map']
qhdxwdm

qhdxwdm commented on Aug 28, 2019

@qhdxwdm

type = 'image';
size = {width: 1024, height: 768};
format= ['jpg', 'png','map']

whitesky1225

whitesky1225 commented on Aug 29, 2019

@whitesky1225

说说size和format,在调用函数时,size和format都是引用复制的方式来传值,但是在调用赋值之后,函数 内的size被赋予了一个新的对象,是一个新的值的引用,并没有影响到全局size指向的值,所以size的值不变;而函数内的format和全局的format都指向同一个值,在函数内,format.push()对这个值进行了修改,所以指向这个值的全局format也会被改变。

yangguansen

yangguansen commented on Sep 4, 2019

@yangguansen

可以对比一下:如果去掉参数,就会是:
var type = 'images';
var size = {width: 800, height: 600};
var format = ['jpg', 'png'];

function change(){
type = 'video';
size = {width: 1024, height: 768};
format.push('map');
}

change();

console.log(type, size, format); //video {width: 1024, height: 768}  ["jpg", "png", "map"]

因为加了参数,就会有了引用的概念,再看上面的回答,就懂了

xiaoqiangz

xiaoqiangz commented on Jul 12, 2022

@xiaoqiangz

images ,

这题与函数参数定义、传值、引用类型、作用域有关。

	var type = 'images'; // 基础类型
	var size = {width: 800, height: 600}; // 引用类型
	var format = ['jpg', 'png']; // 引用类型

	// js 以函数作为作用域,定义在函数内部的变量与外部的变量相互不影响
	function change(type, size, format){
		// 函数接受了三个参数,在函数生成上下文的时候,会先进行变量的声明和提升
		// 尽管与全局变量名称相同,但是是互不影响的

		// var type = type;
		// var size = size;
		// var format = format;

		// 对变量进行赋值
		// 由于作用域的关系,会先找到定义在 change 中的 type,而非全局的 type
		// 如果在 change 中没有定义过 type 即没有作为参数的话,则这么赋值会影响全局的 type
		type = 'video';

		// 同样对 change 内的 size 进行赋值,这里赋的是 size 的引用地址,实际与全局的 size 指向同一个对象
		// 所以如果进行了 size.dpi = 666 类似的操作,就会影响到全局的 size
		size = {width: 1024, height: 768};

		// format 是引用类型,因此指向的内存引用与全局的相同
		// 所以 push 方法会对全局的 format 产生影响
		format.push('map');
	}

	change(type, size, format);

	console.log(type, size, format);

	// 'images', {width:800, height:600}, ['jpg', 'png', 'map']

正解

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    jsJavaScript

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @haizhilin2013@Konata9@xiaoqiangz@xxf1996@kaixinfu

        Issue actions

          [js] 第134天 请写出如下代码运行的结果并解释为什么?[代码] · Issue #1122 · haizlin/fe-interview