ES6 vs Native javascript

image credit: link

“Native” in JavaScript typically refers to features or functionalities that are implemented directly in the JavaScript engine, without requiring additional libraries or frameworks. These are the built-in capabilities provided by the language itself.

“ES6” (ECMAScript 2015) refers to the sixth edition of the ECMAScript standard, which introduced significant enhancements and new features to the JavaScript language. These features are part of the ECMAScript standard and are supported by modern JavaScript engines.

Here’s a comparison between “native” JavaScript features and those introduced in ES6:

Native JavaScript Features:

1. Data Types and Operators: JavaScript provides built-in data types such as Number, String, Boolean, Object, Array, etc., along with operators like arithmetic, comparison, logical, etc.
2. Functions: JavaScript functions are first-class citizens, meaning they can be assigned to variables, passed as arguments, and returned from other functions.
3. Control Flow: JavaScript supports control flow statements like if…else, switch, for, while, etc., for program flow control.
4. DOM Manipulation: JavaScript can manipulate the Document Object Model (DOM) to interact with HTML elements and modify their properties and attributes.
5. Event Handling: JavaScript allows the handling of user events such as clicks, keypresses, mouse movements, etc., to trigger specific actions.

ES6 Features:

1. Arrow Functions: A concise syntax for writing function expressions, with implicit return and lexical this binding.
2. let and const: Block-scoped variable declarations, providing better control over variable scope and immutability with const.
3. Template Literals: A more expressive way to create strings using backticks (`) for string interpolation and multiline strings.
4. Destructuring Assignment: Extracting values from arrays or objects into individual variables using a shorthand syntax.
5. Spread and Rest Operators: Spread (…) for expanding arrays/iterables into individual elements, and Rest (…) for gathering remaining parameters into an array.
6. Classes: Syntactic sugar for prototype-based inheritance, providing a more familiar syntax for defining object-oriented classes.
7. Promises: A built-in mechanism for handling asynchronous operations, simplifying asynchronous code and error handling with then() and catch() methods.
8. Modules: A standardized way to organize and structure JavaScript code into reusable modules, improving code maintainability and scalability.
9. Async/Await: Syntactic sugar for working with asynchronous code, making it easier to write and understand asynchronous functions using async and await keywords.
10. Map, Set, WeakMap, WeakSet: New data structures for storing unique values and key-value pairs, providing alternatives to traditional arrays and objects.

In summary, while “native” JavaScript features form the foundation of the language, ES6 introduces modern syntax, conveniences, and improvements to make JavaScript code more expressive, readable, and maintainable. These ES6 features are now widely supported in modern browsers and are commonly used in modern JavaScript development.