es5 中的类和es6中的class有什么区别

最新推荐文章于 2024-06-12 11:13:48 发布
最新推荐文章于 2024-06-12 11:13:48 发布
阅读量347 收藏
点赞数 2
文章标签： es6 前端 ecmascript vue.js javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43962020/article/details/135867804
版权

一、class类必须new调用，不能直接执行

class类执行的话会报错，而es5中的类和普通函数并没有本质区别，执行是可以的

二、class类不存在变量提升

三、class类无法遍历它实例原型链上的属性和方法

四、new.target属性

es6为new命令引入了一个new.target属性，它会返回new命令作用于的那个构造函数。如果不是通过new调用或Reflect.construct()调用的，new.target会返回undefined

五、class类有static静态方法

static静态方法只能通过类调用，不会出现在实例上，如果静态方法包含 this 关键字，这个 this 指的是类，而不是实例，static声明的静态属性和方法都不可以被子类继承

weixin_43962020
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
小记ES5和ES6的类
野草园
03-29 4784
ES6中的类只是语法糖，它并没有改变类实现的本质。举个例子，在ES5中定义一个类：function Person(name) { this.name = name; }Person.prototype.sayHello = function(){ return 'Hi, I am ' + this.name; } 而用ES6的写法重写一下，检测类型发现Person本质上仍然是函数：
es6中class与ts中的class有什么区别
12-10 1659
ts的class和es 6的class 有什么区别？两者类似但有不同点是ts多了一些修饰符 类的基本使用 定义一个最简单的Lady类,这里要使用关键字class,类里边有姓名属性和一个得到姓名的方法，代码如下： class Lady { content = "Hi，帅哥"; sayHello() { return this.content; }} const goddess = new Lady();console.log(goddess.sayHello()); 类的继承 这里提前说一下...
ES5和ES6的类的区别
m0_53644435的博客
12-15 3609
一、写法上面的区别 我们用ES5定义一个类： function Person(name,age){ this.name = name; this.age = age; } Person.prototype = { say: function(){ console.log('hello'); }, sayHi() { console.log('hi'); } }; Person.eat = function(){ c
谈谈ES5和ES6的区别
青春木鱼的博客
10-02 8066
ES6 主要是为了解决 ES5 的先天不足，目前浏览器的 JavaScript 是 ES5 版本，大多数高版本的浏览器也支持 ES6，不过只实现了 ES6 的部分特性和功能。ES6 是继 ES5 之后的一次改进，相对于 ES5 更加简洁，提高了开发效率
es5 中的class和es6中的class有什么区别？
郊眠寺
05-26 942
在es5中主要是通过构造函数方式和原型方式来定义一个类，在es6中我们可以通过class来定义类。 一、class类必须new调用，不能直接执行。 class类执行的话会报错 而es5中的类和普通函数并没有本质区别，执行肯定是ok的。 二、class类不存在变量提升 es5中的类 es6中的类 图2报错，说明class方式没有把类的定义提升到顶部。 三、class类无法遍历它实例原型链上的属性和方法 function Foo (color) { this.color = color } Foo.p
ES6类class的写法，和ES5的区别
weixin_44364001的博客
09-26 405
ES6类class es5的写法 function Person(){ /*这里是初始化*/ say(){ } } es6的写法 class Person{ constructor(){ /*这里是初始化*/ } say(){ } } 类的继承 class Teacher extends Person{ constructor(){ super();//必须要用super调用父亲的构造函数
ES6中的类与ES5中的类的区别
qq_43670193的博客
04-16 764
ES6中的类的特别之处 前言 我在牛客的面经上经常看到面试官问ES6中的类和ES5中的类有什么不同？我查看了不少人给出的答案，但我觉得他们的答案都不是很全，而且一些核心的点都没有提到，故在此写下我的理解，希望能帮助大家，o(￣▽￣)ブ！ ES6的类与ES5的类的区别 首先我要强调的是javascript中并不存在类，ES6引入类只是为了让那些习惯使用java，C++这些语言的开发者更容易使用javascript。ES6中的class只是一个语法糖，它本质上还是基于原型来实现的。下面进入正题。Are you
es5 类与es6中class的区别小结
01-18
关于es5中定义类的方式，可以看这一篇Js的‘类’，我们这里主要聊es5类和es6中class类的区别。 一、class类必须new调用，不能直接执行。 class类执行的话会报错，而es5中的类和普通函数并没有本质区别，执行肯定是...
es5-function-to-class-codemod：将ES5函数转换为ES6类
02-05
将ES5函数转换为ES6类 :package: :laptop:产品特点 :hundred_points: prototype方法 prototype静态方法 prototype上的变量和文字 具有defineProperty Getters，Setters 块级变量样本输入 :kick_scooter: 和输出 :...
ES6中的class是如何实现的(附Babel编译的ES5代码详解)
11-27
这篇文章主要讲解面试中的一个问题 – ES6中的class语法的实现？ ECMAScript 6 实现了class，class是一个语法糖，使得js的编码更清晰、更人性化、风格更接近面向对象的感觉；也使 IDE 、编译期类型检查器、代码风格...
esnext-class:在es5中编写类似es6的类，并具有更多功能
05-22
在es5中编写类似es6的类，并具有更多功能 涵盖es6中类的当前实现的一些限制： 定义属性 使用特质 用 var newClass = require ( 'esnext-class' ) . newClass ; var A = newClass ( { constructor : function A ...
继承行为在 ES5 与 ES6 中的区别详解
11-29
最近在看 React 方面的一些文章时，看到了这样一个问题，「为什么每个 class 中都要写 super， super 是做什么的？」, 刚看到这个问题时，直接就想到了继承行为在 javascript 中的表现。后面作者的一句话「super 不...
ES6的class的理解和ES5的一些区别
ta_huang的博客
12-05 585
ES6的class class Person { constructor(x, y) { this.x = x; this.y = y; } show() { console.log('x---', this.x, 'y----', this.y); } } 类型为function console.l
es6 class java,es5 类与es6中class的区别小结
weixin_29309213的博客
03-10 300
前言在es5中主要是通过构造函数方式和原型方式来定义一个类，在es6中我们可以通过class来定义类，今天整理一下它们的区别。关于es5中定义类的方式，可以看这一篇js的‘类'，我们这里主要聊es5类和es6中class类的区别。一、class类必须new调用，不能直接执行。class类执行的话会报错，而es5中的类和普通函数并没有本质区别，执行肯定是ok的。二、class类不存在变量提升图2报错...
common.js和es6中模块引入的区别
He_9a9的博客
06-05 1107
common.js和es6中模块引入的区别
[Vue-常见错误]浏览器显示Uncaught runtime errors
一个喜欢什么都研究一下的小小后端程序员
06-09 353
在vue.config.js中配置关闭Uncaught runtime errors显示。
JS中一个dom元素能绑定多少事件
ggq53219的博客
06-10 516
在JavaScript中，一个DOM元素可以绑定的事件数量并没有明确的限制，这主要取决于浏览器的实现和内存限制。然而，在实际应用中，为同一个DOM元素绑定过多的事件监听器可能会导致性能问题，尤其是在事件处理函数执行复杂操作的情况下。总之，虽然JavaScript中DOM元素可以绑定的事件数量没有明确的限制，但在实际应用中应注意避免过度绑定和优化事件处理函数，以确保良好的性能和用户体验。
Web前端网站设计案例：深入剖析创意与技术的完美融合
最新发布
liyrbtqe_66w的博客
06-12 238
在性能优化方面，设计师通过压缩代码、减少HTTP请求、使用CDN等技术手段，提升了网站的加载速度和响应性能，为用户提供了更加流畅的访问体验。综上所述，本Web前端网站设计案例通过视觉设计、用户体验、技术实现、性能优化、创意表达、响应式设计和跨平台兼容等方面的综合考量，成功打造了一款既美观又实用的网站。这个案例充分展示了Web前端设计的魅力和潜力，为未来的网站设计提供了有益的借鉴和启示。设计师通过独特的视觉元素和创意构思，将品牌理念和文化内涵融入其中，使得整个网站在传达信息的同时，也展现出品牌的独特魅力。
vue3如何定义一个组件
Java程序员专栏
06-09 547
注意在子组件的 <template> 中，你使用 {{ propName }} 来显示传递进来的参数值。在父组件中，你使用 :propName="parentMessage" 来将 parentMessage 数据的值绑定到子组件的 propName prop 上。当使用 <script setup> 语法糖时，你不能直接在 <script> 标签内使用 props 选项。在 Vue 3 中，定义一个可以接收参数的组件通常是通过在组件的 props 选项中定义这些参数来完成的。// 其他组件逻辑...
ES5函数转化ES6的class
05-26
将一个ES5函数转换成ES6的class，需要遵循以下步骤： 1. 创建一个class，并给它命名。 2. 在类中使用constructor方法来代替原来的函数。constructor方法用于创建和初始化对象。 3. 在类中添加其他的方法，这些方法将成为类的实例方法。在ES5函数中定义的方法应该被移动到类中。 4. 如果需要，可以使用static关键字在类中定义静态方法。 以下是一个示例代码，展示如何将一个ES5函数转换为ES6的class： ES5函数： ``` function Person(name, age) { this.name = name; this.age = age; } Person.prototype.greet = function() { console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`); } ``` 对应的ES6 class： ``` class Person { constructor(name, age) { this.name = name; this.age = age; } greet() { console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`); } } ``` 在上面的代码中，我们创建了一个名为Person的类，并使用constructor方法代替了原来的构造函数。我们还将greet方法移动到了类中，并将它作为实例方法定义。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值