> For the complete documentation index, see [llms.txt](https://ayugioh2003.gitbook.io/free-code-camp-practice/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://ayugioh2003.gitbook.io/free-code-camp-practice/front-end-development-certification/object-oriented-and-functional-programming.md).

# Object Oriented and Functional Programming

1-Declare JavaScript Objects as Variables

```javascript
var car = {
  "wheels":4,
  "engines":1,
  "seats":5
};

var motorBike = {
  "wheels":3,
  "engines":1,
  "seats":2,

  // Only change code below this line.

};
```

2-Construct JavaScript Objects with Functions

* 構造函數通常第一個字大寫，用來區分一般函數
* this 指向創建出來的對象

```javascript
var Car = function() {
  this.wheels = 4;
  this.engines = 1;
  this.seats = 5;
};

// Only change code below this line.

var MotorBike = function() {
  this.engines=1;
  this.wheels=2;
  this.seats=2;
};
```

3-Make Instances of Objects with a Constructor Function

* 用 `new function()` 來創建一個實力 instance

```javascript
var Car = function() {
  this.wheels = 4;
  this.engines = 1;
  this.seats = 5;
};

// Only change code below this line.

var myCar = new Car();
myCar.nickname = "Chacha";
```

4-Make Unique Objects by Passing Parameters to our Constructor

```javascript
var Car = function(wheels, seats, engines) {
  //Change this constructor
  this.wheels = wheels;
  this.seats = seats;
  this.engines = engines;
};

//Try it out here
var myCar = new Car(2, 2, 1) ;
```

5-Make Object Properties Private

* 建構函數內，自己的函數稱為方法，自己的特徵稱作屬性(忘了)
* 讓私有資料只能透過方法存取

```javascript
var Car = function() {
  // this is a private variable
  var speed = 10;

  // these are public methods
  this.accelerate = function(change) {
    speed += change;
  };

  this.decelerate = function() {
    speed -= 5;
  };

  this.getSpeed = function() {
    return speed;
  };
};

var Bike = function() {

  // Only change code below this line.
  var gear = 2;

  this.getGear = function(){
    return gear;
  };

  this.setGear = function(change){
    gear = change;
    return gear;
  };

};

var myCar = new Car();

var myBike = new Bike();
myBike.getGear(3);
```

6-Iterate over Arrays with map

* 有點詭異的迴圈
* .map() 括號中是個 callback function
* 第一個參數是處理的元素，第二個是 index，第三個是陣列
* 好吧其實我看不太懂
* <https://developer.mozilla.org/zh-TW/docs/Web/JavaScript/Reference/Global_Objects/Array/map>
* <http://fred-zone.blogspot.tw/2017/01/javascript-mapreduce.html>

```javascript
var oldArray = [1,2,3,4,5];

// Only change code below this line.

var newArray = oldArray.map(function(val){
 return val+3; 
}
);
```

7-Condense arrays with reduce

* 將陣列變成一個數字
* reduce() 有兩個參數
* 第一個，callback function 有兩個參數，累加器和當前值
* 第二個，是初始值

```javascript
var array = [4,5,6,7,8];
var singleVal = 0;

// Only change code below this line.

singleVal = array.reduce(function(previousVal, currentVal){
  return previousVal+currentVal;
},0);
```

8-Filter Arrays with filter

```javascript
var oldArray = [1,2,3,4,5,6,7,8,9,10];

// Only change code below this line.

var newArray = oldArray.filter(function(val){
  return val<6;
});
```

9-Sort Arrays with sort

* a-b 是正序排
* b-a 是逆序排

```javascript
var array = [1, 12, 21, 2];

// Only change code below this line.

array.sort(function(a, b){
  return b-a;
});
```

10-Reverse Arrays with reverse

```javascript
var array = [1,2,3,4,5,6,7];
var newArray = [];

// Only change code below this line.

newArray = array.reverse();
```

11-Concatenate Arrays with concat

```javascript
var oldArray = [1,2,3];
var newArray = [];

var concatMe = [4,5,6];

// Only change code below this line.

newArray = oldArray.concat(concatMe);
```

* delimiter 分隔符號

12-Split Strings with split

```javascript
var string = "Split me into an array";
var array = [];

// Only change code below this line.

array = string.split(' ');
```

13-Join Strings with join

```javascript
var joinMe = ["Split","me","into","an","array"];
var joinedString = '';

// Only change code below this line.

joinedString = joinMe.join(" ");
```
