在项目中准确的使用解构赋值

解构赋值正确使用的形式
1.函数的参数
2.函数的返回值
3.变量交换
4.JSON应用
5.Ajax请求应用

//函数的参数  ---解构赋值
// const sum = arr =>{
	// 	let result = 0;
	// 	for(let i=0; i<arr.length;i++){
	// 		result += arr[i]
	// 	}
	// 	console.log(result)  //输出6
		const sum =([a,b,c]) =>{
		
		console.log(a+b+c)    //同样输出6
	}
	sum([1,2,3])
	
	//作为函数的返回值 ---解构赋值
	const foo = () =>{
		return {
			name:'张三',
			age:18
		}
	};
	const {name,age} = foo();
	console.log(name,age);  //输出张三  18
	
	
	//交换两个变量的值   ---解构赋值
	let a = 1; 
	let b = 2;
	[b,a] = [a,b];
	console.log('a:',a,'b:',b)   //输出a: 2 b: 1
	
	//JSON应用  ---解构赋值
	const json = '{"name1":"es","price":"200"}'
	let obj = JSON.parse(json)
	console.log(obj)
	const {name1,price} = JSON.parse(json)
	console.log(name1,price)   //输出es 200
	
	
	//Ajax请求应用   ---解构赋值
	axios.get('./data.json').then(({data:{name,type}})=>{
		console.log(name,type);  //输出es 前端
	})	

Ajax请求应用的时候添加一个json文件数据,在当前页面添加axios.js(Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 Node.js 中。)
官网:https://www.bootcdn.cn/axios/

posted @ 2021-12-10 11:39  小基狠努力啊  阅读(62)  评论(0编辑  收藏  举报