js函数知识
1、函数基本知识
通过函数可以封装任意条语句,在任何地方调用,js中用function关键字来声明,
- //基本格式,函数名,传递参数,代码块
- function functionName(arg0,arg1,arg2,……,argN){
- statements
- }
- //实例
- function sayHi(name,message){
- console.log("hello "+name+","+message)
- }
- sayHi("double","how are you") //普通的函数名调用函数
- function sum(numb1,numb2){
- return numb1+numb2;
- console.log("find me ?") //因为之前有return,所以不会再执行
- }
- var result=sum(1,2); //声明变量的做法来调用函数
- function summ(numb1,numb2){
- return; //return可以不带任何返回值,这时候会返回undefined
- console.log("hello")
- }
- function diff(numb1,numb2){ //一个简单的比较函数
- if(numb1<numb2){
- return numb2-numb1;
- }
- else{
- return numb1-numb2;
- }
- }
1.1理解参数
js中的参数在其内部使用一个数组表示,所以无论参数的数据类型,个数都没关系,而且参数也不一定会用上的。
函数体内可以通过arguments对象访问到参数的数组,从而获得每一个参数。arguments对象和数组相似,可以中括号表示,有length;
参数名不是必须的,为了方便而已,也可以通过arguments[0]访问到
- function change(){
- console.log(arguments.length)
- }
- var zero=change() //0 可以通过length来展现
- var one=change("one") //
- var two=change("two",2) //
- //没有参数名
- function doAdd(){
- if(arguments.length==1){
- console.log(arguments[0]+10);
- }else if(arguments.length==2){
- console.log(arguments[0]+arguments[1])
- }
- }
- doAdd(1) //
- doAdd(1,2) //
- //有参数名
- function anotherAdd(num1,num2){
- if(arguments.length==1){
- console.log(num1+10);
- }else if(arguments.length==2){
- console.log(num1+num2)
- }
- }
- anotherAdd(1) //
- anotherAdd(1,2) //
- function again(num1,num2){
- arguments[1]=10;
- //这里num2的值也就变成10,arguments的值与对应命名参数的值保持同步,内存空间还是独立的;没有传递值得命名参数为undefined
- console.log(arguments[0]+num2)
- }
1.2没有重载
所谓的没有重载就是说,不可以为函数两个定义,因为js的参数是数组,没有签名,做不到真正的重载。两个相同的函数则以后一个为准。
Function类型
也是引用类型,每个函数就是Function类型的实例,都与其他引用类型具有相同的属性和方法。函数为对象,所以函数名只是指向函数对象的指针。
声明变量有两种方式。看例子吧。
- function sum(num1,num2){ //函数声明来定义函数
- return num1+num2
- }
- var sum=function(num1,num2){ //函数表达式定义函数
- return num1+num2
- }
- //函数名仅仅为指针;所以也能理解上面所说的函数没有重载
- function one(num1,num2){
- return num1+num2
- }
- var two=one
- var one=null
- console.log(two(1,2)) //3 即使one为null
函数声明和函数表达式之间的相爱相杀
解析器对他们两个态度可是不同的
对于函数声明,解析器会优先读取,对其有个函数声明提升的过程(function declaration hoisting)
对于函数表达式,解析器可就不会优先了,只有读取到其,才会被解释执行
- console.log(sum(1,2)) //
- function sum(num1,num2){
- return num1+num2
- }
- console.log(another(1,2)) //another is not a function
- var another=function(num1,num2){
- return num1+num2
- }
当然还有构造函数法,不推荐使用,导致代码的二次解析,一次是常规js的,一次是构造函数的
也就是函数可以作为值传参
- function sum(someFunction,value){ //基本的函数中的嵌套
- return someFunction(value)
- }
- function multiplys(num){ //内部的函数
- return num*num
- }
- console.log(sum(multiplys,2)) //调用函数,访问内部函数的指针,不需要()调用
利用作为值得函数,可以按照某一属性对数组进行排序
- function compare(value){ //想要通过比较obj的属性,这里的value只是参数,没有被实例化;而在简单的数组中都已经被实例化了
- return function(obj1,obj2){
- var value1=obj1[value]
- var value2=obj2[value]
- return value1-value2
- }
- }
- var data=[{name:"double",age:24},{name:"zom",age:23},{name:"mike",age:32}]
- data.sort(compare("age"))
- console.log(data) //23,,24,32来排序
2、函数内部的属性
在函数的内部,一般有两个对象
this对象:this引用的是函数执行的环境对象,即this值(在全局环境中,this则代表的是window)
arguments对象:类数组对象,保存函数参数;有个callee属性,此属性是个指针,指向拥有arguments对象的函数
ES5规定了另个一个函数对象的属性caller,保存着调用当前函数的函数引用,在全局作用域中调用当前函数则为null
- //递归函数
- function sum(num){
- if(num<=1){
- return 1
- }
- else{
- return num*arguments.callee(num-1) //消除紧紧耦合,保证完成递归函数,所以用callee属性
- }
- }
- var summ=sum;
- sum=null
- console.log(summ(10))
- //this
- window.color="red"
- function sayColor(){
- console.log(this.color)
- }
- sayColor() //red
- var another={color:"blue"}
- another.putColor=sayColor //函数名只是个指针
- another.putColor() //blue
- //函数对象属性caller
- function outer(){
- inner()
- }
- /* function inner(){
- console.log(inner.caller)
- }*/
- function inner(){
- console.log(arguments.callee.caller) //减少耦合
- }
- outer() //outer()函数
3、函数的属性和方法
每个函数有两个属性
length属性:表示函数的参数名个数
prototype属性:保存引用类型所有实例方法,不可枚举,用for-in无法实现
每个函数都包含两个非继承的方法;都是在特定的作用域中调用函数,实际等于设置函数体内this对象的值
apply()方法:接受两个参数,一为在其中运行函数的作用域,一为参数数组(Array的实例或者arguments对象)
call()方法:接受的第一个参数是this值没变化,第二个不是数组了,直接传递给参数即可,看例子吧
- function sum(num1,num2){
- return num1+num2
- }
- function oneSum(num1,num2){
- return sum.apply(this,arguments) //arguments对象
- }
- function twoSum(num1,num2){
- return sum.apply(this,[num1,num2]) //数组
- }
- console.log(oneSum(1,2))
- console.log(twoSum(1,2))
- function three(num1,num2){
- return sum.call(this,num1,num2) //参数直接传递
- }
- console.log(three(1,2,3))
- //apply()和call()方法可以扩充函数的作用域
- window.color="red"
- var one={color:"red"}
- function sayColor(){
- console.log(this.color)
- }
- sayColor() //red
- sayColor.call(this) //red
- sayColor.call(window) //red
- sayColor.call(one) //blue 这里的作用域为one中的了,不需要再将函数放到one中等操作
ES5规定还规定一个方法bind(),创建一个函数实例,其this值被绑定到传给bind()函数的值,
- window.color="red"
- var one={color:"blue"}
- function sayColor(){
- console.log(this.color)
- }
- var another=sayColor.bind(one) //ES5的函数方法,创造一个函数实例了,并且绑定的this值传递给函数了
- another() //blue
js函数知识的更多相关文章
- 最常用的~正则表达式-相关js函数知识简洁分享【新手推荐】
一.正则表达式的创建 JS正则的创建有两种方式: new RegExp() 和 直接字面量. //使用RegExp对象创建 varregObj =newRegExp("(^\s+)|(\s+ ...
- 《JS权威指南学习总结--第8章 函数知识》
内容要点: 1.函数表达式定义后立即调用: var tensquared = ( function(x){ return x*x ;}(10) ); 2.嵌套函数: 在JS里,函数可以嵌套 ...
- 学完了js的知识,一起分享总结知识点
又一个知识点学完了,到了总结学习效果和知识总结的时间了.js这个编程语言相对于html和css的逻辑性要强一些,也比较不容易上手.概念性的知识点不难理解,就是实际的操作并不容易,需要通过学习和借鉴案列 ...
- Node.js 函数
Node.js 函数 在JavaScript中,一个函数可以作为另一个函数接收一个参数.我们可以先定义一个函数,然后传递,也可以在传递参数的地方直接定义函数. Node.js中函数的使用与Javasc ...
- js函数大全
js函数集·字符串(String) 1.声明 var myString = new String("Every good boy does fine."); var myStrin ...
- Node.js基础知识
Node.js入门 Node.js Node.js是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始.比较独特的是,Node.js会假设在POSIX环境下运行 ...
- JS 函数作用域及变量提升那些事!
虽然看了多次js函数作用域及变量提升的理论知识,但小编也是一知半解~ 这几天做了几道js小题,对这部分进行了从新的理解,还是有所收获的~ 主要参考书籍: <你不知道的JavaScript(上卷) ...
- JS底层知识理解之执行上下文篇
JS底层知识理解之执行上下文篇 一.什么是执行上下文(Execution Context) 执行上下文可以理解为当前代码的执行环境,它会形成一个作用域. 二.JavaScript引擎会以什么方式去处理 ...
- Node.js函数
Node.js 函数 在JavaScript中,一个函数可以作为另一个函数的参数.我们可以先定义一个函数,然后传递,也可以在传递参数的地方直接定义函数. Node.js中函数的使用与Javascrip ...
随机推荐
- 浅析nodeJS中的Crypto模块,包括hash算法,HMAC算法,加密算法知识,SSL协议
node.js的crypto在0.8版本,这个模块的主要功能是加密解密. node利用 OpenSSL库(https://www.openssl.org/source/)来实现它的加密技术, 这是因为 ...
- mxnet框架样本,使用C++接口
哇塞,好久么有跟进mxnet啦,python改版了好多好多啊,突然发现C++用起来才是最爽的. 贴一个mxnet中的C++Example中的mlp网络和实现,感觉和python对接毫无违和感.真是一级 ...
- 全面总结: Golang 调用 C/C++,例子式教程
作者:林冠宏 / 指尖下的幽灵 掘金:https://juejin.im/user/587f0dfe128fe100570ce2d8 博客:http://www.cnblogs.com/linguan ...
- 【HTML_标签大全】
HTML标签大全 标签 描述 标签类型 备注 <!--...--> 定义注释 / 单标签 <!DOCTYPE> 定义文档类型 / 单标签 <head></he ...
- 2017ccpc哈尔滨区域赛H
n堆石子 每次只能拿一个石子从一堆移到另一堆 知道所有的堆的石子数目都能整除x(x>1) 问最小移动次数 枚举x的可能取值 即a[i]和的素因子即可 合因子的区间变化会比较大 然后求余 ...
- hdu_1019Least Common Multiple(最小公倍数)
太简单了...题目都不想贴了 //算n个数的最小公倍数 #include<cstdio> #include<cstring> #include<algorithm> ...
- The Blocks Problem(vector)
题目链接:http://poj.org/problem?id=1208 The Blocks Problem Time Limit: 1000MS Memory Limit: 10000K Tot ...
- angular-dragon-drop.js 双向数据绑定拖拽的功能
在做公司后台物流的时候,涉及到34个省市分为两个部分,一部分为配送区域,另一部分为非配送区域,想利用拖拽的功能来实现,最好两部分的数组能自动更新. 刚好找到angular-dragon-drop.js ...
- [学习OpenCV攻略][004][播放AVI视频]
cvCreateFileCapture(文件路径) 创建一个影音文件录像机,返回值为CvCapture类型,用于读取视频文件 cvQuerFrame(视频) 将下一帧视频文件载入内存,当CvCaptu ...
- 基于TypeScript装饰器定义Express RESTful 服务
前言 本文主要讲解如何使用TypeScript装饰器定义Express路由.文中出现的代码经过简化不能直接运行,完整代码的请戳:https://github.com/WinfredWang/expre ...