5.5js

2023-11-11

1. JavaScript简介

  1. 什么是JavaScript?
    JavaScript 是⼀种客户端脚本语⾔(脚本语⾔是⼀种轻量级的编程语⾔)。
    JavaScript 通常被直接嵌⼊ HTML ⻚⾯,由浏览器解释执⾏
    JavaScript 是⼀种解释性语⾔(就是说,代码执⾏不进⾏预编译)。
    特点:弱类型和基于对象。(因为⾯向对象需要具有封装、继承、多态的特征)
    JavaScript语⾔中包含三个核⼼:ECMAScript基本语法、DOM、BOM
    在这里插入图片描述

2. JavaScript使⽤⽅法

可以像添加CSS那样将 JavaScript 添加到 HTML ⻚⾯中。CSS 使⽤ 元素链接外部样式
表,使⽤

  1. 内部JavaScript: 使⽤ 标签
    属性:
    charset(可选)字符集设置、
    defer(可选执⾏顺序)值:defer、
    language(已废除)、
    src(可选)使⽤外部的js脚本⽂件
    type(必选)类型:值:text/javascript
<script type="text/javascript">
<!--
javaScript语⾔
//-->
</script>
  1. 外部 JavaScript:
    使⽤外部导⼊js会使代码更加有序,更易于复⽤,且没有了脚本的混合,HTML也会更加易
    读。
<script type="text/javascript" src="my.js"></script>
  1. 内联JavaScript处理器:
    就是将js代码写⼊html代码中,如在html标签的事件中或超级链接⾥
<button onclick="javaScript语⾔"></button>
<a href="javascript:alert('aa');alert('bb')">点击</a>

3. JavaScript基础语法

3.1 JavaScript的输出:
JavaScript 没有任何直接打印或者输出的函数。
若有显示数据可以通过下⾯不同的⽅式来输出:
window.alert() 弹出警告框
document.write() ⽅法将内容写到 HTML ⽂档中
innerHTML 写⼊到 HTML 元素
console.log() 写⼊到浏览器的控制台

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>JavaScript实例</title>
 </head>
 <body>
 <h3>测试JavaScript的输出</h3>
 <div id="did">div层</div>
 </body>
 <script>
 //弹出⼀个信息提示框
 window.alert("Hello JavaScript!");

 //输出到浏览器⻚⾯中
 document.write("这个是⻚⾯中的输出");
 //通过写⼊HTML标签中,完成⻚⾯中的输出
 document.getElementById('did').innerHTML="div层中的输出";
 //控制台上的输出
 console.log("控制台上的输出");
 </script>
</html>

3.2 变量

什么是变量
变量是计算机内存中存储数据的标识符,根据变量名称可以获取到内存中存储的数据
为什么要使⽤变量
使⽤变量可以⽅便的获取或者修改内存中的数据

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>JavaScript实例</title>
 </head>
 <body>
 <h3>测试JavaScript的输出</h3>
 <div id="did">div层</div>
 </body>
 <script>
 //弹出⼀个信息提示框
 window.alert("Hello JavaScript!");
 //输出到浏览器⻚⾯中
 document.write("这个是⻚⾯中的输出");
 //通过写⼊HTML标签中,完成⻚⾯中的输出
 document.getElementById('did').innerHTML="div层中的输出";
 //控制台上的输出
 console.log("控制台上的输出");
 </script>
</html>
如何使⽤变量 使⽤var声明变
```var name;

变量的赋值
var name;
name = "zhangsan";

同时声明多个变量
var name,age,sex;
name = 'lisi';
age = 20;
sex = "man"

同时声明多个变量并赋值
var name = 'wangwu', age = 25;

3.3 变量的命名规则和规范
	规则 - 必须遵守的,不遵守会报错
	由字⺟、数字、下划线、$符号组成,不能以数字开头
	不能是关键字和保留字,例如:for、 if、while。
	区分⼤⼩写
	规范 - 建议遵守的,不遵守不会报错
	变量名必须有意义
	遵守驼峰命名法。⾸字⺟⼩写,后⾯单词的⾸字⺟需要⼤写。例如:userName、
	userPassword

```html

```html
## 3.4 语句与注释

语句:

		⼀般程序中的语句是由表达式加分号构成 ; 组成。(js中的每条语句之间的分割符可以是回⻋
		换⾏也可以是";"分号(推荐))
		⽽表达式的种类很多:
		如:算术表达式、赋值表达式、关系表达式、逻辑表达式等等...
		也可以是⼀个函数、⽅法的调⽤
		脚本注释: // 单⾏注释 和 /* 多⾏注释 */
		单⾏注释
		单⾏注释以 // 开头。
		任何位于 // 与⾏末之间的⽂本都会被 JavaScript 忽略(不会执⾏)。
		多⾏注释
		多⾏注释以 /* 开头,以 */ 结尾。
		任何位于 /* 和 */ 之间的⽂本都会被 JavaScript 忽略。
		注释的⽬的:
		为程序添加辅助说明,便于阅读理解。
		注释掉临时不需要执⾏的代码、便于调试、排错。

4. JavaScript数据类型

JavaScript中数据类型:
值类型(基本类型):
字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)、
Symbol。
注意:Symbol 是 ES6 引⼊了⼀种新的原始数据类型,表示独⼀⽆⼆的值。
引⽤数据类型: 对象(Object)、数组(Array)、函数(Function)。
 //我们使⽤typeof操作符获取基本数据类型
 //Undefined 这个值表示变量不含有值
 console.log(typeof a); //undefined 未定义的
 var a = 10;
 console.log(typeof a); //number
 a = 3.14
 console.log(typeof a); //number

 a = 'zhangsan'
 console.log(typeof a); //string

 a = true
 console.log(typeof a); //boolean

 //可以通过将变量的值设置为 null 来清空变量
 a = null
 console.log(typeof a); //object
 console.log(a); //null
 a = [10,20,30];
 //或 a = new Array(10,20,30);
 console.log(typeof a); //object
 console.log(a instanceof Array); //true
 a = function(){} //定义空⽩函数
 console.log(typeof a); //function
 console.log(a instanceof Function); //true
 /*
 //整数的进制的输出
 console.log(10); //输出⼗进制数的值
 console.log(0b10); //输出⼆进制数10的值
typeof 操作符获取⼀个变量的类型,返回结果如下:
undefined - 如果变量是 Undefined 类型的
boolean - 如果变量是 Boolean 类型的
number - 如果变量是 Number 类型的 (整数、浮点数)
string - 如果变量是 String 类型的 (采⽤""、 '')
object - 如果变量是⼀种引⽤类型或 Null 类型的 如: new Array()/ new String()...
function -- 函数类型
undefined 和 null 的区别
null 和 undefined 的值相等,但类型不等:
 console.log(0o10); //输出⼋进制数10的值
 console.log(0x10); //输出⼗六进制数10的值
 //⼗进制转换其他进制
 var x = 110;
 x.toString(2)//转为2进制
 x.toString(8)//转为8进制
 x.toString(16)//转为16进制
 //其他进制转⼗进制
 var x = "110"//这是⼀个⼆进制的字符串表示
 parseInt(x, 2)//把这个字符串当做⼆进制, 转为⼗进制
 var x = "70"//这是⼀个⼋进制的字符串表示
 parseInt(x, 8)//把这个字符串当做⼋进制, 转为⼗进制
 var x = "ff"//这是⼀个⼗六进制的字符串表示
 parseInt(x, 16)//把这个字符串当做⼗六进制, 转为⼗进制
 */
typeof "zhangsan" // 返回 string
typeof 3.14 // 返回 number
typeof NaN // 返回 number
typeof true // 返回 boolean
typeof [10,20,30,40] // 返回 object
typeof {name:'lisi', age:20} // 返回 object
typeof new Date() // 返回 object
typeof function(){} // 返回 function
typeof myCar // 返回 undefined (如果 myCar 没有声明)
typeof null // 返回 object
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true

object引⽤类型 引⽤类型通常叫做类(class),也就是说,遇到引⽤值,所处理的就是对象。
Object 对象⾃身⽤处不⼤,不过在了解其他类之前,还是应该了解它。 因为 ECMAScript 中的
Object 对象与 Java 中的 java.lang.Object 相似, ECMAScript 中的所有对象都由这个对象继承⽽
来,Object 对象中的所有属性 和⽅法都会出现在其他对象中,所以理解了 Object 对象,就可以
更好地理解其他对象。
值类型理解:变量之间的互相赋值,是指开辟⼀块新的内存空间,将变量值赋给新变量保存到新开
辟的内存⾥⾯;之后两个变量的值变动互不影响,例如:

var a = 10; //开辟⼀块内存空间保存变量a的值“10”;
var b = a; //给变量 b 开辟⼀块新的内存空间,将 a 的值 “10” 赋值⼀份保存到新的内存⾥;
//a 和 b 的值以后⽆论如何变化,都不会影响到对⽅的值;

`引⽤类型理解:变量之间的互相赋值,只是指针的交换,⽽并⾮将对象(普通对象,函数对象,数
组对象)复制⼀份给新的变量,对象依然还是只有⼀个,只是多了⼀个指引。``
//需要开辟内存空间保存对象,变量 a 的值是⼀个地址,这个地址指向保存对象的空间;


var a = { x: 1, y: 2 };
var b = a; // 将a 的指引地址赋值给 b,⽽并⾮复制⼀给对象且新开⼀块内存空间来保存;
// 这个时候通过 a 来修改对象的属性,则通过 b 来查看属性时对象属性已经发⽣改变; 

类型转换:
JavaScript 变量可以转换为新变量或其他数据类型:
通过使⽤ JavaScript 函数
通过 JavaScript ⾃身⾃动转换

 ECMAScript 中可⽤的 3 种强制类型转换如下:
 Boolean(value) - 把给定的值转换成 Boolean 型;
 Number(value) - 把给定的值转换成数字(可以是整数或浮点数);
 String(value) - 把给定的值转换成字符串;
 使⽤:Number()、parseInt() 和parseFloat() 做类型转换
 Number()强转⼀个数值(包含整数和浮点数)。
 *parseInt()强转整数,
 *parseFloat()强转浮点数

 函数isNaN()检测参数是否不是⼀个数字。 is not a number
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

5.5js 的相关文章

  • 仿中国婚博会微信小程序

    仿中国婚博会微信小程序 app json pages pages index index pages cash cash pages marry marry pages community community pages me me pag
  • js倒计时

    html部分代码 div class time span 60 span span s span div js部分代码 var second document getElementById second var m 60 var time
  • 【每日一练】79—CSS实现扫描二维码动画

    二维码的应用越来越普通 加个好友 付个款 做个核酸 想去一个地方 还要扫个场所码 总之 需要二维码的地方越来越多 因此 在这样的大环境里 如何让你的码与众不同 引人注意 就显得非常重要 今天我们就来练习一个二维码的动画效果 具体效果如下 看
  • Html如何引用公用的JS和CSS

    1 问题原因 项目开发几乎每个Html都会引用JS和CSS 那么就会有一些常用JS或者CSS 我们不希望每个Html文件都引用一堆文件 而是只引用公用的JS和CSS就可以了 2 解决办法 2 1定义commonJs js添加公用的JS文件引
  • VUE 移动端只获取当前拍摄照片,不允许相册获取 及 input标签capture属性详解

    一 VUE移动端简单实现只获取当前拍摄照片demo
  • JS 变量提升和函数提升

    变量提升 这里介绍一个变量提升提升的经典案例 for var i 0 i lt 10 i setTimeout gt console log i 1000 这里打印是10个10 因为在执行第一个setTimeout时 Js不会等待1秒后再去
  • js 微观任务、宏观任务、循环机制

    javascript是单线程语言 就是因为单线程的特性 就不得不提js中的同步和异步 同步和异步 所谓单线程 无非就是同步队列和异步队列 js代码是自上向下执行的 在主线程中立即执行的就是同步任务 比如简单的逻辑操作及函数 而异步任务不会立
  • $emit传递参数

    emit传递一个参数时 子组件代码 let data name 王五 age 50 this emit change data 父组件代码
  • js 本地存储和获取

    localStorage setItem temp orderAr 存入 参数 1 调用的值 2 所要存入的数据 console log localStorage getItem temp 输出
  • js数组相加相减函数

    数组相减 reduceArray arr1 arr2 for var i arr1 length 1 i gt 0 i var a arr1 i for var j arr2 length 1 j gt 0 j var b arr2 j i
  • 网页是如何显示在浏览器

    这两天学习了一些网页如何在浏览器中显示的知识 感觉在我向前端走的路上非常有用 所以就在这里总结一下 大家可以看看 我也算是巩固一下知识 因为自己学识太浅 内容可能有一些错误之处 希望看到的朋友可以指出来啦 在Edge浏览器也加入Chromi
  • js 字符串拼接的4种方法

    一 使用连接符 把想要连接的字符串串起来 let shy 帅哥 let a 我是 shy console log a 我是帅哥 二 模板字符串 模板字符串 template string 是增强版的字符串 用反引号 标识 特点 1 字符串中
  • js获取时间戳的四种方法

  • json字符串,本地存储讲解localstorage 和 sessionstorage及cookie,模板字符串初识

    这里写目录标题 json字符串 json格式的使用方法 对象的深拷贝狭义实现 localstorage 和 sessionstorage的区别 cookie 封装cookie函数 模板字符串初识 json字符串 abc123truelkgs
  • JavaScript 分支结构语句

    JavaScript 分支结构语句 1 if语句 2 if else语句 双分支语句 3 if else if 语句 多分支语句 4 三元表达式 5 switch语句 语句 也称为流控制语句 通常使用一或多个关键字完成既定的任务 语句可以简
  • Vue.observable的理解

    一 Observable 是什么 Observable 翻译过来我们可以理解成可观察的 先来看其在Vue中的定义 Vue observable 让一个对象变成响应式数据 Vue 内部会用它来处理 data 函数返回的对象 返回的对象可以直接
  • react(craco)移动端使用postcss-px-to-viewport自适应布局

    Craco 使用postcss px to viewport devDependencies craco craco 6 4 3 xianzhengquan postcss px 2 vw 0 0 1 postcss 8 3 0 peerD
  • Js中的defer属性和async属性

    Js中的defer属性和async属性 一 defer和async 1 defer 指外部js文件和当前html页面同时加载 异步加载 但只在当前页面解析完成之后执行js代码 async 指外部js文件和当前html页面同时加载 异步加载
  • hooks实践总结

    何为hooks 在React中hook是指不编写 class 的情况下使用 state 以及其他的 React 特性 而Vue3也推出了具有相同功能的组合式API 如果你用过Vue3就会知道在 setup 中你应该避免使用 this 因为h
  • 获取对象Object的长度

    获取对象的长度 obj id 1 id2 1 id3 1 id4 1 id5 1 id6 1 id7 1 id8 1 id9 1 id10 1 let i Object keys this obj length console log i

随机推荐

  • Angular知识整合一:Angular中的组件和一些基本概念

    什么是Angular Angular是一个基于TypeScript构建的开发平台 它包括一下三个部分 一个基于组件的库 一组涵盖路由 表单管理 客户端服务端通信等各种功能继承的库 一套开发 构建 测试 更新代码的工具 Angular中的知识
  • matlab练习程序(渲染三原色)

    这里我用的空间是x向右为正 y向下为正 z向屏幕里面为正 相当于标准右手系绕x轴旋转了180度 将三个点光源放在 r 0 3 0 0 5 g 0 3 0 5 cos pi 6 0 5 sin pi 6 b 0 3 0 5 cos pi 6
  • 练习-Java继承和多态之接口

    提示 文章写完后 目录可以自动生成 如何生成可参考右边的帮助文档 题目 任务 编写一个学校接待方面的程序 招待不同身份的人的食宿问题 编程要求 仔细阅读右侧编辑区内给出的代码框架及注释 在 Begin End 中编写一个学校接待方面的程序
  • 什么是电力系统的功率平衡?为什么在任何时候要保持电力系统的功率平衡?

    什么是电力系统的功率平衡 为什么在任何时候要保持电力系统的功率平衡 答 电力系统的功率平衡是指电力有功功率和无功功率的平衡 这种功率平衡也就是电力供需平衡 要求电力系统发送的功率与系统的负荷需要随时保持平衡 电能的一个最重要特点就是不能储存
  • 关于Vue.js中数据模型的绑定以及方法事件的绑定与调用

    在vue js中 我们可以将事件方法写在methods属性中 数据模型在data中定义 Vue的基本结构如下 只写最常用的 将数据与vue实例绑定通过v bind标签 这里绑定的是sourceId这个值 基于vue的双向绑定 如果要取vue
  • 蓝桥杯:整除序列

    整除序列 15分 题目描述 有一个序列 序列的第一个数是 n 后面的每个数是前一个数整除 2 请输出这个序列中值为正数的项 输入格式 输入一行包含一个整数 n 输出格式 输出一行 包含多个整数 相邻的整数之间用一个空格分隔 表示答案 评测用
  • 虚拟环境安装和操作

    文章目录 安装相应库和配置 查看已安装虚拟环境 创建虚拟环境 切换 进入虚拟环境 退出虚拟环境 虚拟环境 linux创建Python虚拟环境及配置 Django Flask项目中如何创建Python虚拟环境呢 汇总 环境迁移 安装相应库和配
  • 攻防世界MISC刷题1-50

    目录 1 ext3 2 base64stego 3 功夫再高也怕菜刀 4 easycap 5 reverseMe 6 Hear with your Eyes 7 What is this 8 normal png 9 something i
  • idea 添加 VUE 的语法支持和开发

    一 VUE的开发分两种 一种是直接在HTML文件中使用 一种是VUE文件的形式开发 1 首先我们先让 HTML 文件支持 VUE 的语法指令提示 2 File gt Setting gt Edit gt Inspections gt htm
  • 父类A a = new 子类B

    父类名 a new 子类名 子类名 b new 子类名 比较上面两种创建实例的区别 a只能调用父类的函数 和子类重写父类的方法 不能调用父类中不存在的子类的函数 因为它没有继承 a是父类的引用 指向了一个子类对象 好处如果一旦发现该B对象无
  • Jetson Orin NX install Fastdeploy

    FastDeploy jetson md at develop PaddlePaddle FastDeploy GitHub sudo apt get install gcc sudo apt get install cmake git c
  • postman-token的作用

    Postman生成的代码中的postman token是什么 What is the postman token in generated code from Postman 这主要用于绕过Chrome 等其他浏览器 中的错误 如果XMLH
  • QEMU/KVM PCI Passthrough(i350) & DPDK 网络性能测试

    QEMU KVM PCI Passthrough i350 DPDK 网络性能测试 硬件要求 CPU必须支持硬件虚拟化 Intel VT d or AMD Vi 和 IOMMU 原图链接 主机配置 设置iommu IOMMU kernel
  • kmp算法(最简单最直观的理解,看完包会)

    本文将以特殊的方式来让人们更好地理解kmp算法 不包括kmp算法的推导 接下来 我们将从朴素算法出发 在这之前 我们先设主串为S 模式串为T 我们要解决的询问是主串中是否包含模式串 即T是否为S的子串 版权声明 本文为原创文章 转载请标明出
  • c++ 继承 学习总结1 继承的基本语法

    前言 继承的作用是减少程序中重复的代码段 如果程序中有很多重复的代码段 可以考虑一下能否使用继承 继承的语法 class 子类 继承方式 父类 include
  • 特征提取-特征工程

    目录 1 定义 2 字典特征提取 3 英文 本特征提取 4 中文 本特征提取 1 定义 将任意数据 如 本或图像 转换为可 于机器学习的数字特征 2 字典特征提取 from sklearn feature extraction import
  • 【算法】树状数组维护总结

    本文仅对树状数组的使用作一个总结 并非讲解 这里的操作都对长度为 n n n 的数组 a a a 进行操作 单点修改 区间查询 暴力做法 修改
  • java使用原始套接字技术进行数据包截获_Linux零拷贝技术,看完这篇文章就懂了...

    本文讲解 Linux 的零拷贝技术 云计算是一门很庞大的技术学科 融合了很多技术 Linux 算是比较基础的技术 所以 学好 Linux 对于云计算的学习会有比较大的帮助 本文借鉴并总结了几种比较常见的 Linux 下的零拷贝技术 相关的引
  • python的pyecharts绘制各种图表详细(代码)

    环境 pyecharts库 echarts countries pypkg echarts china provinces pypkg echarts china cities pypkg 数据 2018年4月16号的全国各地最高最低和天气
  • 5.5js

    1 JavaScript简介 什么是JavaScript JavaScript 是 种客户端脚本语 脚本语 是 种轻量级的编程语 JavaScript 通常被直接嵌 HTML 由浏览器解释执 JavaScript 是 种解释性语 就是说 代