JavaScript（一）：JavaScript简介

时间 2019-11-21

原文原文链接

1、什么是JavaScriptjavascript

JavaScript是一种具备面向对象能力的、解释性的程序设计语言。更具体一点，它是基于对象和事件驱动并具备相对安全性的客户端脚本语言。由于他不须要在一个语言环境下运行，而只须要支持它的浏览器便可。它的主要目的是：验证发往服务器端的数据的合法性、增长web互动、增强用户体验度等。html

基于对象：JavaScript中内置了不少对象，直接调用对象的属性和方法进行操做，简化编程。
事件驱动：程序开始运行到结束，能够一直侦听事件。
解释性语言：不须要编译成计算机专门去读的文件，调用哪块解释哪块，并不是一次性编译。例如：c#就是编译性语言，若是要运行C#语言编写的程序，就必须先编译成exe或者dll文件才能运行。而JavaScript不须要预先编译
脚本语言：须要嵌入到别的语言之中，JS须要嵌入在HTML中，单独存在没有意义。

2、JavaScript和ECMAScript的关系java

ECMAScript是JavaScript的标准和基础

3、JavaScript特色
一、松散性（弱类型）
JavaScript语言核心与C、C++、Java类似，好比条件判断、循环、运算符等。可是，它倒是一种松散类型的语言，也就是说，它的变量没必要具备一个明确的类型。（变量无需声明也可使用，一个变量赋值为数字类型，还能够在赋值为字符串等其它类型）
二、对象属性
JavaScript中的对象把属性名映射为任意的属性值。它的这种方式很像哈希表或关联数组，而不像C中的结构体或者C++、Java中的对象。
三、继承机制
JavaScript中的面向对象继承机制是基于原型的（原型：最基础的基类），和C++以及Java中的继承大不相同（能够子类继承父类）。web

四、严格区分大小写。编程

4、JavaScript组成部分
一个完整的JavaScript应该由下列三个不一样的部分组成：c#

一、核心（ECMAScript）
主要定义了JavaScript的语言基础部分，各个浏览器都严格遵照该规范，没有兼容性问题，ECMAScript规范由ECMA制订。组成部分：语法、类型、语句、关键字、保留字、操做符、对象等。
二、文档对象模型（DOM）
文档对象模型（Document object Model）主要定义了如何将HTML转换成一颗符合DOM规范的树，而且如何对这棵树进行相应的操做。该规范由W3c定义，可是，部分浏览器没有严格遵照该规范，写代码时须要考虑兼容性问题。

HTML和XML的应用程序接口（API）。
把整个页面规划为层级式的节点结构。

三、浏览器对象模型（BOM）
浏览器对象模型（Browser Object Model）内置了一些对象，用来操做窗口，这些对象包括window、screen、location、navigator、document、xmlhttprequet,虽然该部分没有规范，可是，各个浏览器都支持这些对象。开发人员使用BOM能够控制浏览器显示页面之外的部分。而BOM真正不同凡响的地方（也是常常会致使问题的地方），仍是它做为JavaScript实现的一部分，至今仍没有相关的标准。

可对浏览器窗口进行访问和操做，包括：

弹出新的浏览器窗口。数组

移动、关闭浏览器窗口及调节浏览器窗口大小。浏览器

获取用户屏幕分辨率的屏幕对象。缓存

web浏览器详细的定位对象。安全

5、使用JavaScript

一、<Script>标签解析
<script>xxx</script>这组标签，是用于在HTML页面中插入JS的主要方法。它主要有如下几个属性：
一、charset：可选。表示经过src属性指定的字符集。因为大多数浏览器忽略它，因此不多有人用它。
二、defer：可选。表示脚本能够延迟到文档彻底被解析和显示以后再执行。因为大多数浏览器不支持，故不多用。
三、language：已废弃。原来用于代码使用的脚本语言。因为大多数浏览器忽略它，因此不要用了。
四、src：可选。表示包含要执行代码的外部文件。
五、type：必需。能够看做是language的替代品。表示代码使用的脚本语言的内容类型。范例：type="text/javascript"

<scripe>标签示例：

6、JavaScript使用方式：
一、事件定义式：在定义事件时直接写入JavaScript脚本。

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>事件定义式</title>
</head>
<body>
    <input type="button" value="点击" onclick="alert('我被点击了')" />
</body>
</html>

效果：

二、直接嵌入式：在网页中直接嵌入JavaScript。

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>直接嵌入式</title>
    <script>
       function btnClick(){
           alert("我是写在head里面的JavaScript");
       };
    </script>
</head>
<body>
    <input type="button" value="点击" onclick="btnClick()" />
    <script>
       alert("我是写在body里面的JavaScript");
    </script>
</body>
</html>

效果：

注意：

使用直接嵌入式的时候，JavaScript脚本能够写在<head>标签里面，也能够写在<body>标签里面。

三、文件调用式：在网页中调用独立的JavaScript文件。把js代码写在单独的一个js文件中，经过src属性引入便可。它具备维护性高、可缓存（加载一次，无需再次加载）、方便将来扩展的特色。

例如：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>文件调用式</title>
    <script src="../demo.js"></script>
</head>
<body>
    <input type="button" value="点击" onclick="btnClick()" />
</body>
</html>

注意：一、使用外部样式引入js，虽然没有任何代码了，但也不能使用单标签：<script type="text/javascript" src="demo.js"/>二、不能再里面添加任何代码，添加的代码执行不到<script type="text/javascript" src="demo.js">alert('我很可怜，由于执行不到')</script>