高级JavaScript

456 阅读4分钟

函数的高级用法

  • 异步常见的三种方式:定时器函数,事件点击函数,ajax异步请求
  • 所有的函数都是都是Function的实例对象
  • 定义函数的几种方法
    • function fn(){}//命名函数
      var fn = function(){} //匿名函数
      var fn = new Function()//参数为字符串
      
    • 函数的调用
      • 普通函数的调用var fn = function(){} fn()调用fn.call()也可以调用
    • 对象函数的调用(也叫方法)
      • var o = {
            say:function(){
                conlog.log('唱歌')
            }
        }
        o.say()//调用
        
    • 构造函数的调用
      • function Star(){}// 调用: new Star();
        
    • 事件绑定函数的调用
      • btn.onclick = function(){} //点击按钮可以调用
    • 定时器函数的调用,每隔多久调用一次
    • 立即执行函数的调用
      • (function(){})(); 直接调用
    • 函数调用的call方法:主要用在函数调用,核心用法为改变当前this的指向问题,一般用在子构造函数继承
    • 函数调用的apply方法,参数为数组,例如求数组中最大值
      • var arr = [1,2,4,6,87]
        var max = Math.max.apply(Math,arr)//Math参数为this的指向
        conlog.log(max)//87 输出结果为数组中最大值,以字符串形式显示
        
    • 函数调用的bind方法,参数为字符串,改变this指向,但是不会立即执行函数,一般用在定时器的操作上
      • <!DOCTYPE html>
        <html>
        <head>
        	<title></title>
        	<button>按钮</button>
        </head>
        <body>
        	<script type="text/javascript">
        		var btn = document.querySelector('button')
        		btn.onclick = function(){
        			this.disabled = true;
        			setTimeout(function(){
        				this.disabled = false
        			}.bind(this),3000)//因为定时器的this指向就是调用者btn,
        		}
        		
        	</script>
        </body>
        </html>
        
    • js的严格模式?
      • 在代码开始的时候加上'use strict';既可以开始严格模式
      • 严格模式在IE10以上的浏览器中才能被识别,严格模式既可以添加整个js脚本,也可以为具体的函数添加
      • 严格模式下不能直接给变量赋值,必须先定义,而且不能试用del 删除变量,变量必须先声明
      • 严格模式定义的函数this指向不再是window,二是undefind.
      • 构造函数中,调用函数必须使用new关键字
      • 定时器函数中this的指向还是全局window
      • 函数不能定义在非代码块中,例如for循环,if条件中不能写函数,函数中可以嵌套函数
      • 严格模式下变量不能重复
  • 高阶函数?在一个函数中的参数为回调函数,那么这个函数就叫高阶函数
  • 闭包?一个函数作用域,访问另一个函数中的局部变量,就产生了闭包?也可以说闭包是一种现象
  • 闭包的作用?可以延申变量的使用范围,return 是闭包的主要关键字
  • function fn(){
        var num = 10;
        return function(){
            console.log(num)
        }
    }
    var f = fn();
    f();//闭包的作用 
    
  • 遍历数组中第二层的时候可以利用递归,自己调用自己
  • 深拷贝与浅拷贝
    • 浅拷贝只是拷贝了内存地址,例如拷贝的是一个对象,如果修改了对象中的值,则两个都会改变
      • 在es6中增加了一个对象方法可以解决浅拷贝问题Object.assign()
        • 参数1:要拷贝的对象
        • 参数2:要拷贝给谁
  • 正则表达式两种定义格式一般用第二种
    • var reg  = new new RegExp(/123/);
      var reg = /123/;
      
    • ^表示开始$ 表示结尾,[a-z]表示a到z任何一个字母
    • 字符限制:字符都可以在中括号中添加表示字符的任一个[0-9a-zA-Z]任何一个字符
    • ^在[]外面^[]表示从哪开始,^在[]里面表示取反[^0-9]表示不允许有数字
      • 表示>=0次,即表示可以出现0次或者多次
    • +号表示>=1,即表示可以出现1次或者多次
    • ?表示要么出现1次要么出现0次
    • {3}表示出现3次,{3,}表示3次以上>=3次,{3,16}表示>=3并且<=16次
    • 表达式后面加上修饰
    • \d===[0-9]表示任意一个数字,\D===[^0-9]表示除了数字以外的
    • \w===[0-9a-zA-Z-_]表示任意一个数字字母大小写下划线 \W表示取反
    • \s===[\t\r\n\f\v]表示任意一个空格包括换行符制表符空格等等,\W则表示取反
    • 正则表达式的新用法replace
      • replace有两个参数
      • 参数一:一个字符串或者一个正则表达式(旧值)
      • 参数二:要替换的新值
      • 正则表达式可以有参数/123/g表示全局i表示忽略大小写gi全国并且忽略大小写