为了账号安全,请及时绑定邮箱和手机立即绑定

00-JavaScript基础-基本概念

标签:
JavaScript

计算机常识

  • 计算机只能识别0和1

  • 计算机所能识别的指令都是由0和1组成的

  • 计算机中存储和操作的数据都是0和1

计算机程序是什么?

  • 一组计算机能识别和执行的指令(机器语言)

  • 程序是为了告诉计算机"做某件事或解决某个问题"而用"计算机语言编写的命令序列(语句)"

  • 只要让计算机执行这个程序,计算机就会自动地、有条不紊地进行工作,计算机的一切操作都是由程序控制的,离开程序计算机将一事无成

什么是编程语言?

  • 编程语言就是人和计算机交流的工具,人类通过编程语言来控制、操作计算机

  • 编程语言和我们说的中文、英文本质上没有区别,只是语法比较特殊

编程语言分类

  • 机器语言

    • 所有的代码里面只有0和1, 0表示不加电,1表示加电(纸带存储时 1有孔,0没孔)

    • 优点:直接对硬件产生作用,程序的执行效率非常高

    • 缺点:指令又多又难记、可读性差、无可移植性

  • 汇编语言

    • 符号化的机器语言,用一个符号(英文单词、数字)来代表一条机器指令

    • 优点:直接对硬件产生作用,程序的执行效率非常高、可读性稍好

    • 缺点:符号非常多和难记、无可移植性

  • 高级语言

    • 非常接近自然语言的高级语言,语法和结构类似于普通英文

    • 优点:简单、易用、易于理解、远离对硬件的直接操作、有可移植性

    • 缺点:有些高级语言写出的程序执行效率并不高

  • 对比(利用3种类型语言编写1+1)

  • 机器语言

  • 10111000 00000001 00000000 00000101 00000001 00000000

  • 汇编语言

  • MOV AX, 1 ADD AX, 1

  • 高级语言

  • 1 + 1

了解更多请点我


什么是JavaScript?

  • JavaScript简称JS,是前端开发的一门脚本语言(解释型语言)

    • webp

    • webp

    • 解释型语言:程序执行之前,不需要编译,直接运行时边解析边执行的语言

    • 编译型语言:程序执行之前,需要一个专门的编译过程,把程序编译成为机器语言的文件,比如exe文件

JavaScript作用

  • HTML     提供网页上显示的内容(结构)

    • webp

  • CSS      美化网页(样式)

    • webp

  • JavaScript   控制网页行为(行为)

    • webp


JavaScript发展史

  • JavaScript起源于Netscape公司的LiveScript语言

    • 1994年网景公司发布历史上第一个比较成熟的浏览器(Navigator 0.9), 但是只能浏览不能交互

    • 1995年为了解决表单有效性验证就要与服务器进行多次地往返交互问题,网景公司录用Brendan Eich(布兰登·艾奇),他在 10 天内开发出 LiveScript 语言

    • 在 Netscape Navigator 2.0 即将正式发布前,Netscape 将LiveScript 更名为 JavaScript, 目的是为了蹭Java的热度

    • 所以Java和 JavaScript之间的关系就像老婆和老婆饼一样

参考文献


JavaScript组成

  • ECMAScript:JavaScript的语法标准

    • ECMA是European Computer Manufacturers Association的缩写,即欧洲计算机制造商协会

    • ECMAScript是ECMA制定的脚本语言的标准, 规定了一种脚本语言实现应该包含的基本内容

    • JavaScript是脚本语言的一种,所以JavaScript也必须遵守ECMAScript标准,包含ECMAScript标准中规定的基本内容

  • DOM(Document Object Model):JavaScript操作网页上的元素(标签)的API

  • BOM(Browser Object Model):JavaScript操作浏览器的部分功能的API


    webp

ECMAScript起源


JavaScript书写格式

  • 和CSS书写格式一样, JavaScript也有三种书写格式, 分别是"行内式"、"内嵌式"、"外链式"

  • 和CSS书写格式一样, JavaScript三种书写格式中也推荐大家使用"外链式", 遵守结构、样式、行为分离


  • 行内式格式(不推荐)

<div ="alert('hello world');">我是div</div>

  • 内嵌式格式

</body>... ...<script type="text/javascript">
       alert("hello world");</script></body>
  • 内嵌式注意点

    • 通常将js代码放在body的最后, 因为HTML是从上至下加载, 而js代码通常是给标签添加交互(操作元素), 所以需要先加载HTML, 否则如果执行js代码时HTML还未被加载, 那么js代码将无法添加交互(操作元素);

    • HTML页面中出现<script>标签后,就会让页面暂停等待脚本的解析和执行。无论当前脚本是内嵌式还是外链式,页面的下载和渲染都必须停下来等待脚本的执行完成才能继续, 所以如果把js代码写在head中, 那么js代码没有执行完毕之前后续网页无法查看

    • 如果不愿意把js代码放在body的最后, 也可以放在head标签中, 但是为了保证执行js代码时HTML一定已经被加载了, 那么需要添加一些额外代码.(不推荐)

<head>
    <script>
        window. = function () { // 必须添加这句
            alert("hello world");
        }    </script></head>

  • 外链式格式

<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="01-js书写格式.js"></script>
  • 外链式注意点

    • 外链式的script代码块中不能编写js代码, 即便写了也不会执行

<script type="text/javascript" class="lazyload" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsQAAA7EAZUrDhsAAAANSURBVBhXYzh8+PB/AAffA0nNPuCLAAAAAElFTkSuQmCC" data-original="01-js书写格式.js">
    alert("hello world"); // 不会被执行</script>
  • 由于每次加载外链式的js文件都会发送一次请求, 这样非常消耗性能, 所以在企业开发中推荐将多个JS文件合成为一个JS文件,以提升网页的性能和加载速度



作者:极客江南
链接:https://www.jianshu.com/p/230093183f47


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消