JavaScript函数深入了解 学习打卡

思维导图

课程介绍

1. 函数是什么玩意儿
2. 函数的定义和调用
3. 函数的参数和返回值

对象的简单了解

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

如何使用对象

// 可以通过new实例化构造函数
  var cat = new Object();
  var cat = {};//这两个都表示空对象
  //es5  Object.create()  存在兼容性
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);不能使用点  因为点表示  .属性
  }

什么是函数

// 函数是否也可以？  --   了解一下
  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));

函数的定义：三种

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

  }
  add();

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

  };
  add();

  //构造函数  必须是字符串形式  效率比较差，首先解析字符串变量 其次再实例化函数
  var add = new Function('num1','num2','return num1+num2');
  add();
  
  // 只要function不打头,就可以调用
  (function(){
    console.log(1);
  })();

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

  console.log(function(){
    return 3;
  }());

递归调用 – 阶乘

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

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

var operation = {
    add:function(num1,num2){
      return num1+num2;
    },
    substract:function(num1,num2){
      return num1-num2;
    },
    '@':function(){
      console.log('@');
    },
    key:function(){

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

参数的使用

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);

形参 < 实参

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

	 function pow(base,power){
	 	// if (!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());
	console.log(add(1,2,3,4,5));//15
	console.log(add(1,2,3));//6

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();

阶乘使用

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 sum   将值返回
	3、return 一般情况下放在最后，因为return后面的代码将不再执行

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

for(var i=0;i<10;i++){
		if (i==4) {continue;}
		console.log(i);
	}

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

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