js变量解构赋值

目录

js的变量

第一种 局部变量(let)和全局变量(var)

第二种:常量复制(const)

变量赋值

数组解构

缺省数组解构

关于参数解构的应用

通过结构来获得方法的返回值

带默认参数的数组解构

对象解构

自定义对象解构

缺省的适配器模式

只取前几个值,后面的都储存在一个变量里面

对象赋值

对象给对象的赋值

复杂对象的解构


js的变量

  • 第一种 局部变量(let)和全局变量(var)

        {
			if (1==1) {
				//var是全局变量,即使出了这个创建的范围圈,他还是不会被销毁
				//建议少使用
				var i = 3;

				//let是局部变量,制作用与创建的范围域,出了方位就访问不到
				let b = 3;
				//3
				console.log(i);
				//3
				console.log(b);
			}
			//3
			console.log(i);
			// b is not defined
			console.log(b);
		}
  • 第二种:常量复制(const)

{
			//const常量
			const pr=3.14159265358979323846264338327950288479716939937510
			//这一行报错:Assignment to constant variable.
			//中文翻译:赋值给常变量报错
			pr = 3;
			console.log(pr);
		}

注意:const常量并不是一成不变的,在改const 修饰的是对象变量的情况下还是可以修改对象的属性值的,原因:基本数据类型的储存的是固定值属性,而对象属性储存的是内存地址,所以就算改变对象的属性值也是没有问题的,只要地址没变,该对象就还是原来的对象

变量赋值

解构赋值分为数组解构和对象解构

  • 数组解构


		{
			let a,b;
			[a,b]=[1,3];
			console.log(a,b);
		}
	
  • 缺省数组解构

{
			let a,b;
			[a,...b]=[1,3,4,5,6,7,8,9];
			console.log(a);
			console.log(b);
		}

在缺省参数的情况下用。。。代替除了第一个参数以外的所有参数

此时,数组的第一个参数的值会赋给a,其他的所有数字都会赋给b,b会成为一个数组

  • 关于参数解构的应用

{
			let a=23;
			let b =99;
			[a,b]=[b,a];
			console.log(a,b);
		}

本来a的值是32b是99,到那时通过下面的这一步就成功的将两个参数的值进行了交换

  • 通过结构来获得方法的返回值

{
			function ff(){
				return ["aa","bb","cc","dd"];
			}
			let a,b,c,d;
			[a,b,c,d]=ff();
			console.log(d,c,b,a);
		}

通过这个方法直接把返回的数据结构进行了赋值解析

  • 带默认参数的数组解构

{
			let a,b;
			[a,b=42]=[45];
			console.log(a,b);
		}

对象解构

自定义对象解构

缺省的适配器模式

{
			function ff(){
				return [88.7,"nvzhuang","yifu",45,"beizhu"];
			}

			let a,b;
			[a,,,,b]=ff();
			console.log(a,b);

		}

这种方式可以省去中间的所有的属性只要我们给了参数接受的属性

只取前几个值,后面的都储存在一个变量里面

这样在后面需要的时候还可以拿来用,后端传过来的值我们不就可以随便就把它销毁了

{
			function ff(){
				return [88.7,"nvzhuang","yifu",45,"beizhu"];
			}

			let a,b;
			[a,b,...c]=ff();
			console.log(a,b);
			console.log(c);
		}

对象赋值

对象给对象的赋值

{
			let Student ={name:"jin",age:18};

			let {name,age}=Student;
			console.log(name,age);
		}

这样的方法直接用一个新的对象,来接受了原来的对象的所有属性

复杂对象的解构

{
			let metaData={
				title:"DongGeZhengShiSheJian",
				content:[{title:"jin ri tou tiao",desc:"nei rong bu gao"}]
			}//后台返回的数据
			let {title:estitle,content:[{title:estitle2}]}=metaData;

			console.log(estitle,estitle2);
			//DongGeZhengShiSheJian jin ri tou tiao
		}

这个例子就是说明对象内部套对象,但是我们只要根据他的数据结构来进行接收也可以直接对他进行解析,

但是同名的属性的值不能跟原来的一样,就像外部有个title内部也有个title所以这两个属性进行接收的时候就不能

让他们的属性值的名字相同,假如没有同名的key名,是直接用原来的属性名就可以了,例如title就可以直接用户title

猜你喜欢

转载自blog.csdn.net/jinqianwang/article/details/82464081