一、 JavaScript 是什么

JavaScript是一种运行在客户端（浏览器）的脚本语言

客户端：客户端是相对于服务器而言的，在这里先简单理解为浏览器

浏览器就是一个客户端软件，浏览器从服务器上将资源（html,css,js,图片等）请求下来 并且在本地利用浏览器去解析这些资源

服务器本质上也是一台电脑。用来接收客户端发过来的请求，并处理请求。同时存储数据 读取数据等操作

脚本语言：不需要编译 读取一句 解析一句 一句报错 下一句不会继续执行

执行过程：源代码 - 预解析 - 运行

编译语言：需要编译 编译一旦出错 整个程序都不会运行

执行过程：源代码 - 编译后的字节码文件 - 运行

二、 JavaScript 历史

Nombas与ScriptEase

大概在 1992 年，一家称作 Nombas 的公司开发了一种叫做 C 减减（C-minus-minus，简称 Cmm）的嵌入式脚本语言,并将这个脚本语言捆绑在一个可以嵌入到浏览的2的共享软件中，代表了第一个在万维网上使用的客户端语言。后来由于mm听起来比较消极，Nombas又将Cmm的名字修改为ScriptEase.虽然Nombas如今在互联网行业已经销声匿迹，但是它的理念却成为因特网的一块重要基石。

Netscape与JavaScript

当网上冲浪越来越流行时，对于开发客户端脚本的需求也逐渐增大。那时，大部分因特网用户还仅仅通过 28.8 kbit/s 的调制解调器连接到网络，即便这时网页已经不断地变得更大和更复杂。而更加加剧用户痛苦的是，仅仅为了简单的表单有效性验证，就要与服务器进行多次地往返交互。设想一下，用户填完一个表单，点击提交按钮，等待了 30 秒的处理后，看到的却是一条告诉你忘记填写一个必要的字段。

为了解决这一问题，NetScape公司的 Brendan Eich 开始为即将在1995年发行的 Netscape Navigator 2.0浏览器开发一款名为LiveScript的脚本语言，最终NetScript与Sun公司合作完成了LiveScript,并且将这种语言命名为JavaScript.

微软与JScript

在JavaScript 1.1 版本发布时，微软公司也决定进军浏览器行业。微软公司在推出的IE 3.0上搭载了一个JavaScript的克隆版，并且命名为JScript.

ECMAScript

在微软进入后，有 3 种不同的 JavaScript 版本同时存在：Netscape Navigator 3.0 中的 JavaScript、IE 中的 JScript 以及 CEnvi 中的 ScriptEase.和其他编译语言不同的是，JavaScript 并没有一个标准来统一其语法或特性，而这 3 种不同的版本恰恰突出了这个问题。

1997 年，JavaScript 1.1 作为一个草案提交给欧洲计算机制造商协会（ECMA）.ECMA指派由来自 Netscape、Sun、微软、Borland 和其他一些对脚本编程感兴趣的公司的程序员组成的第 39 技术委员会(TC39) 锤炼出了 ECMA-262，该标准定义了名为 ECMAScript 的全新脚本语言。

总结：Javascript是ECMAscript的一个实现 并且在此基础上扩展了DOM和BOM

三、 JavaScript 的组成

  • ECMAscript： JavaScript的核心，描述了语言的基本语法和数据类型，ECMAScript是一套标准，定义了一种语言的标准与具体实现无关
  • DOM：（document object model 文档对象模型）一套操作页面元素的API
  • BOM：（browser object model 浏览器对象模型）一套操作浏览器功能的API

四、 JavaScript 的写入方式

1.行内式

<div onclick="alert('行内引入')">点我试试</div>

2. 内嵌式

<body>

    <div>点我试试</div>

    <script>

        alert('试试就试试');

    </script>

</body>

3. 外链式

<script src="./03.外链式.js"></script>

注意：当一个script标签已经作为引入标签时，里面放入任何值，都是无效的。

内嵌式和外链式js文件写在哪里都会生效，但是一般都将js文件写在body的末尾。

五、 JavaScript 的输出语句

    <div onclick="alert('警示框')">弹出警示框</div>

    <div onclick="prompt('输入框')">弹出输入框</div>

    <div onclick="console.log('只能在控制台看到')">控制台看到</div>

    <div onclick="confirm('用户选择框')">用户选择确定或取消</div>

    <script>

        document.write('<h1>在html页面中打印东西，可以解析html标签</h1>');

    </script>

alert:弹出框，会阻断下面代码的执行

console.log：控制台输出

prompt：用户可以输入内容，点击取消返回null

confirm：点击确认返回true，点击取消返回false

document.write：可以在页面中打印元素，还可以写入html标签

六、 JavaScript 的变量

1.变量的声明和赋值

    <script>

        // 定义变量

        var age;

        // 给变量赋值

        age = 23;

        // 输出变量

        alert(age);

        // 变量初始化：定义变量时同时复制

        var myName = '小艾同学';

        alert(myName);

        // 更新变量

        var address = 'www.baidu.com';

        var address = 'www.sougou.com';

        // 下面的变量会层叠掉上面的变量

        alert(address);

        // 同时声明和输出多个变量

        var age = 18, name = '小艾同学', sex = 2;

        alert(age + name + sex);

    </script>

1.1 变量的声明和赋值特殊情况

    <script>

        // 只声明，不赋值

        // var age;

        // console.log(age);//undefined，未定义的

        // 不声明，不赋值，直接使用

        // console.log(sex);//报错sex is not defined

        //不声明，只赋值

        address = 66;

        console.log(address);

    </script>

2.变量的数据类型

2.1 基本数据类型

number数据类型：所有的数字都是number类型，特殊值：NaN not a number 不是一个数字。

String数据类型：所有用引号包裹的都是字符串

boolean数据类型：false，true

undefined数据类型：未定义，未赋值

null数据类型：空

2.2 引用数据类型

object对象

array数组

function函数

2.3 区别

1.基本数据类型是指存放在栈中的简单数据段，数据大小确定，内存空间大小可以分配，它们是直接按值存放的，所以可以直接按值访问。

2.引用类型是存放在堆内存中的对象，变量其实是保存的在栈内存中的一个指针（保存的是堆内存中的引用地址），这个指针指向堆内存。

引用类型数据在栈内存中保存的实际上是对象在堆内存中的引用地址。通过这个引用地址可以快速查找到保存中堆内存中的对象

3.基本数据类型从一个变量向一个变量复制时，会在栈中创建一个新值，然后把值复制到为新变量分配的位置上，改变源数据不会影响到新的变量（互不干涉）

4.引用类型复制的是存储在栈中的指针，将指针复制到栈中为新变量分配的空间中，而这个指针副本和原指针执行存储在堆中的同一个对象，复制操作结束后，两个变量实际上将引用同一个对象；因此改变其中的一个，将影响另一个；

3.数据交换案例

    <script>

        var num1 = 100;

        var num2 = 200;

        // 使num1与num2互换值

        // 建立一个临时变量，将num1复制一份赋值给temp

        var temp = num1;

        // 将num2复制一份赋值给num1

        num1 = num2;

        // 最后把temp的复制一份值赋值给num2

        num2 = temp;

        console.log('num1:' + num1);

        console.log('num2:' + num2);

    </script>


        var num3 = 10;

        var num4 = 20;

        num3 = num3 + num4;//num3 = 10 + 20

        num4 = num3 - num4;//num4 = 10 + 20 - 20 = 10

        num3 = num3 - num4;//num3 = 10 + 20 - 10 = 20

        console.log('num3:' + num3);

        console.log('num4:' + num4);

11-JS变量的更多相关文章

  1. 详解js变量、作用域及内存

    详解js变量.作用域及内存 来源:伯乐在线 作者:trigkit4       原文出处: trigkit4    基本类型值有:undefined,NUll,Boolean,Number和Strin ...

  2. JS变量写到HTML页面中并修改变量值(前台处理数据序号问题)

    有时候我们在前台需要对序号进行处理,我们需要将JS变量写到页面中进行显示. 第一种方式:后台处理 第二种方式:JS中定义全局变量,然后进行显示,可以书写一个JS函数对不同的需要进行不同的替换,也就可以 ...

  3. js字符串转换为数字的三种方法。（转换函数）（强制类型转换）（利用js变量弱类型转换）

    js字符串转换为数字的三种方法.(转换函数)(强制类型转换)(利用js变量弱类型转换) 一.总结 js字符串转换为数字的三种方法(parseInt("1234blue"))(Num ...

  4. C++11特性——变量部分（using类型别名、constexpr常量表达式、auto类型推断、nullptr空指针等）

    #include <iostream> using namespace std; int main() { using cullptr = const unsigned long long ...

  5. js变量及其作用域（附例子及讲解）

    Javascript和Java.C这些语言不同,它是一种无类型.弱检测的语言.它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量   工具/原料   Ch ...

  6. javascirpt对象运用与JS变量

    abcdefghijklmnopqrstuvwyz String 对象方法 charAt() 方法可返回指定位置的字符.stringObject.charAt(index)(index从0开始)[ht ...

  7. js变量及其作用域

    Javascript和Java.C这些语言不同,它是一种无类型.弱检测的语言.它对变量的定义并不需要声明变量类型,我们只要通过赋值的形式,可以将各种类型的数据赋值给同一个变量   一.js变量的类型及 ...

  8. JS变量和函数的一些理解

    今日看了下JS变量的一些文章,有些感触,把自己总结的一些写出来. JS初始化的过程1.JS解释器执行代码之前,创建全局变量2.用预定义的值和函数来初始化全局对象中的属性,3.搜索函数外的var声明,创 ...

  9. js变量在属性里的写法 常用mark 多个DL遍历添加一个父级DIV

    标记用 js变量比如url链接一般都是a里面的href属性值 在js里单引号链接 以后再忘记就能有地方找了 例子: /* 添加1200 居中div 包裹 获取元素集合 上层元素100% * @ele ...

  10. js 变量提升+方法提升

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

随机推荐

  1. 【面试QA】Attention

    目录 Attention机制的原理 Attention机制的类别 双向注意力 Self-Attention 与 Soft-Attention 的区别 Transformer Multi-Head At ...

  2. java获取近几天的日期

    最近在写接口的时候老遇见从mysql中获取近几天数据的需求,获取日期这块不是很熟,网上看了很多但是代码量都太大,还是问了下别人,写了三行代码就解决了,不多说 贴代码了 下面是我获取近十天,每天的日期: ...

  3. Manjaro更新后　搜狗拼音输入法突然无法正常使用

    之前Manjaro已经用了很久了,很多该配置的都已经配置好了,但是搜狗拼音在系统更新后突然无法使用 1检查 如下依赖 2．检查配置文件 3．发现一切配置没问题,此时输入 sogou-qimpanel ...

  4. 如何删除Python中文本文件的文件内容？

    在python中: open('file.txt', 'w').close() 或者,如果你已经打开了一个文件: f = open('file.txt', 'r+') f.truncate(0) # ...

  5. 在C 中加载TorchScript模型

    本教程已更新为可与PyTorch 1.2一起使用 顾名思义,PyTorch的主要接口是Python编程语言.尽管Python是合适于许多需要动态性和易于迭代的场景,并且是首选的语言,但同样的,在 许多 ...

  6. 编译原理：DFA最小化，语法分析初步

    1.将DFA最小化:教材P65 第9题   解析: 2.构造以下文法相应的最小的DFA S→ 0A|1B A→ 1S|1 B→0S|0 解析: S→ 0A|1B →S → 0(1S|1)|1(0S|0 ...

  7. 树莓派3B+之Raspbian系统的安装

    概述 因为之前一段时间在研究物联网的原因,所以对树莓派这个东西早就有所耳闻.在我的印象里,树莓派几乎无所不能,它可以用来学编程. 搞物联网. 做服务器,甚至还能用它来进行渗透测试.终于,没禁的住诱惑, ...

  8. Thread---重排序

    重排序 数据依赖性 如果两个操作访问同一个变量,且这两个操作中有一个为写操作,此时这两个操作之间就存在数据依赖性.数据依赖分下列三种类型: 名称 代码示例 说明 写后读 a = 1;b = a; 写一 ...

  9. 使用tensorflow实现cnn进行mnist识别

    第一个CNN代码,暂时对于CNN的BP还不熟悉.但是通过这个代码对于tensorflow的运行机制有了初步的理解 ''' softmax classifier for mnist created on ...

  10. spring 事务源码赏析（一）

    在本系列中,我们会分析:1.spring是如何开启事务的.2.spring是如何在不影响业务代码的情况下织入事务逻辑的.3.spirng事务是如何找到相应的的业务代码的.4.spring事务的传播行为 ...