# JS 讀書會解答

## 題目 1

// 執行環境
var father = 1
function foo (x) {
	var sister = x * 4
	function bar (y) {
		var brother = y * sister 
		return brother
	}
	return bar(sister)
}

console.log(foo(father))
console.log(brother)

### 解答

16
brother is not defined

### 詳解

var father = 1  // 定義 father = 1
function foo (x) { // x = father = 1
	var sister = x * 4 // sister = 1 * 4 = 4
	function bar (y) { // y = sister = 4
		var brother = y * sister  // brother = 4 * 4 = 16
		return brother // 回傳 brother = 16
	}
	return bar(sister) // 呼叫 function，傳 sister 的值進去
}

console.log(foo(father)) // 呼叫 function，傳 father 的值進去
console.log(brother) // brother 是函式變數，所以全域裡面呼叫不到 brother

### 執行順序(參考用)

var father = 1
console.log(foo(father))
function foo (1) {
	var sister = 1 * 4
	function bar (4) {
		var brother = 4 * 4 
		return 16
	}
	return bar(4)
}
console.log(brother)

## 題目 2

// 展開運算元 | 其餘運算子

function pilicapililala( { name, question, bad, ...rest } ) {
		console.log(`/${name}問 =`, question)
		console.log(`/${name}壞 =`, bad)
		console.log(`/${name}不行 =`, rest.nono)
		const bigACE = {name: name, dream: `我長大嚕，我已經${rest.age + 1}歲了`}
		return  bigACE 
}

const ace = {
	name: 'ace',
	age: 27,
	city: '高雄',
	question: '我是不是都不知道我在問什麼',
	bad: '一人一信，告訴他媽媽',
	nono: '不行跟阿母講'
} 

const { name, dream, ...rest} = pilicapililala(ace)
console.log(name)
console.log(dream)
console.log(rest)

const bobolinababaludo = {
	...ace,
	bad: '對呀～～～ ace壞壞 騙騙仔！哈哈哈'
}

console.log(ace)
console.log(bobolinababaludo)

### 解答

/ace問 = 我是不是都不知道我在問什麼
/ace壞 = 一人一信，告訴他媽媽
/ace不行 = 不行跟阿母講
ace
我長大嚕，我已經28歲了
{}
{
	name: 'ace',
	age: 27,
	city: '高雄',
	question: '我是不是都不知道我在問什麼',
	bad: '一人一信，告訴他媽媽',
	nono: '不行跟阿母講'
} 
{
	name: 'ace',
	age: 27,
	city: '高雄',
	question: '我是不是都不知道我在問什麼',
	bad: '一人一信，告訴他媽媽',
	nono: '不行跟阿母講',
	bad: '對呀～～～ ace壞壞 騙騙仔！哈哈哈'
} 

### 詳解

// 展開運算元 | 其餘運算子

function pilicapililala( { name, question, bad, ...rest } ) { 
    // ...rest 會是剩餘物件，所以 rest = { age: 27, city: '高雄', nono: '不行跟阿母講' }
		console.log(`/${name}問 =`, question) // name = 'ace', question = '我是不是都不知道我在問什麼'
		console.log(`/${name}壞 =`, bad) // name = 'ace', bad = '一人一信，告訴他媽媽'
		console.log(`/${name}不行 =`, rest.nono) // name = 'ace', rest.nono = '不行跟阿母講'
		const bigACE = {name: name, dream: `我長大嚕，我已經${rest.age + 1}歲了`} // rest.age = 27
		return  bigACE // bigACE = {name: 'ace', dream: `我長大嚕，我已經28歲了`}
}

const ace = {
	name: 'ace',
	age: 27,
	city: '高雄',
	question: '我是不是都不知道我在問什麼',
	bad: '一人一信，告訴他媽媽',
	nono: '不行跟阿母講'
} 

const { name, dream, ...rest} = pilicapililala(ace) 
// 呼叫 function，傳 ace 的值進去
// 這時候的 function 已經回傳 bigACE 這個物件了
// bigACE = {name: 'ace', dream: `我長大嚕，我已經28歲了`}
// name = 'ace', dream = '我長大嚕，我已經28歲了'
// rest 是剩餘參數，這時候已經沒有剩下的參數，所以會是空物件
console.log(name) // name = 'ace'
console.log(dream) // dream = '我長大嚕，我已經28歲了'
console.log(rest) // rest = {}

const bobolinababaludo = {
    // 相同的參數可以直接用 ...參數 的方式直接引入進來
    // 這對於物件或陣列的操作非常實用
	...ace, // 原本的 ace 物件
	bad: '對呀～～～ ace壞壞 騙騙仔！哈哈哈' // 加上 bad 這個 key & value 
}

console.log(ace)
console.log(bobolinababaludo)

### 執行順序(參考用)

const ace = {
	name: 'ace',
	age: 27,
	city: '高雄',
	question: '我是不是都不知道我在問什麼',
	bad: '一人一信，告訴他媽媽',
	nono: '不行跟阿母講'
}
const { name, dream, ...rest} = pilicapililala(ace)
function pilicapililala( { name, question, bad, ...rest } ) {
		console.log(`/${name}問 =`, question)
		console.log(`/${name}壞 =`, bad)
		console.log(`/${name}不行 =`, rest.nono)
		const bigACE = {name: name, dream: `我長大嚕，我已經${rest.age + 1}歲了`}
		return  bigACE 
}
console.log(name)
console.log(dream)
console.log(rest)

const bobolinababaludo = {
	...ace,
	bad: '對呀～～～ ace壞壞 騙騙仔！哈哈哈'
}

console.log(ace)
console.log(bobolinababaludo)