【Web前端笔记11】JavaScript基础与变量

        前言

11 JavaScript基础与变量

一、Js简介

1、JavaScript核心部分:

2、有非常广泛的使用领域

3、JavaScript与ECMAScript的关系

4、JavaScript版本

二、JavaScript名词解释

三、变量命名规则

四、变量类型

六大基本数据类型:

1、数字类型

2、字符串类型

3、布尔类型

4、未定义类型undefined

5、Js用法和输出函数

五、JavaScript引入到HTML文件中

1、嵌入到HTML文件中

2、引入本地独立JS文件

3、引入网络来源文件

六、JavaScript注释与常见输出方式

1、JavaScript注释

2、JavaScript输出方式


前言

从这篇博文开始,进入到JavaScript的学习咯!

11 JavaScript基础与变量

一、Js简介

轻量级脚本语言,可以部署在多种环境

常见部署环境:浏览器

1、JavaScript核心部分:
  • 基本的语法构造(操作符、控制结构、语句);
  • 标准库(一系列各种功能的对象,例如Array、Data、Math等)

还提供额外API,包含

  • 浏览器控制类
  • DOM类
  • Web类
2、有非常广泛的使用领域
  • 浏览器的平台化
  • 跨移动平台
  • 数据库操作
  • Node.js
3、JavaScript与ECMAScript的关系

ECMAScript和JavaScript的关系是,前者是后者的规格,后者是前者的一种实现。在日常场合,这两个词是可以互换的。

4、JavaScript版本

img

二、JavaScript名词解释

        语句:以行为单位,以分号结尾;

        变量:其表示的值可以发生改变;

var a; /*a就是一个变量,a是变量名*/

ps:创建一个变量的过程就叫变量的声明;

        给变量一个具体的值的过程叫做变量的赋值(变量在赋值之前必须被声明),例如a=10;

        将变量的声明和赋值写在一起的方式叫做变量的初始化,例如var a=10;    

 /*script标签表示脚本,可以在script标签中编写js代码,也可以通过script的src属性来引入外部的脚本文件 注意:script可以写在HTML文件的任意位置,不过一般写在body的最后., */

三、变量命名规则

  • JavaScript语言的标识符对大小写敏感
  • 字母、数字、下划线和美元符号组成,首字母不能是数字;
  • 不能用关键字(保留字)来命名变量;

常用命名方式:

  • 驼峰命名法(首字母大写,其余字母小写)

        ps:命名要有意义。        

四、变量类型

六大基本数据类型:
  • number 数字类型
  • object 对象类型
  • underfined&null 未定义类型&空类型
  • *Array 数组类型(不是基本数据类型)
  • boolean 布尔类型
  • string 字符(串)类型

【typeof 运算符可以查看变量的类型】

<script type="text/javascript"> var a; a=10; console.log(typeof a); a=true; console.log(typeof a); 
</script>

1、数字类型

只有一种数字类型,可以带小数点,也可以不带;

var x=34.00; //使用小数点来写 
var x=34; //不使用小数点来写 
var x=314e2; //极大或极小的数字可以用科学计数法 
var a=314e2 //a=31400 
var b=123e-5 //b=0.00123
2、字符串类型

在js中字符串类型是用来存储字符的类型,可以使用单双引号定义。

注意:字符串在定义时只要写在引号内部即可,但是唯一不能写在内部的是外部定义时用的引号。

var str1=''; 
var str2='a'; 
var str3='hello world'; 
var str4="good sxt"; 
var str5='my name is "sxt"'; //会报错,注意不能用外部定义时的引号
3、布尔类型

可以用来判断真假的数据类型

类型值:true/false

var flag=true; 
var flag2=false; 
console.log(typeof flag);
4、未定义类型undefined

        用来描述当变量的值不确定时,变量所表示的类型

        注意:未定义类型中有一个值就是undefined。

var item; 
console.log(typeof item);

        空类型:表示对象为空

5、Js用法和输出函数

JavaScript可以通过不同的方式来输出数据。

  • window.alert() 弹出警告框
  • console.log() 写入到浏览器的控制台
  • document.write() 将内容写入到HTML文档中
<script> document.write("1.1"); document.write("1.2") document.write("1.3") 
</script> 
<script>             document.write("2.1"); document.write("2.2") document.write("2.3") 
</script> 
<script> document.write("3.1"); document.write("3.2") document.write("3.3") 
</script3

五、JavaScript引入到HTML文件中

1、嵌入到HTML文件中
<body><script>var age = 20</script>
</body>
2、引入本地独立JS文件
<body><script type="text/javascript" src="./mix.js">       </script>
</body>
3、引入网络来源文件
<body><script src="http://code.jquery.com/jquery1.2.1.min.js">    </script>
</body>

六、JavaScript注释与常见输出方式

1、JavaScript注释

源码中注释是不被引擎所解释的,它的作用是对代码进行解释。

Javascript 有两种注释的写法

  • 单行注释,用//起头;
  • 多行注释,放在//之间。
// 单行注释/*这是多行注释
*/
2、JavaScript输出方式

JavaScript有很多种输出方式,都可以让我们更直观的看到程序运行的结果

// 在浏览器中弹出一个对话框,然后把要输出的内容展示出来,alert都是把要输出的内容首先转换为字符串然后在输出的
alert("要输出的内容");document.write("要输出的内容"); // 在控制台输出内容
console.log("要输出的内容");

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/487674.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【Java程序设计】【C00287】基于Springboot的疫情防控期间某村外出务工人员管理系统(有论文)

基于Springboot的疫情防控期间某村外出务工人员管理系统&#xff08;有论文&#xff09; 项目简介项目获取开发环境项目技术运行截图 项目简介 这是一个基于Springboot的疫情防控期间某村外出务工人员信息管理系统 本系统分为系统功能模块、管理员功能模块、用户功能模块、采集…

汽修专用产品---选型介绍 汽修示波器 汽车示波器 汽车电子 汽修波形 汽车传感器波形 汽车检测

为了满足汽车电子用户的测量需求&#xff0c;我司特推出汽修专用版示波器&#xff0c;一键测量&#xff0c;轻松找出汽车问题。 LOTO各种型号的示波器其实都可以用作汽车传感器信号波形的检测。汽修应用中&#xff0c;工程师对示波器的性能要求对于LOTO产品来说不算高。 在我们…

axure9.0 工具使用思考

原型设计软件【AxureRP】快速原型设计工具原型设计软件【AxureRP】快速原型设计工具原型设计软件【AxureRP】快速原型设计工具原型设计软件【AxureRP】快速原型设计工具原型设计软件【AxureRP】快速原型设计工具原型设计软件【AxureRP】快速原型设计工具原型设计软件【AxureRP】…

小程序画布(二维地图线)

首先开始是想用小程序兼容openlayers的&#xff0c;但是了解到用不了&#xff0c;那就用画布来解决 实际效果如下 wxml中代码 <canvas id"trackDesignCanvas" //指定 id 的 Canvas 组件class"orbit-canvas-main" type"2d" …

C++的vector容器->基本概念、构造函数、赋值操作、容量和大小、插入和删除、数据存取、互换容器、预留空间

#include<iostream> using namespace std; #include <vector> //vector容器构造 void printVector(vector<int>& v) { for (vector<int>::iterator it v.begin(); it ! v.end(); it) { cout << *it << " "…

【Ubuntu】Anaconda的安装和使用

目录 1 安装 2 使用 1 安装 &#xff08;1&#xff09;下载安装包 官网地址&#xff1a;Unleash AI Innovation and Value | Anaconda 点击Free Download 按键。 然后 点击下图中的Download开始下载安装包。 &#xff08;2&#xff09;安装 在安装包路径下打开终端&#…

基于AMDGPU-ROCm的深度学习环境搭建

在风起云涌的AI江湖&#xff0c;NVIDIA凭借其CUDA生态和优秀的硬件立下赫赫战功&#xff0c;而另一家公司AMD也不甘示弱&#xff0c;带着他的生态解决方案ROCm开始了与不世出的NVIDA的正面硬钢&#xff0c;"ROCm is the answer to CUDA", AMD官网如是说。之前有搭建过…

windows 11+docker desktop+grafana+influxDB

下载安装docker desktop 出现WSL相关的错误。WSL是一个linux内核的子系统&#xff0c;docker是基于linux内核的&#xff0c;所以运行docker需要WSL。 以管理员权限打开powershell&#xff0c;查看WSL状态 wsl --status 我遇到的错误是因为我关闭了windows的某些更新 执行上…

opengl pyqt 显示文字

目录 效果图 效果图 import sys from PyQt5.QtWidgets import QApplication, QMainWindow, QOpenGLWidgetfrom OpenGL.GL import * from OpenGL.GLUT import * from OpenGL.GLU import *class OpenGLWidget(QOpenGLWidget):def __init__(self, parentNone):super(OpenGLWidget…

财报解读:英伟达的“蝶变时刻”已然到来?

搭上了AI快车的英伟达&#xff0c;再一次交出了亮眼“答卷”。 财报显示&#xff0c;2024财年&#xff0c;英伟达营收609亿美元&#xff0c;同比增长126%&#xff0c;净利润297.6亿美元&#xff0c;同比增长581%。其中&#xff0c;Q4实现营收221亿美元&#xff0c;同比增长 26…

【深度学习】微调通义千问模型:LoRA 方法,微调Qwen1.8B教程,实践

官网资料: https://github.com/QwenLM/Qwen/blob/main/README_CN.md 文章目录 准备数据运行微调设置网络代理启动容器执行 LoRA 微调修改 finetune/finetune_lora_single_gpu.sh运行微调 执行推理 在本篇博客中&#xff0c;我们将介绍如何使用 LoRA 方法微调通义千问模型&#…

RobotGPT:利用ChatGPT的机器人操作学习框架,三星电子研究院与张建伟院士、孙富春教授、方斌教授合作发表RAL论文

1 引言 大型语言模型&#xff08;LLMs&#xff09;在文本生成、翻译和代码合成方面展示了令人印象深刻的能力。最近的工作集中在将LLMs&#xff0c;特别是ChatGPT&#xff0c;整合到机器人技术中&#xff0c;用于任务如零次系统规划。尽管取得了进展&#xff0c;LLMs在机器人技…