美文网首页
js函数和原型对象

js函数和原型对象

作者: SeaDream乄造梦 | 来源:发表于2021-03-14 14:22 被阅读0次

函数提升(Hoisting):函数可以在声明之前调用

自调用函数、函数声明、函数表达式、匿名函数、箭头函数:

自调函数:函数后面加括号;闭包:自调函数里面有return返回函数;回调函数:典型案例:计时器(执行完外面的函数,返回执行里面的函数)

具体概念:按ctrl+f搜索

函数声明、函数表达式、匿名函数

函数声明:function fnName () {…};使用function关键字声明一个函数,再指定一个函数名,叫函数声明。

调用方式:name()  写在函数声明前后均可(具有函数提升

函数表达式 var fnName = function () {…};使用function关键字声明一个函数,但未给函数命名,最后将匿名函数赋予一个变量,叫函数表达式,这是最常见的函数表达式语法形式。

调用时两种方式:1.声明时直接后面加括号立即调用 2.声明后,在其后面写name()调用

匿名函数:function () {}; 使用function关键字声明一个函数,但未给函数命名,所以叫匿名函数,匿名函数属于函数表达式,匿名函数有很多作用,赋予一个变量则创建函数,赋予一个事件则成为事件处理程序或创建闭包等等。

函数声明和函数表达式不同:在于,一、Javascript引擎在解析javascript代码时会‘函数声明提升’(Function declaration Hoisting)当前执行环境(作用域)上的函数声明,而函数表达式必须等到Javascirtp引擎执行到它所在行时,才会从上而下一行一行地解析函数表达式,二、函数表达式后面可以加括号立即调用该函数,函数声明不可以,只能以fnName()形式调用 。以下是两者差别的两个例子。

        fnName();

       function fnName(){...}

       //正常,因为‘提升’了函数声明,函数调用可在函数声明之前

       fnName();

       var fnName= function (){...}

       //报错,变量fnName还未保存对函数的引用,函数调用必须在函数表达式之后

  var  fnName= function (){  alert('Hello World' );}();

       //函数表达式后面加括号,当javascript引擎解析到此处时能立即调用函数

function  fnName(){ alert( 'Hello World'); }();

       //不会报错,但是javascript引擎只解析函数声明,忽略后面的括号,函数声明不会被调用

          function(){ console.log('Hello World'); }();

       //语法错误,虽然匿名函数属于函数表达式,但是未进行赋值操作,

       //所以javascript引擎将开头的function关键字当做函数声明,报错:要求需要一个函数名

自调函数:

( function(){…} )()和( function (){…} () )是两种javascript立即执行函数的常见写法

在理解了一些函数基本概念后,回头看看( function(){…} )()和( function (){…} () )这两种立即执行函数的写法,明白要在函数体后面加括号就能立即调用,则这个函数必须是函数表达式,不能是函数声明

( function (a){ console.log(a);})(123);  

       //firebug输出123,使用()运算符

(function(a){ console.log(a);  }(1234));  

       //firebug输出1234,使用()运算符

//自己的有参构造,自己直接传参

自调函数的意义(私有作用域):

私有作用域即用匿名函数作为一个“容器”,“容器”内部可以访问外部的变量,而外部环境不能访问“容器”内部的变量,所以( function(){…} )()内部定义的变量不会和外部的变量发生冲突,俗称“匿名包裹器”或“命名空间”。避免了你在全局或局部作用域中声明了一些变量,可能会被其他人不小心用同名的变量给覆盖掉

函数表达式可以 "自调用"。自调用表达式会自动调用。如果表达式后面紧跟 () ,则会自动调用。不能自调用声明的函数。

以上函数实际上是一个 匿名自我调用的函数 (没有函数名)。

箭头函数、函数表达式、声明函数的区别:

  //   三箭头函数

       const jts = () =>  alert(456);

       jts();//只能写在后面

       const jts = () =>  alert(456)()//不能这样写

       // 一函数表达式

       var jt = function(){

           alert(123);

       }

       jt();//只能写在后面

       // 直接加括号立即调用

       var jt = function(){

           alert(123);

       }()

       // 二声明函数,只有它具有函数提升

       j();//写在前后均可

       function j(){

           alert(888)

       }

即:声明函数有函数提升功能,函数表达式有自调功能

相关文章

  • js原型和继承

    说到原型就不得不说构造函数,js一切皆对象,但分为普通对象和函数对象,构造函数就属于函数对象,所谓的原型和继承也是...

  • 原型和原型链 - 草稿

    一 . 原型 js中万物皆对象,(普通对象和函数对象) Object.function是js自带的函数对象 1.举...

  • JavaScript原型和原型链

    js里,一切皆对象,但有普通对象和函数对象之分,通过new Function()创建的对象就是函数对象。 原型对象...

  • JS博客

    JS构造函数及new运算符 JS原型对象和原型链 函数作用域和作用域链 干货分享:让你分分钟学会JS闭包 深入理解...

  • javascript Class

    旧js定义一种类型需要构造函数和原型对象 构造函数和原型对象是分开的 定义一种类型使用class{}包裹构造函数和...

  • 19_怎么理解js中的原型链?如何实现继承?实现继承常用的方式有

    一、理解js的原型 1、函数和对象的关系 函数也是对象的一种,通过instanceof可以判断出来。但是函数和对象...

  • 3-javascript 构造函数

    js中面向对象编程是基于构造函数(consstructor)和原型链(prototype)的。 构造函数作为对象的...

  • 2020-12-15

    js对象的创建和函数 创建对象 工厂模式 构造函数 原型方式+构造函数

  • 深入理解JS 中原型和原型链

    JS 中原型和原型链深入理解 首先要搞明白几个概念: 函数(function) 函数对象(function obj...

  • js函数和原型对象

    函数提升(Hoisting):函数可以在声明之前调用 自调用函数、函数声明、函数表达式、匿名函数、箭头函数: 自调...

网友评论

      本文标题:js函数和原型对象

      本文链接:https://www.haomeiwen.com/subject/sacqcltx.html