JavaScript-1

  • 编程

就是计算机为了解决某个问题而使用某种编程语言编写程序代码，并得到最终的结果的过程

  • 计算机程序

计算机所执行的一系列指令的集合

  • 数据存储

数据以二进制的形式存储在计算机硬盘或内存中

  • 程序运行

打开某个程序时，先把硬盘中的程序加载在内存中，CPU执行内存中的代码

之所以要内存的主要原因是因为cpu运行太快了，如果只从硬盘中读取数据，会浪费cpu的性能，所以才使用存取更快的内存来保存运行时的数据

（内存是电，硬盘是机械）

  • 起源

JavaScript起源于1995年，它的出现主要是用于处理网页中的表单验证（避免与服务器多次交互延长时间，影响用户体验）

随着网络发展，现在JavaScript多用于展示页面动态效果

不同浏览器使用的JavaScript的实现引擎不同

  • 含义

一个完整的JavaScript包含三个部分：

ECMAScript：规定了JS编程语法和基础核心知识

DOM：文档对象模型，提供对象帮助操作网页

BOM：浏览器对象模型，提供对象帮助操作浏览器，通过BOM可以操作浏览器窗口比如弹出框，浏览器跳转等

  • 特点

JavaScript是运行在客户端的编程语言，是一种脚本语言

解释型语言：不用编译，完成后直接运行

类似于C和Java的语法结构

动态语言

基于原型的面向对象

  • 浏览器执行JS简介

浏览器分为两部分 渲染引擎和JS引擎

渲染引擎：用来解析html和css，俗称内核，例如：chrome的blink

JS引擎：也成为JS解释器，用来读取网页中的JS代码，对其处理后运行，例如：chrome中的v8

浏览器本身不会执行JS代码，是通过内置的JavaScript引擎来执行JS代码，JS引擎执行代码时逐行解释每一句源码（转换为机器语言），然后由计算机去执行。所以JavaScript语言归类于脚本语言，会逐行进行解析。

  • 学习

1.JS代码需要编写到script标签中、

　　alert()、document.write()、console.log()：统称为输出语句

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <!--Js代码需要编写到script标签中-->
 7         <script type="text/javascript">
 8             /**
 9              * 控制浏览器弹出一个警告窗
10              */
11             alert("这是我的第一行JS代码");
12             /**
13              * 计算机在页面中输出一个内容
14              * 网页作为一个document，向body中写一个内容
15              */
16             document.write("body被充实啦！！！！")
17             /**
18              * 向控制台输出一个内容
19              */
20             console.log("你吃了吗")
21         </script>
22     </head>
23     <body>
24     </body>
25 </html>

2.JS编写位置

  • 行内式，可以将单行或少量JS代码写在HTML标签的2022年3月11日09:03:25属性中（以on开头的属性）
  • 内嵌式，写在script标签中
  • 外部的js文件中，最佳方案
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <!--内嵌式的JS-->
 7         <script>
 8             // 写入输入框
 9             prompt("请输入日期:");
10             // 控制台输出
11             console.log("123")；
12         </script>
13         <!-- 外部js文件script 双标签 ，中间不要再写代码-->
14         <script src="js/my.js"></script>
15     </head>
16     <body>
17         <!--行内式的JS 直接写到元素的内部-->
18         <!-- 弹出警示框 -->
19         <input  type="button" value = "唐伯虎" onclick="alert('秋香')"/>
20     </body>
21 </html>

3.JS基本语法

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7         /**
 8          * JS注释
 9          * 多行注释，注释内容不会被执行，但可以在源代码中查看
10          */
11         //单行注释，只针对其后面部分有效
12         /**
13          * 1.JS中严格区分大小写
14          * 2.JS中每一条语句以分号结尾;
15          *         ·如果不加分号，浏览器会自动添加，但是会小号一些系统资源
16          *         ·某些时候浏览器会加错分号
17          * 3.JS会忽略多个空格和换行，所以我们可以利用空格和换行对代码进行格式化
18          * 
19          */
20         </script>
21     </head>
22     <body>
23     </body>
24 </html>

4.字面量和变量

变量的本质：是程序申请在内存中一块存储数据的空间 

通过使用变量，可以更好的解释数据的含义，也可以方便后期多次使用比较复杂的数据

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7             /**
 8              * 字面量，都是一些不可改变的量
 9              * 字面量都是可以直接使用的，但是我们一般都不会直接使用
10              *
11              * 变量，可以从来保存字面量，而且变量的值可以任意改变
12              *         变量更加方便使用，所以在开发中都是通过变量去保存一个字面量
13              *         很少直接使用字面量
14              */
15             //声明变量
16             //在js中使用var关键字来声明一个变量
17             var a;
18             console.log(a);
19             //声明和赋值可以同时进行
20             var b = 56;
21             console.log(b)
22         </script>
23     </head>
24     <body>
25     </body>
26 </html>

 5.声明变量的特殊情况

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7             // 只声明不赋值，结果是undefined
 8             var name;
 9             console.log(name);
10             //不声明不赋值，结果是报错
11             // console.log(age);
12             //不声明直接赋值
13             sex = '女'
14             console.log(sex);
15         </script>
16     </head>
17     <body>
18     </body>
19 </html>

6.命名规范

  • 由字母、数字、下划线、$组成
  • 严格区分大小写
  • 不能以数字开头
  • 不能是关键字
  • 变量名必须有意义
  • 遵守驼峰命名法（首字母小写，后面的每个单词首字母大写）
  • 尽量不要使用name作为变量名
 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <script type="text/javascript">
 7         /**
 8          * 标识符
 9          * 在JS中所有可以由我们自主命名的都可称为是标识符
10          * 例如：变量名、函数名及属性名
11          * 命名需遵守以下规则
12          *     1.标识符中可以含有字母、数字、_、$
13          *     2.标识符不能以数字开头
14          *  3.标识符不能是ES中的关键字或保留字
15          *  4.标识符一般都采用驼峰命名法
16          *         -首字母小写，每个单词的首字母大写，其余字母小写
17          *         例：helloWorld
18          * 补充内容：JS底层保存标识符实际上是采用Unicode编码
19          *             所以理论上讲，所以utf-8上含有的内容都可
20          *             以作为标识符
21          */
22 
23         </script>
24     </head>
25     <body>
26     </body>
27 </html>

 

posted @ 2022-03-04 15:51  Miraitowa56  阅读(39)  评论(0)    收藏  举报