递归与事件驱动-CFANZ编程社区

递归

函数可以自己调用自己函数内部调用函数

三大问题因素：

1.明确对应要解决的问题

2.明确临界点(终止) if else

3.明确内部需要调用自己的函数

函数调用的方式

1.首先去找临界值，即无需计算，获得的值(一般是返回该值) 一般是有结果返回的

2.找这一次和上一次的关系(一般从后往前找) 函数必须要有参其次参数之间得到的结果会存在某种关系

3.假设当前函数已经可以使用，调用自身计算上一次的运行结果，再写出这次的运行结果。

如果当前函数已经使用，那么对应的上一次函数我们会把他当值来进行计算

操作练习代码

// 1 3 5 7 9....... 问第20位是什么

function fn(number){ //这个里面的number值表示当前传递的参数 为第几位
    if(number==1){//临界点 已知条件(没有规律)
        return 1
    }else{ //存在规律的
        return fn(number-1)+2  //找到前者和后者的关系 自己调用自己
    }
}
console.log(fn(20))

不用循环计算0-100以内的数字和

var sym = 0, sum = 0
function fn3(number){
    if(sym<number){
        sym++
        sum += sym
    }else{//等于100后停止
        console.log(sum)
        //返回结果
        return sum
    }
    fn3(number)
}
//返回对应累加的值
fn3(100)

事件驱动

因为函数不会主动执行, 只有当调用的时候才会执行函数中

的代码, 在前面的dom操作示例中,我们点击了按钮才触发

函数调用

所有的函数，没有调用不会执行，那么在我们浏览器中

函数调用的源头在何处，就是事件, 只有使用事件去驱动,

函数才被调用; 如: onclick: 点击事件

简单Dom操作

function showInputValue(){
    //先获取这个input
    //  document 文档  get 获取  element 元素 by通过 id
    //通过id获取对应的元素
    var inputElement = document.getElementById('input')
    //打印对应的里面的value值  input里面显示的内容为value值
    var val = inputElement.value;
    console.log(val)
}

onclick 是所有标签都有的这个是对应的触发点击事件里面的值为函数也就是意味着点击这个按钮调用对应的函数这个函数调用方式叫做函数的事件调用

showInputValue() //也是事件驱动  加载事件  所有的函数都需要通过事件驱动 
document.write('你好 麻花疼')
//通过文档写入  通过输出流直接发送给浏览器 由浏览器自动渲染
//服务器渲染 加载快(首页渲染)
document.write('hello')

操作练习代码

<input type = 'text' placeholder = '请输入第一个数' id = 'firstNumber'>
<input type = 'text' placeholder = '请输入运算符' id = 'sym'>
<input type = 'text' placeholder = '请输入第二个数' id = 'lastNumber'>
<button onclick='computer()'>计算</button>
<input type = 'text' id = 'result'>
<srcipt>
    function computer(){
        //获取输入的数值 .value属性获取到的是字符串
        var firstStr = document.getElementById('firstNumber').value
        var lastStr = document.getElementById('lastNumber').value
        var symbol = document.getElementById('sym').value
        var result = document.getElementById('result').value
    }
        var resultNumber = 0
        //先转换类型
        var firstNumber = Number(firstStr)
        var lastNumber = Number(lastStr)
        switch(symbol){
            case '+':
                resultNumber = firstNumber+lastNumber
                break
                case '-':
                resultNumber = firstNumber-lastNumber
                break
                case '*':
                resultNumber = firstNumber*lastNumber
                break
                case '/':
                resultNumber = firstNumber/lastNumber
                break
                case '%':
                resultNumber = firstNumber%lastNumber
                break
            default:    
        }
        //将结果赋值给对应的result的input框
        result.value = resultNumber
    }
</srcipt>