侧边栏壁纸
博主头像
woku博主等级

成功的路上并不拥挤

  • 累计撰写 50 篇文章
  • 累计创建 13 个标签
  • 累计收到 3 条评论

js基础

woku
2022-03-07 / 0 评论 / 0 点赞 / 75 阅读 / 3,156 字

在学习javascript之前,咱们先来说说和我们前端最贴近的

浏览器

五大主流浏览器

浏览器内核
Chromewebkit blink
IEtrident
Firfoxgecko
Safariwebkit
Operapresto

浏览器历史

1990年:蒂姆 柏钠斯 李 产出world wide web,后期移值到 C linbwww/nexus 浏览网站

1993年:美国伊利诺大学的马克 安德森 产出 MOSIAC 浏览器,此时可以显示图片(图形化浏览器)

1994年:马克 安德森和吉姆 克拉克硅图成立的公司因版权问题改名为 netscape communication corporation ,后面我们所闻知的网景公司,随后开发netscape navigator

1996年:

  • 微软收购 spy glass(伊利诺大学把MOSIAC的版权卖给了spy glass) - 此时根据MOSIAC开发出了IE 1.0

​ IE 3.0推出了JScript

  • 网景公司livescript (只能在netscape navigator上用,javascript前身)
  • Java知名度提高,网景公司和SUN公司商讨合作,liveScript改名javascript

2001年:IE6.0 JS引擎

2003年:mozilla公司利用netscape navigator源码,开发出了 firfox浏览器

2008年:google开发出Chrome浏览器,并推出V8引擎(直接翻译机器码,独立于浏览器运行),V8引擎使得Chrome浏览器速度很快

2009年:甲骨文收购sun公司

ECMA

是什么?

欧洲计算机制造联合会

干什么的?

给计算机制定一系列标准的

== 其中也包含了咱们javascript的标准,那就是ECMA-262文件(脚本语言的规范),咱们所说的ECMAScript

像ES5,ES6这种也是一种标准 ==

编程语言

  • 编译型语言

从源码 -> 通过编译器 -> 机器语言 -> 可执行文件(下一次不用重新编译)

  • 解释型语言

从源码 -> 通过解释器 -> 解释一行执行一行 (每次都需要解释一行执行一行)

编译型和解释型都需要转换成机器语言,只是一个是在运行前编译器将人类语言转换为机器语言,一个是在运行的时候转换成机器语言

脚本语言:脚本引擎解释器解释之后才能正常运行

前端后端都有脚本语言,前端属于客户端脚本,后端属于服务端脚本

优缺点:

编译型语言:缺:跨平台性不好,不同平台的可执行文件会不一样 优:速度相比解释型语言要快(只要编译了一次就不用重复编译了),一般适合于大型项目

解释型语言:跨平台好,只要电脑有解释器就能执行。缺:相对慢

编程语言都会有变量、数据结构、函数、运算这些要素

HTML和CSS是不具备逻辑,他们是标记语言

JS引擎的单线程

js引擎是单线程的,也就是一个时间段只能做一件事

但是在页面中会发现多个动效同时执行

这其实是因为JS引擎模拟多线程

重要概念:轮转时间片

这个任务做一点点,然后去做其他的一个任务,每个任务都做一点点,中间的间隔是非常快的。

  1. 任务1,任务2

  2. 将这些任务切分成任务片段

  3. 随机排列这些任务片段,形成队列

  4. 按照这个顺序将任务片段送进JS进程

  5. JS线程执行一个又一个的任务片段

走进Javascipt

JS的2种引入方式

  • 外部引用

     <script type="text/javascript" src="01.js"></script>
    
  • 内部引用

        <script type="text/javascript">
            console.log('heiyg')
        </script>
    

    type="text/javascript" ,这种才是javascript的脚本。

    我们也可以自己定义type

        <script type="text/templateA" id="templateA">
            <div>
                {{name}}
            </div>
        </script>
    

    这种里面一般是html代码块,被用来作为一个模板,后面将里面的内容进行替换

变量

是什么?

用来存储数据的一块空间,这块空间要怎么来呢?

声明变量

<script>
  var a; // 声明变量
  a = 1; // 给变量赋值
  // 向系统申请一块空间,命名为a,然后将数据1保存到这块空间

  // -----------------
  var b = 1  // 声明并赋值,相当于上面的两步

  // -----------------
  // 单一声明方式 (一个var声明多个变量)
  var c,
      d;

  console.log(a,b,c,d)
</script>

变量的重复赋值

<script>
  var a = 1;
  a = 2;
  console.log(a);
</script>

变量的命名规范

在开发中,变量的名字遵循以下规范

  • 不能以数字开头
  • _,$,字母开头
  • 中间可以包含_,$,数字和字母
  • 不能使用JS关键字和保留字
  • 语义化命名
  • 小驼峰命名 myName blogList

弱类型语言

1.从语法层面看,js是弱类型语言。

<script>
  var a = 1
  var a = 3.14
  var a = 'hello world'
  // a变量的数据类型是由值来决定的,可以动态变化(动态语言)
</script>

与js弱类型语言相反的是强类型语言:例如Java C#等

String s = "runoob";
double pi = 3.14159;
int d = 3, e = 4, f = 5;

数据类型

原始值:Number String Boolean undefined null

Number

在js中,不管值是整数还是浮点的,都是Number类型的

var a = 1;
var b = 1.34;

String

var c = 'heiyg'  // 用''或者“”包起来的是字符串类型

Boolean

var flag = true  // 只有2种值  true和false

undefined

表示值未赋值

var myName;console.log(myName)  // undefined

null

引用值:array object function RegExp date


注意 原始值与引用值的区别

原始值存放在栈内存中

ads via Carbon
var a = 1;var b = a;a = 2console.log(b)
  1. 将1008空间变为a,放入1

    ads via Carbon
  2. 申请一个空间叫b,把a的值拷贝一份赋值给b

    此时打印b,b仍然是1,拷贝了一份a的值。

    1. a重新赋值

      这里最开始声明的那块a的空间是不能更改的,a还原为1008,对应的数据还在。当用完空间之后就重新覆盖这些值。

      在下面新增一个a空间,值为2

    引用类型的值是存在堆内存,地址存在栈内存

    var a = [1,2,3] // a的地址在栈中存放,实际的值在堆中var b = a  // a的地址赋值给了b  在栈中开辟一个新空间叫b,里面存放a的地址a.push(4)console.log(b) // [1,2,3,5]  // a,b是指向的同一个地址,a地址对应的值改变,b一样的跟着变化a = [1,2]  // a是重新开辟了空间,地址也是指向的另一个console.log(b) // [1,2,3,5] // 此时a和b不是指向同一块空间
    

typeof

返回变量的数据类型

注意下面的几个点:

<script>     //console.log(a)  //将会报错     console.log(typeof(a))  // undefined</script>
<script>    var a = '123'    console.log(typeof(typeof(a))  //string                      // 任意返回了变量数据类型的之后再使用typeof都会返回string</script>
0

评论区