首页 > web前端 > js教程 > JavaScript 的演变

JavaScript 的演变

Linda Hamilton
发布: 2024-11-22 16:19:16
原创
196 人浏览过

卑微的出身 (1995)

JavaScript 是由 Netscape 的 Brendan Eich 开发的,旨在为网站带来交互性。它最初被称为 Mocha,后来被称为 LiveScript,为了适应 Java 的流行而获得了现在的名称。早期的使用是基本的,例如添加简单的表单验证。

1995 年代码示例:

<script>
  alert('Welcome to the 90s Web!');
</script>
登录后复制
登录后复制

在 MDN Web 文档上了解有关 JavaScript 诞生的更多信息。

ECMAScript 标准化 (1997)

为了统一语法,ECMAScript 诞生了。 ECMAScript 3 (1999) 引入了改进,为浏览器一致性奠定了基础。 ECMAScript 5 (2009) 通过严格模式和 forEach 等本机数组方法进一步现代化了 JavaScript。

数组方法示例:

['apple', 'banana', 'cherry'].forEach(fruit => console.log(fruit));
登录后复制
登录后复制

在 ECMA International 探索 ECMAScript 详细信息。

The Evolution of JavaScript

AJAX 和动态 Web(2000 年代)

AJAX(异步 JavaScript 和 XML)使 Gmail 和 Google 地图等 Web 应用程序能够刷新数据而无需重新加载页面,标志着向更丰富的 Web 体验的转变。

AJAX 请求示例:

const xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/data', true);
xhr.onreadystatechange = () => {
  if (xhr.readyState === 4 && xhr.status === 200) {
    console.log(xhr.responseText);
  }
};
xhr.send();
登录后复制

框架彻底改变了 JavaScript

jQuery (2006) 和 MooTools 的出现简化了 DOM 交互并引入了强大的跨浏览器兼容性。

Vanilla JS 与 jQuery 示例:

// Vanilla JavaScript (2005)
document.querySelector('#btn').addEventListener('click', () => alert('Clicked!'));

// jQuery (2006)
$('#btn').click(() => alert('Clicked!'));
登录后复制

在 jQuery 文档中深入了解 jQuery 的影响。

现代时代:ES6 及以后 (2015)

ECMAScript 2015 (ES6) 带来了重大更新,通过 let、const、模板文字、箭头函数、类和模块增强了编码实践。

带有类语法的 ES6 示例:

class Person {
  constructor(name) {
    this.name = name;
  }
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
}
const person = new Person('Alice');
person.greet(); // Hello, my name is Alice
登录后复制

MDN ECMAScript 2015 上的 ES6 更新参考。

Node.js 将 JavaScript 带入服务器 (2009)

Node.js 让 JavaScript 摆脱了浏览器的限制,使其能够在服务器上运行,并为全栈 JavaScript 铺平了道路。

Node.js 示例(服务器创建):

const http = require('http');
http.createServer((req, res) => {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end('Hello, world!');
}).listen(3000);
console.log('Server running at http://localhost:3000/');
登录后复制

在 Node.js 官方网站探索 Node.js。

7. 框架和库:React、Vue 和 Angular

React.js (2013) 带来了基于组件的架构,而 Vue.js (2014) 则强调易用性。 Angular (2016) 使用 TypeScript 和强大的状态管理改进了 Web 应用程序开发。

React 组件示例:

function App() {
  return <h1>Hello, React!</h1>;
}
登录后复制

有关 React 的更多信息,请参见 React Docs。

TypeScript:JavaScript 的类型安全 (2012)

TypeScript 引入了静态类型,使得在开发过程中更容易捕获错误。

TypeScript 与 JavaScript 示例:

<script>
  alert('Welcome to the 90s Web!');
</script>
登录后复制
登录后复制
The Evolution of JavaScript

TypeScript:因为 JavaScript 需要更多的纪律

沙法耶·侯赛因 ・ 10 月 14 日

#javascript #webdev #初学者 #编程



在 TypeScript 官方网站了解 TypeScript。

异步编程革命

从回调地狱到 Promises 和 async/await,JavaScript 的异步编程方法不断发展以实现更好的可读性和可维护性。

过渡示例:

['apple', 'banana', 'cherry'].forEach(fruit => console.log(fruit));
登录后复制
登录后复制

MDN 异步函数中有关异步演变的详细信息。

2024 年及以后的 JavaScript

JavaScript 的未来提出了诸如装饰器、记录和元组类型以及模式匹配等建议,反映了它满足开发人员需求的适应性。

在 TC39 提案中了解有关即将推出的功能的更多信息。


我的网站:https://Shafayet.zya.me


给你的表情包???

The Evolution of JavaScript

以上是JavaScript 的演变的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板