一、 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. 采用最简单的方式在ASP.NET Core应用中实现认证、登录和注销

    在安全领域,认证和授权是两个重要的主题.认证是安全体系的第一道屏障,是守护整个应用或者服务的第一道大门.当访问者请求进入的时候,认证体系通过验证对方的提供凭证确定其真实身份.认证体系只有在证实了访问者 ...

  2. bash中的if条件语句报错[: missing `]'

    这是我的一个小demo #!/bin/bash read -p "请输入3个数:" n1 n2 n3 if [ $n1 -gt $n2 ] && [ $n1 -gt ...

  3. 一款带Web面板的轻量级、高性能内网穿透工具：nps使用教程

    说明:内网穿透工具之前已经介绍了不少了,比如Frp.lanproxy.Holer等,现在再介绍个带Web面板的穿透工具nps,之前叫easyProxy,只是改名了而已,该工具是一款使用go语言编写的轻 ...

  4. VS code调试代码快速上手必备知识

    一.通过简单的配置运行一个JavaScript程序 1.打开(创建)一个新的工作空间(文件夹),并创建一个js文件: var name='world'; var s='Hello,${name}!'; ...

  5. 我们是怎么实现Grpc CodeFirst

    前言: Grpc默认是ProtoFirst的,即先写 proto文件,再生成代码,需要人工维护proto,生成的代码也不友好,所以出现了Grpc CodeFirst,下面来说说我们是怎么实现Grpc ...

  6. python之道14

    看代码写结果: def wrapper(f): def inner(*args,**kwargs): print(111) ret = f(*args,**kwargs) print(222) ret ...

  7. OpenCV-Python BRIEF(二进制的鲁棒独立基本特征) | 四十二

    目标 在本章中,我们将看到BRIEF算法的基础知识 理论 我们知道SIFT使用128维矢量作为描述符.由于它使用浮点数,因此基本上需要512个字节.同样,SURF最少也需要256个字节(用于64像素) ...

  8. 磐创AI GPU租用平台上线，1小时不到1块钱

    >> 小白也能看懂的PyTorch从入门到精通系列 << 今天磐创AI GPU租赁平台上线了!!!为大家解决用GPU难的问题!一块10G显存的GPU,1小时租用费用不到1块钱, ...

  9. lvs + keepalived + gninx 高性能负载均衡

    1,nginx 作为负载均衡器,在应用层实现了负载均衡和反向代理,在分布式集群中,能够有效的去处理大数据量,高访问的应用.但是,如果nginx 服务挂了怎么办? 为此,可以实现两台nginx或者多台n ...

  10. [算法]合并链表&删除数组重复项

    合并链表 题目 将两个有序链表合并为一个新的有序链表并返回.新链表是通过拼接给定的两个链表的所有节点组成的. 示例: 输入:1->2->4, 1->3->4 输出:1-> ...