首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

原型函数与javascript中的普通函数有何不同?

原型函数与普通函数在JavaScript中有以下不同:

  1. 定义方式:原型函数是定义在对象的原型上的函数,而普通函数是直接定义在对象上的函数。
  2. 调用方式:原型函数需要通过对象实例来调用,而普通函数可以直接调用。
  3. 作用域:原型函数的作用域是对象实例,而普通函数的作用域是全局作用域。
  4. 继承:原型函数可以被对象实例继承和重写,而普通函数不能被继承和重写。
  5. 性能:由于原型函数是在对象的原型上定义的,所以它的性能相对较高,而普通函数的性能相对较低。

以下是一个简单的示例:

代码语言:javascript
复制
function Person(name) {
  this.name = name;
}

// 原型函数
Person.prototype.sayHello = function() {
  console.log('Hello, my name is ' + this.name);
}

// 普通函数
Person.prototype.sayGoodbye = function() {
  console.log('Goodbye, my name is ' + this.name);
}

var person1 = new Person('John');
person1.sayHello(); // 输出 "Hello, my name is John"
person1.sayGoodbye(); // 输出 "Goodbye, my name is John"

在这个示例中,sayHello是一个原型函数,而sayGoodbye是一个普通函数。它们的主要区别在于定义方式和调用方式。原型函数需要通过对象实例来调用,而普通函数可以直接调用。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • 箭头函数普通函数区别

    : 02 【从this指向来看】 【普通函数】 严格模式下,this指向undefined: 非严格模式下,this指向window: 谁调用函数函数内部this就指向谁: 普通函数this...【箭头函数】 无论是严格模式还是非严格模式下,this始终指向window: 箭头函数没有自己执行上下文,this指向是在定义函数时就被确定下来,箭头函数this,永远指向外层作用域中最接近自己普通函数...this: 从上面的例子可以看出,普通函数fn作为obj属性被调用,谁调用普通函数,那么函数this就指向谁,所以fnthis指向obj。...fn函数内部一个箭头函数test,test没有自己this,它this指向外层作用域中最接近自己普通函数this,所以testthis也指向obj。...(作为构造函数),this指向被创建出来对象实例: 【箭头函数】 箭头函数不能当做构造函数来使用: 04 【从arguments对象来看】 【普通函数】 在普通函数,arguments是类数组对象

    72420

    箭头函数普通函数区别?

    以下是箭头函数普通函数主要区别: 1:语法简洁性:箭头函数具有更简洁语法形式,可以帮助减少代码量。它使用箭头(=>)来定义函数,省略了function关键字和大括号。...// 普通函数 function sum(a, b) { return a + b; } // 箭头函数 const sum = (a, b) => a + b; 2:this绑定:箭头函数没有自己...这意味着在箭头函数内部,this外部上下文保持一致,并且无法通过调用方式来改变this指向。...:普通函数可以用作构造函数来创建新对象实例,而箭头函数不能使用new关键字来创建对象。...this值情况,而普通函数则提供更多灵活性和功能,适用于更复杂函数需求。

    18520

    JavaScript原型链继承盗用构造函数继承

    ,很多东西我们没有,但是我们父亲,我们就可以拿我们父亲来用。...原型链继承 原型链继承是js主要继承方式,它基本思想就是通过原型继承多个引用类型属性和方法。...这个赋值重新更改了SUbType最初原型,替换成了SuperType实例。这样意味着SuperType实例可以访问所有的属性和方法也存在SubType.protoype。...盗用构造函数 盗用构造函数有时候也被一些人叫做“对象伪装”或“经典继承”。这个思路很简单,在字类构造函数调用父类构造函数。我们可以用.call()和.apply()将父类构造函数引入子类函数。...,通过使用call()(也可以使用apply()),SuperType构造函数在为SubType实例创建新对象执行后,相当于新SubType对象运行了SuperType()函数所有初始化代码。

    40720

    箭头函数普通函数区别详解

    箭头函数普通函数区别 一.外形不同:箭头函数使用箭头定义,普通函数没有 代码实例如下: // 普通函数 function func(){ // code } // 箭头函数 let func...=()=>{ // code } 二.箭头函数都是匿名函数 普通函数可以匿名函数,也可以具体名函数,但是箭头函数都是匿名函数。...但是构造函数不能用作构造函数。 四.箭头函数this指向不同普通函数,this总是指向调用它对象,如果用作构造函数,this指向创建对象实例。...(2).箭头函数不具有prototype原型对象。 (3).箭头函数不具有super。 (4).箭头函数不具有new.target。...总结: (1).箭头函数 this 永远指向其上下文 this ,任何方法都改变不了其指向,如 call() , bind() , apply() (2).普通函数this指向调用它那个对象

    83320

    Hooks普通函数区别

    Hooks普通函数区别 在这里Hooks具体指的是自定义Hooks,自定义Hooks与我们定义普通函数类似,都可以封装逻辑,以实现逻辑复用。...首先看一下官方文档,在自定义Hooks部分说明了,构建自己Hooks可以让您将组件逻辑提取到可重用函数。...如果在普通函数调用了其他Hooks,那么这个函数就不再是普通函数了,除了违反了Hooks命名规则以外,那就完全是一个Hooks定义了。...实际上,Coding比较重要两个概念是逻辑数据,文档中提到将组件逻辑提取到可重用函数,重要是逻辑这两个字,而在两个组件中使用相同自定义Hooks是不会共享State。...示例 举一个例子,对于数据请求,我们通常会封装一个request函数,假如我们需要对这个函数做一层缓存,那么就会有逻辑数据复用,在逻辑方面我们抽离出方法差距不大,而对于数据缓存复用方面在这里通过普通函数自定义

    85320

    JavaScript函数防抖函数节流

    函数节流(throttle) 函数防抖(debounce)都是为了限制函数执行频次,以优化函数触发频率过高导致响应速度跟不上触发频率,出现延迟,假死或卡顿现象。...应用场景 函数防抖应用场景 连续事件,只需触发一次回调场景:搜索框搜索输入。只需用户最后一次输入完,再发送请求手机号、邮箱验证输入检测窗口大小Resize。只需窗口调整完成后,计算窗口大小。...函数节流应用场景 间隔一段时间执行一次回调场景:滚动加载,加载更多或滚到底部监听谷歌搜索框,搜索联想功能高频点击提交,表单重复提交 实现 函数防抖: function _debounce(fn,...} } function _log(){ console.log(1) } window.onscroll = _throttle(_log,500) 总结 其实函数节流函数防抖原理非常简单...使用函数节流函数防抖目的,就是为了节约计算机资源。

    58520

    js构造函数普通函数区别_函数声明和函数定义

    大家好,又见面了,我是你们朋友全栈君。 1、构造函数也是一个普通函数,创建方式和普通函数一样,但构造函数习惯上首字母大写 2、构造函数普通函数区别在于:调用方式不一样。...普通函数调用方式:直接调用 person(); b.构造函数调用方式:需要使用new关键字来调用 new Person(); 4、构造函数函数类名相同:Person( ) 这个构造函数...A、立刻在堆内存创建一个新对象 B、将新建对象设置为函数this C、逐个执行函数代码 D、将新建对象作为返回值 6、普通函数例子...:因为没有返回值,所以为undefined 7、构造函数例子:构造函数会马上创建一个新对象,并将该新对象作为返回值返回 8、用instanceof 可以检查一个对象是否是一个类实例...如发现本站涉嫌侵权/违法违规内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

    3.2K10

    TypeScript 函数理解及其 JavaScript 函数差异

    一、函数概述 在 JavaScript 应用程序函数是核心组成部分,它们帮助我们实现代码抽象、模拟类、隐藏信息和模块化。...在 TypeScript 类型系统函数类型扮演着极其关键角色,是构建可组合系统核心。...二、TypeScript 函数使用 TypeScript 定义函数方式 JavaScript 非常相似,可以通过 function 关键字或箭头函数来定义。...TypeScript 允许我们定义同名但参数类型或数量不同函数,这被称为函数重载。...JavaScript 函数差异 从上述内容可以看出,TypeScript 函数 JavaScript 函数主要区别在于: TypeScript 需要显式声明函数参数类型和返回值类型(尽管编译器可以进行类型推断

    11710

    10 - JavaScript 函数 & 11 - JavaScript 函数种类

    函数就是 JavaScript 可以被执行代码块。函数有如下必备部分: 1. 使用 function 关键字声明; 2. 函数名字紧跟其后,它就是被调用时使用名字。 3....函数创建了可复用代码块,若你需要多次执行代码,把它们变为一个函数是个好主意。 函数返回值 函数一旦执行完代码可以给你返回一些东西,但并非总是如此。有时候函数执行完也就结束了。...JavaScript 自带函数 你不是要经常写函数JavaScript 自带了许多可以直接使用方法。...函数声明在其他代码执行之前被加载,然而函数表达式只有等到 JavaScript 解释器执行到所在代码行时才被加载。这就是 JavaScript hoisting[1] 原理。...,它们没有 this、arguments、super、new.target,我们将在接下来 JavaScript 文章温习这写概念。

    2.8K20

    JS函数声明函数表达式不同

    Js函数声明是指下面的形式: function functionName(){ }         这样方式来声明一个函数,而函数表达式则是类似表达式那样来声明一个函数,如: var functionName...= function(){ }         可能很多朋友在看到这两一种写法时会产生疑惑,这两种写法差不多,在应用貌似也都是可行,那他们什么差别呢?       ...事实上,js解析器对函数声明函数表达式并不是一视同仁地对待。...对于函数声明,js解析器会优先读取,确保在所有代码执行之前声明已经被解析,而函数表达式,如同定义其它基本类型变量一样,只在执行到某一句时也会对其进行解析,所以在实际,它们还是会有差异,具体表现在,...当使用函数声明形式来定义函数时,可将调用语句写在函数声明之前,而后者,这样做的话会报错。

    1.4K20

    js 构造函数,构造函数作用,构造函数普通函数区别

    构造函数JavaScript ,用 new 关键字来调用函数,称为构造函数。构造函数首字母一般大写(规范)。...之所以构造函数普通函数之分,主要从功能上进行区别的,构造函数主要 功能为 初始化对象,特点是和new 一起使用。new就是在创建对象,从无到,构造函数就是在为初始化对象添加属性和方法。...并且该对象继承函数原型; 属性和方法被加入到this引用对象; 隐式返回this对象(如果没有显性返回其他对象) 简单说 用new调用构造函数,最大特点为,this对象指向构造函数生成对象...普通函数调用方式:直接调用 person(); 构造函数调用方式:需要使用new关键字来调用 new Person(); 3、构造函数函数类名相同:Person( ) 这个构造函数,Person...(ES6 class 构造函数关 系,通过class定义类 和通过构造函数定义类 二者本质相同。并且在js执行时,会将第一种转会为第二种执行。

    3.5K10

    JavaScript 函数式编程:纯函数副作用

    JavaScript 函数式编程应用越来越广泛,为开发者提供了一种更简洁、更可维护编程方式。纯函数定义特性纯函数函数式编程核心概念之一。...我们只需要为不同输入提供预期输出,并验证函数实际输出是否之匹配。可组合性:纯函数可以轻松地组合在一起,形成更复杂函数。因为它们行为是确定,所以我们可以放心地将它们串联或嵌套使用。...缓存友好:由于纯函数对于相同输入总是产生相同输出,所以可以利用缓存来提高性能。副作用概念表现形式副作用则是指函数在执行过程,除了返回值之外,还对外部环境产生了其他影响。...,因为它修改了全局变量 counter,导致每次调用时返回结果不同。...通过在 JavaScript 运用纯函数和副作用管理技巧,我们可以编写出更健壮、更可维护代码。

    15100

    javascript函数声明函数表达式

    javascript,我们经常要声明函数,或者使用函数表达式,今天我们就来说说这两者区别。 解析器在执行代码时候,对函数声明和函数表达式并不是一致。...解析器会优化读取函数声明,这是为了使其他代码在使用此函数之前可以使用,函数表达式则不然,必须到函数表达式执行到所在代码区域才会被解释执行。...我们来看两个例子: 1.函数声明: console.log(action(10,20)) function action(num1,num2){ } 这段代码我们一直都知道,是可以通过吧,这是因为解析器会优化读取函数...javascript引擎在第一次会声明函数并将他们放在源代码顶部,所以即使函数声明在调用后面,也能完成执行。 如果使用函数表达式,这样调用就会报错。...在执行到函数所在语句之前,解析器根本找不到action这个函数,这就是函数声明和函数表达式区别。

    48610

    JavaScript学习总结(三)——闭包、IIFE、原型函数对象

    2.5、对象原型 javascript是一种动态语言,C#和Java这样静态语言是不一样javascript并没有严格类型,可以简单认为javascript是由对象组成,对象间连接到原型(...在JavaScript原型也是一个对象,通过原型可以实现对象属性继承,JavaScript对象中都包含了一个"Prototype"内部属性,这个属性所对应就是该对象原型。...三、函数 javascript函数就是对象,对象就是“键/值”对集合并拥有一个连接到原型对隐藏连接。 ? 属性 arguments[] 一个参数数组,元素是传递给函数参数。反对使用该属性。...是一个隐式对象,不声明也在函数,内部函数可以访问外部函数任意内容,但是不能直接访问外部函数argumentsthis对象。...callerthis还是区别的,this是指调用方法对象,而caller是指调用函数函数

    1.5K60
    领券