JavaScript函数深入了解

对象

var cat = {
    // 基本数据类型
    //这样的 键（名）值对 就是对象的属性
    //对象就是由一个一个键值对组成的
    'name':'Tom',
    'age':4,
    // 数组
    'family':['father','mom'],
    // 放置函数
    'speak':function(){
      console.log('喵喵~');
    },
    // 继续存储对象
    'friend':{
      'name':'Jerry',
      'age':4
    }
  };

var cat = {
    // 基本数据类型
    'name':'Tom',
    'age':4,
    // 数组
    'family':['father','mom'],
    // 放置函数
    'speak':function(){
      console.log('喵喵~');
    },
    // 继续存储对象
    'friend':{
      'name':'Jerry',
      'age':4
    }
  };
  // console.log(cat);
  cat.name='Tim';
  cat['name']='Tim';//修改  写操作
  cat.type='加菲猫';

  console.log(cat.name);//查询  读操作
  console.log(cat['name']);//查询  读操作
  console.log(cat.type);
  //删除属性
  delete cat.type;
  console.log(cat.type);

  //如何检测一个对象是否拥有该属性
  console.log('type' in cat);

  //循环遍历对象  循环输出每一个属性名
  for(var p in cat){
    console.log(p);
    console.log(cat[p]);
    //console.log(cat.p);不能使用点  因为点表示  .属性
    //(.p它不会认为p是每个属性名，而去寻找对象里有没有p这个属性)
  }

函数

// 函数一次封装（定义）  四处使用
  //命名函数 add
  function add(num1,num2){
    return num1+num2;
  }

  //匿名函数
  window.οnlοad=function(){}

  //构造函数
  new Object();
  new Function();

  //添加属性和方法
  var person = {};
  person.name='xm';
  person.setName=function(name){
    this.name=name;
  }
  person.setName('xj');
  console.log(person.name);
  

  //函数添加属性
  function add(num1,num2){
    return num1+num2;
  }
  add.sex='male';
  add.setSex=function(sex){
    this.sex = sex;
  }

  console.log(add.sex);//male
  console.log(add.setSex('female'));
  console.log(add.sex);//female
  console.log(add(1,4));


  var adder = function(){
    return 1;
  }
  console.log(adder());//1
  console.log(adder);//输出函数的本体

//字面量  function声明
  function add(){

  }
  add();

  //var赋值表达式
  var add = function(){

  };
  add();

  //构造函数  必须是字符串形式  效率比较差，首先解析字符串变量 其次再实例化函数
  var add = new Function('num1','num2','return num1+num2');
  add();

//先使用后定义  变量提升
//预加载 ，会把函数function提到最上面，先执行function add(){ }操作，然后再输出add();
console.log(add());//1
function add(){
  return 1;
}

//先定义后使用
//var add = function(){
//  return 1;
//};
var add;
add = function(){
  return 1;
};
console.log(add());//1


// 只要function不打头,就可以调用
  (function(){
    console.log(1);
  })();

  +-~!function(){
    console.log(2);
  }();

  console.log(function(){
    return 3;
  });//输出函数本体

  console.log(function(){
    return 3;
  }());//输出 3

document.οnclick=function(){
  console.log('你调用了我‘);
}
document.onclick();

var a=function(){
  console.log('你调用了我');
}
a();

var operation = {
    add:function(num1,num2){
      return num1+num2;
    },
    substract:function(num1,num2){
      return num1-num2;
    },
    '@':function(){
      console.log('@');
    },//非主流符号，必须加引号
    key:function(){

    }
  };

operation.add(1,1);//调用对象里的函数
operation['@']());//此处调用必须用中括号，用.会报错

  var key = 'add';//把add函数赋值给了key  调用变量  点是不行的，必须使用[]
  // console.log(operation.key(1,2));//错误
  console.log(operation[key](1,2));

递归调用 – 阶乘

function factorial(num){
    if (num<=1) {return 1}
    return num*factorial(num-1);
    //return 5*4!
  }

  console.log(factorial(5));
  console.log(factorial(4));

参数的使用

function add(num1,num2){
    return num1+num2;
  }

  add(1,2);
  // 形参 = 实参
  // num1 = 1
  // num2 = 2

  var person={};
  function setPerson(obj){
    obj.name = 'xm';
  }
  setPerson(person);
  console.log(person);
  //就是将person对象的地址，赋予给obj  他们俩指向同一个引用
  // obj = person;

参数的个数

形参 == 实参

function add(num1,num2){
    return num1+num2;
  }

  add(1,2);

实参 < 形参

//幂运算：次方运算。同底数幂相乘（相除），底数不变，指数相加（相减）。幂的乘方，底数不变，指数相乘。

//数学函数幂运算   Math.pow()
  //Math.pow(x,y)
  //pow() 方法返回 x 的 y 次幂。
  //x.必需。底数。必须是数字。
  //y.必需。幂数。必须是数字。

//需求：
  // 1、如果只传入一个值，表示默认计算2次幂
  // 2、如果传入2个参数，表示计算几的几次幂
  // if  else
  function pow(base,power){
    if (!power) {power=2;}
    return Math.pow(base,power);
  }
  console.log(pow(3));//9
  console.log(pow(3,3));//27

function pow(base,power){
  //if (!power) {power=2;}
  //或运算：两个都是假才为假  只要有一个真就是真
  power = power || 2;//power赋值就走power，未赋值就走2
  return Math.pow(base,power);
}
console.log(pow(3));
console.log(pow(3,3));

实参 > 形参

function add(){
    //arguments类数组 -- add(1,2,3)  arguments[0]=1   arguments[1]=2
    if (arguments.length==0) {return;}
    var sum = 0;
    for(var i=0;i<arguments.length;i++){
      sum+=arguments[i];
    }
    return sum;
  }
  console.log(add());//undefined
  console.log(add(1,2,3,4,5));//15
  console.log(add(1,2,3));//6

arguments

arguments类数组 不是数组，只是类似数组，是类似数组的对象。
“use strict” 严格模式下，无法使用arguments

//类数组真身
{
    '0':1,
    '1':2,
    '2':3,
    length:3
  }

function fn(name){
    arguments[0]="";
    console.log(name);
  }
  fn('xm');
  //空字符串  arguments和我们的形参都指向了同一个值。

  function add(num1,num2){
    alert(arguments.callee);//先弹出函数本身
    return num1+num2;
  }
  add();//再运算

阶乘

//阶乘
//arguments.callee  调用函数本身

function jiecheng(num){
    if (num<=1) {return 1}
    return num*arguments.callee(num-1);
  }
  console.log(jiecheng(5));//120
  console.log(jiecheng(4));//24
               
               
var jiecheng = function fn(num){
    if (num<=1) {return 1}
    return num*fn(num-1);
  }
  console.log(jiecheng(5));//120
  console.log(jiecheng(4));//24

参数

//什么都没有
  function fn(){

  }

  //数字
  function add(num1,num2){
    return num1+num2;
  }
  add(1,1);

  //jquery 字符串
  $('p')

参数的返回值

1. 参数 – 函数的输入
2. 返回值 – 函数的输出

return用在函数中

return  
  1、return;  结束
  2、return num;   将值返回
  3、return 一般情况下放在最后，因为return后面的代码将不再执行

continue用在循环中，表示跳出本次循环

for(var i=0;i<10;i++){
    if (i==4) {continue;}
    console.log(i);
  }
//0 1 2 3 5 6 7 8 9

break用在循环中，表示跳出循环

for(var i=0;i<10;i++){
    if (i==4) {break;}
    console.log(i);
  }
//0 1 2 3
  console.log("我跳出来了");