JavaScirpt(JS)——js介绍及ECMAScript

一、JavaScript历史发展

　　JavaScript语言的历史：http://javascript.ruanyifeng.com/introduction/history.html

　　1994年12月，Navigator发布了1.0版，市场份额一举超过90%。Netscape 公司很快发现，Navigator浏览器需要一种可以嵌入网页的脚本语言，用来控制浏览器行为。当时，网速很慢而且上网费很贵，有些操作不宜在服务器端完成。比如，如果用户忘记填写“用户名”，就点了“发送”按钮，到服务器再发现这一点就有点太晚了，最好能在用户发出数据之前，就告诉用户“请填写用户名”。这就需要在网页中嵌入小程序，让浏览器检查每一栏是否都填写了。

　　1995年，Netscape公司雇佣了程序员Brendan Eich开发这种网页脚本语言。Brendan Eich有很强的函数式编程背景，希望以Scheme语言（函数式语言鼻祖LISP语言的一种方言）为蓝本，实现这种新语言。为了保持简单，这种脚本语言缺少一些关键的功能，比如块级作用域、模块、子类型（subtyping）等等，但是可以利用现有功能找出解决办法。

　　最初名字叫做 Mocha，1995年9月改为LiveScript。12月，Netscape公司与Sun公司（Java语言的发明者和所有者）达成协议，后者允许将这种语言叫做JavaScript。这样一来，Netscape公司可以借助Java语言的声势。

　　1996年8月，微软模仿JavaScript开发了一种相近的语言，取名为JScript。威胁浏览器脚本语言的主导权

　　1996年11月，Netscape公司决定将JavaScript提交给国际标准化组织ECMA（European Computer Manufacturers Association），希望JavaScript能够成为国际标准。

　　1997年7月，ECMA组织发布262号标准文件（ECMA-262）的第一版，规定了浏览器脚本语言的标准，并将这种语言称为ECMAScript。这个版本就是ECMAScript 1.0版。ECMAScript和JavaScript的关系是，前者是后者的规格，后者是前者的一种实现。

　　ECMAScript只用来标准化JavaScript这种语言的基本语法结构，与部署环境相关的标准都由其他标准规定，比如DOM的标准就是由W3C组织（World Wide Web Consortium）制定的。

二、js的引入方式和输出

1、javascript有三种引入方式

　　1.行内引入

　　<开始标签 on+事件类型=“js代码”></结束标签>

　　行内引入方式必须结合事件来使用，但是内部js和外部js可以不结合事件。

<body>  
    <input type="button" onclick="alert('行内引入')" value="button" name="button">  
    <button onclick="alert(123)">点击我</button>  
</body>

　　2.内部引入

　　在head或body中，定义script标签，然后在script标签里面写js代码。

<!--内部式 建议
引入的时候要在body之后，我们要等待所有的dom元素加载完成之后再去执行相应的js操作-->
<script type="text/javascript">
    function clickhandler() {
        // 弹出警告框
        /* 丹参滴丸无
            阿达 阿达
        */
        alert(1);
    }
</script>

　　3.外部引入

　　定义外部js文件(.js结尾的文件)。

<head>
    <!--外链式-->
    <script src="1.js"></script>
</head>

　　注意：

　　1. script标签一般定义在head或body中。

　　2. Script标签要单独使用，要么引入外部js，要么定义内部js，不要混搭；使用外部的JS文件，它具有维护性高、可缓存(加载一次，无需加载)、方便未来扩展、复用性高等特点。新建外部的js文件1.js文件。

alert("外部引入")

2、javascript输出方式

//document.write()向文档内输入内容，不会覆盖原文档的内容
document.write('<span class="span1">233<span>')
//console控制台 输出【开发者工具】
console.log('星儿今天很漂亮！')   //向控制台抛出一个信息
console.error('错误了')   //向控制台抛出一个异常
console.dir(window)    //console.dir()输入一个对象的全部属性
console.clear()     //清除
每个能独立完成一个功能的代码以分号结束，这就是一个代码块

alert()  //弹出一个带有一条指定信息的消息
innerHTML/innerText   //获取或者向指定元素内添加内容
innerHTML   //获取元素内所有的内容（包括元素），还可以解析内容的样式
innerText    //获取元素内的文本内容

三、变量

1、JS中变量的含义

　　程序运行过程中它的值是允许改变的量。与它对应的就是常量：即在程序运行过程中它的值是不允许改变的量。

　　变量是用来储存信息的容器，由于JS是松散数据类型，所以变量中可以放置任何的数据类型。

　　js是跟python一样同样是弱类型的语言，python中定义变量没有关键字： str = ‘alex’；但是在js中定义变量使用关键字：var str = ‘alex’；

注意：

　　（1）声明创建变量使用var关键字，“var a;”此时这个变量中什么都没有，获取变量中返回值时，返回值为udefined。

　　（2）“=”在js中是赋值的意义将等号右边的值赋值给等号左边的变量。“+=”在js中是保留原来的值上累加。

　　（3）一次声明多个变量：每个变量用逗号隔开，一般会相同数据类型使用一个声明　　　　　

var a = [], fn = function(){}, num=5

2、JS变量的声明

　　1.先声明后定义

// js中代码的执行顺序：自上往下
// 声明
var dog;
alert(dog)  //undefined 未定义
// 定义
dog = "小黄";
alert(dog)

　　2.声明立刻定义

var dog_2 = '小红';
console.log(dog_2); //小红

3、JS变量名规范

严格区分大小写
命名时名称可以出现字母、数字、下划线、$ ,但是不能数字开头，也不能纯数字，不能包含关键字和保留字。
```
关键字：var number等

除了关键字 top name 也尽量不使用。
```
推荐驼峰命名法：有多个有意义的单词组成名称的时候，第一个单词的首字母小写，其余的单词首字母写
```
//建议使用驼峰标识来对变量进行命名
var myHousePrice = "$1234";
```
匈牙利命名：就是根据数据类型单词的的首字符作为前缀

关键字：

JavaScirpt(JS)——js介绍及ECMAScript

保留字：

JavaScirpt(JS)——js介绍及ECMAScript

四、数据类型

　　js中有两种数据类型：基本数据类型和引用数据类型

　　基本数据类型指的是简单的数据段，包含数字number、字符串string、布尔、null、undefined。

　　引用数据类型指的是有多个值构成的对象，包含对象数据类型（数组array、对象object、正则REGEXP）和函数数据类型（function）。

　　当我们把变量赋值给一个变量时，解析器首先要确认的就是这个值是基本类型值还是引用类型值。

五种基本数据类型如下所示：

1、数字（number）

// 1.数字类型
var a = 123;
console.log(a)
// typeof 检查当前变量是什么数据类型
console.log(typeof a)

//特例
var e1 = 5/8;
console.log(typeof e1)
console.log(e1)// Infinity无限大. number类型

2、字符串（string）

// 2.字符串类型
var str = "123";
console.log(str)
console.log(typeof(str))

3、布尔（boolean）

// 3.boolean类型
var b1 = true;
var b2 = false;
console.log(b1)
console.log(typeof b1)

4、空值Null

// 4.null
var c1 = null;  //空对象,object类型
console.log(c1)
console.log(typeof c1)

5、空值Undefine

// 5.undefined
var d1;
console.log(d1)
console.log(typeof d1)

　　五种数据类型代码示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本数据类型</title>
</head>
<body>
    <script type="text/javascript">
        // js中有两种数据类型：基本数据类型和引用数据类型
        // 基本数据类型：number  string boolean null undefined
        // 1.数字类型
        var a = 123;
        console.log(a)
        // typeof 检查当前变量是什么数据类型
        console.log(typeof a)

        //特例
        var e1 = 5/8;
        console.log(e1)// Infinity无限大. number类型
        console.log(typeof e1)

        // 2.字符串类型
        var str = "123";
        console.log(str)
        console.log(typeof(str))

        // 3.boolean类型
        var b1 = true;
        var b2 = false;
        console.log(b1)
        console.log(typeof b1)

        // 4.null
        var c1 = null;  //空对象,object类型
        console.log(c1)
        console.log(typeof c1)

        // 5.undefined
        var d1;
        console.log(d1)
        console.log(typeof d1)
    </script>
</body>
</html>

基本数据类型代码示例