Javascript中的函数和数据类型

Javascript中的函数的函数包括命名函数和匿名函数。

命名函数

1. function是关键字，除此之外，还要有函数名称，（），{}。如下例

   
   function myAdd(a,b){
    return "The value is " + a+b;
   }
   console.log(myAdd(1, 4));
   

   上面代码前面3行相当于函数的声明，最后一行console.log输出了函树的调用
   结果值是The value is 14,传入的两个参数被当作字符串处理了。正确的做法是函数体内给a+b加上括号，例如：

   
   function myAdd(a, b) {
   return "The value is " + (a + b);
   }
   console.log(myAdd(1, 4));
   

匿名函数

匿名函数顾名思义就是没有函数名字了，例如：

function (a, b) {
  return "The value is " + (a + b);
}

与前面的例子相比，仅仅不再有名字了。
问题随之而来，没有函数名，用户怎样调用呢？有两种方法：

• 用一个常量表示这个函数
• 立即执行这个函数

1. 用一个常量表示这个函数

   
   const myFun = function (a, b) {
   return "The value is " + (a + b);
   };
   console.log(myFun(1, 4));
   

   这种方式并没有简化函数的使用，因为省了一个函数名，却多了一个变量。
2. 立即执行这个函数

   
   (function (a, b) {
    return "The value is " + (a + b);
   })(1,4)
   

   用小括号包裹整个函数体，再加上参数
   上面的匿名函数已经执行了，返回了字符串，使用console.log可以在浏览器中输出结果。

   
   console.log((function (a, b) {
    return "The value is " + (a + b);
   })(1,4));
   

   是不是感觉越来越复杂了？后面会越来越简化，等你熟悉这种方式你会爱上它的。

---

下面开始简化，function这个单词太长了，将它去掉，用一个形象的=>箭头代替，注意，可不是在原位置替换。下面是例子。

const myFun2 = (a, b) => {
  return "The value is " + (a + b);
};
console.log(myFun2(1,4));

另一种形式如下，还是先用小括号包裹整个函数体，再加上参数：

console.log(
  ((a, b) => {
    return "The value is " + (a + b);
  })(1, 4)
);

当只有一个参数的时候还可以更加简化，比如编写一个加1功能的函数：

console.log(
((x)=>{return x+1;})(3)
);

这个函数只有一个参数，那么包裹参数的小括号可以省略；
如果函数体内只有一条代码，那么return语句和花括号{}也可以省略；最后变成：

console.log(
  (x => x + 1)(3)
  );

写成一行就是

console.log(  (x => x + 1)(3)  );

那如果一个函数不需要参数呢？比如只是输出“hello world”。当然最简单就是直接输出console.log("hello world");按照匿名函数的写法可以写成下面这样

console.log(  ($=>'hello world')()  );

那个$符号什么意思? 其实就是1个参数，你愿意写成x,_,arg1都可以，反正函数体中不需要参数，用不到它，随便写1个合法变量。当然，比较好理解的话还是写成()，表示参数为空。

console.log(  ( ()=>'hello world')()  );

Javascript中的数据类型

1. 原始数据类型

   
   console.log(123, typeof 123);      // 123 'number'
   console.log("hello world", typeof "hello world"); // hello world 'string'
   console.log(true, typeof true);  // true 'boolean'
   console.log(undefined, typeof undefined);   //undefined  'undefined'
   console.log(null, typeof null);   // null  'object'
   let a;
   console.log(typeof a);  undefined
   

2. 引用类型
   由原始数据类型组成的可包含多个值的类型。有3种：数组，对象，函数。
   （1）数组

   
   const arr=[1,"abc", true, [1,2,3]];
   console.log(Array.isArray(arr));
   

   判断arr是不是一个数组不要用typeof了，用Array.isArray()。typeof用于判断原始数据类型。
   （2）对象
   对象其实和数组很像，都可以存储多种数据类型多个值。数组使用中括号，对象使用花括号。

   
   const obj = {name:"zhangSan", password:"123", math:88, english:90};
   console.log(obj);
   console.log("平均分是："+(obj["math"]+obj.english)/2);
   

   对象比数组强大的地方在于，对象中的元素可以是函数

   
   const obj2 = {
   name: "zhangSan",
   password: "123",
   math: 88,
   english: 90,
   total: function(){
      //return obj2.name+"的总成绩是："+(obj.math + obj.english);
      return `${obj2.name}的总成绩是：${this.math+this.english}`;
   },
   };
   console.log(obj2.total());
   console.log(obj2 instanceof Object);  // true
   

   上面用到了模板字面量，Esc键下面的那个反引号包裹，${}中的值可以进行运算和取值。obj也可以用this替代，很直观。
   输出的是：zhangSan的总成绩是：178
   判断变量是不是一个对象，用的是instanceof
   数组和对象经常一起用

   
   arrStu = [
   { name: "zhangSan", password: "123", math: 88, english: 90 },
   { name: "liSi", password: "123", math: 80, english: 78 },
   { name: "wangWu", password: "123", math: 60, english: 100 },
   ];
   let avg = arrStu.map(item => (item.math + item.english) / 2);
   console.log(avg, Array.isArray(avg)); // [89,79,80] true
   let maxAvg = avg.reduce(function (x, y) {
   if (x > y) {
    return x;
   } else {
    return y;
   }
   });
   console.log(maxAvg);   // 输出最高的平均分是89。
   

   map()是数组的一个高阶函数，把f(x)作用在Array的每一个元素并把结果生成一个新的Array,所以avg是一个数组，里面装的是平均分。
   reduce()把一个函数f作用在Array的每一个元素[x1, x2, x3…]上，这个函数必须接收两个参数，reduce()把结果继续和序列的下一个元素做f计算，其效果就是：
   [x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
   比方说对一个Array求和，就可以用reduce实现：

   
   let arr = [1, 3, 5, 7, 9];
   arr.reduce(function (x, y) { return x + y; }); // 25
   

   （3）函数
   使用typeof查看函数的类型，返回值是function；使用instanceof Object查看是不是一个对象，返回值为true。

   
   console.log(typeof function(){});   // 输出function
   console.log(function(){} instanceof Object);  // 输出true
   

   函数是一种数据类型，可以像字符串，数值类型那样作为参数进行传递
   先看看参数类型是数字的函数，3和4传值进去对应x和y。

   
   const sum2num = (x, y) => x + y;
   console.log(sum2num(3, 4));
   

   函数的参数除了可以传递数字，还可以传递一个函数。

   
   function fun2(x) {
   let a = x();
   console.log(a);
   }
   const fun = ($) => 3;
   fun2(fun);    // <--这里的fun后面没有括号（），否则，就成fun2(3)了
   

   函数返回值是字符串，数字等比较常见，返回值也可以是函数

   
   function retAfun() {
   let x = 1;
   return function () {
    x = x + 1;
    return x;
   };
   }
   const rfun = retAfun();
   console.log(rfun());  // 输出2
   console.log(rfun());  // 输出3
   console.log(rfun());  // 输出4
   

   函数retAfun()中的私有变量x通过返回的函数rfun不断地改变。

---

通过函数的name属性可以查看函数名，length属性可以查看函数个数，例如：

const aa = function fun123(x,y,z){};
console.log(aa.name);    // 输出的是fun123
console.log(aa.length);  // 输出的是3,表示参数的个数

函数既然是对象，那就可以给它添加属性

console.log(aa instanceof Object);  // 输出true
aa.newAtt="fresh attribute";        
console.log(aa.newAtt);             // 输出fresh attribute