Javascript框架是用于簡化web開發的工具，可以加速開發流程，提高開發效率并降低錯誤率。在這篇文章中，我們將詳細介紹常用的javascript框架，以及它們的特點、優缺點、用途舉例等方面。

jQuery:

$(document).ready(function() {
console.log("Hello World!");
});

jQuery是目前最常用的javascript框架之一。它提供了許多預定義的函數和方法，使得DOM操作和事件處理變得輕松。比如，選擇器可以幫助您以簡單的方式選擇一個元素，而不必依賴于文檔結構和元素ID。在上面的例子中，我們使用jQuery的選擇器來選擇整個文檔，然后使用.ready()方法在文檔完全加載完成時調用回調函數。

React:

class HelloWorld extends React.Component {
render() {
return (
<p>Hello World!</p>
);
}
}
ReactDOM.render(
<HelloWorld/>,
document.getElementById('root')
);

React 是一個用于構建用戶界面的JavaScript庫。它通過使用組件分解應用程序為獨立的模塊，以實現高可復用性和可維護性。在上述示例中，我們定義了一個名為HelloWorld的React組件，該組件只包含一個靜態文本字符串。然后，我們將該組件傳遞給ReactDOM.render()方法，并將其渲染到指定的DOM元素中。

Angular:

angular.module('app', [])
.controller('HelloWorld', function($scope) {
$scope.message = 'Hello World!';
});

AngularJS是一個基于MVC架構的JavaScript框架。它提供了一個依賴注入系統，使得開發變得更加模塊化。在上面的示例中，我們創建一個名為HelloWorld的控制器，并將它綁定到名為“app”的模塊上。我們還定義了一個名為message的屬性，該屬性存儲一個靜態文本字符串。最后，我們在HTML代碼中使用ng-controller指令來告訴AngularJS將我們的控制器與HTML元素相關聯。

Vue.js:

new Vue({
el: '#app',
data: {
message: 'Hello World!'
}
});

Vue.js是一個漸進式JavaScript框架，它具有非常小的體積和簡單的API。它使用核心庫來處理視圖層，并使用第三方庫來處理狀態管理和路由。在上面的示例中，我們使用Vue構造函數創建一個Vue實例，將其與名為“app”的DOM元素關聯，并定義一個名為message的屬性，該屬性存儲一個靜態文本字符串。

總結：

以上是javascript框架的詳細介紹，它們各自有著不同的優點和適用場景。選擇正確的框架可以為項目提供更好的性能、可維護性和可擴展性。