做网站项目时 需求分析的内容,广西网络干部学院官网,合肥 网站设计,搭建网站难吗JavaScripts基础
js是一门编程语言#xff0c;可以实现很多的网页交互效果。
JavaScript脚本语言具有以下特点:
#xff08;1#xff09;脚本语言。JavaScript是一种解释型的脚本语言#xff0c;C、C等语言先编译后执行#xff0c;而JavaScript是在程序的运行过程中逐行…JavaScripts基础
js是一门编程语言可以实现很多的网页交互效果。
JavaScript脚本语言具有以下特点:
1脚本语言。JavaScript是一种解释型的脚本语言C、C等语言先编译后执行而JavaScript是在程序的运行过程中逐行进行解释。
2基于对象。JavaScript是一种基于对象的脚本语言它不仅可以创建对象也能使用现有的对象。
3简单。JavaScript语言中采用的是弱类型的变量类型对使用的数据类型未做出严格的要求是基于Java基本语句和控制的脚本语言其设计简单紧凑。
4动态性。JavaScript是一种采用事件驱动的脚本语言它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
5跨平台性。JavaScript脚本语言不依赖于操作系统仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用前提是机器上的浏览器支持JavaScript脚本语言JavaScript已被大多数的浏览器所支持。 [4]不同于服务器端脚本语言例如PHP与ASPJavaScript主要被作为客户端脚本语言在用户的浏览器上运行不需要服务器的支持。所以在早期程序员比较倾向于使用JavaScript以减少对服务器的负担而与此同时也带来另一个问题安全性。
而随着服务器的强壮虽然程序员更喜欢运行于服务端的脚本以保证安全但JavaScript仍然以其跨平台、容易上手等优势大行其道。同时有些特殊功能如AJAX必须依赖JavaScript在客户端进行支持。
js书写位置
内部 js
直接写在html中用scripts标签包住 一般scripts标签写在body上面 外部js 在html文件外部创建一个js文件然后再在html文件中通过scripts标签调用scripts标签中无需再写代码否则会被忽视 bodyscript src./day01.js/script
/body行内js 代码写在标签内部 多用于vue框架
js注释
单行注释 符号 //快捷键 ctrl/ 块注释 符号 /* */快捷键shiftalta
注意点结束符号是 ; 结束符号可以省略不写
输入输出语句
输出语句 语句1 document.write(“hello world”)
作用向body内输出内容 语句2 *** alert(“hello world”)
作用页面弹出警告对话框 语句3 console.log(‘控制台打印’)
作用控制台输出语法程序员调试使用
输入语句 语句1 *** prompt(‘please write you name’)
作用显示一个对话框对话框中包含一条文字信息用来提示用户输入文字
执行顺序
按html文档流顺序执行js代码alert()和prompt()他们会跳过页面渲染先被执行
变量
抽象存储数据的容器
语法
let 变量名
let 是关键字(允许、许可、让、要)所谓关键字就是系统提供专门用来声明变量的词语
变量赋值初始化let num 20
注意声明变量统一使用let
var声明变量缺点
可以先使用再声明var声明过的变量可以重复声明变量提升全局变量没有块级作用域等等
数组
声明语法
let array [a,b,c]
//同样通过下标索引获取元素常量
概念使用const声明的变量称为常量
使用场景当某个变量永远不会改变的时候就可以使用const来声明而不是使用let
命名规范和变量一致
常量使用
声明
const G 10010
console.log(G)注意常量不允许重新赋值 声明常量的时候必须初始化(赋值)
不需要重新赋值的数据可以使用常量const
数据类型
js是弱类型语言变量属于哪种数据类型只有赋值之后我们才能确认
不同于java强类型语言 基本数据类型 Number 数字型 整数、小数、负数、正数 let age 18 //整数
let num 3.14 //小数算数运算符 与java相同 NaN 代表计算错误它是一个不正确或者一个未定义的数学操作所得到的结果。 NaN是粘性的任何对NaN的操作都会返回NaN。 console.log(你好 - 2) //返回NaN
console.log(NaN - 2) //返回NaNString 字符串型 在js中 无论是 单引号、双引号、反引号 包裹的数据都叫字符串 字符串拼接一样使用号 模板字符串 使用场景 拼接字符串和变量 拼接变量较多比较麻烦 语法 字符串使用反引号包裹变量使用${变量} let age 18
document.write(今年我${age}岁了)boolean 布尔型 表示肯定或者否定时在计算机中对应的是布尔类型他只有两个固定的值true和flase表示真或者假 undefined 未定义型 比较特殊的类型 只有一个值undefined 只声明变量不赋值的情况下变量的默认值为undefined一般很少直接为某个变量赋值为undefined let age //为声明变量
document.write(age) //输出undefinednull 空类型 js中的null 仅表示一个代表无、”空“、”值未知“的特殊值 null 一般作为尚未创建的对象 let age null
console.log(age) //输出结果为null
typeof age //输出结果的数据类型为对象引用数据类型 object 对象 通过typeof关键字可以检测数据类型 作为运算符 typeof age函数形式 typeof(age) 一般都是用第一种形式
类型准换
JavaScript是一种动态类型的编程语言它的变量不需要在声明时指定类型可以根据变量的值自动推断类型。JavaScript中有许多数据类型包括基本数据类型和复杂数据类型。
通俗的来讲就是把一种数据类型的变量转换成我们所需要的数据类型
隐式转换
JS中的隐式转换指的是在进行运算或比较时自动将数据类型从原始值如字符串、布尔值等转换为其他数据类型。而显式转换则需要通过特定的函数来手动进行转换。
以下是常用的隐式转换示例及对应的结果 当两个不同类型的操作数相加时会先将其中一个操作数转换成与另一个操作数相同的类型再进行计算。 示例let result 5 3; // 输出结果为 “53” 当使用乘法运算符 * 连接两个字符串时会将第二个操作数视为重复次数并返回新的字符串。 示例let result hello * 3; // 输出结果为 “hellohellohello” 当使用关系运算符 , , , , , !, , ! 进行比较时会根据操作数的类型进行隐式转换后再进行比较。 示例console.log(true 1); // 输出结果为 true 当调用内置函数 parseInt() 或 parseFloat() 时可以将字符串转换为整数或浮点数。 示例let numStr 10; let numInt parseInt(numStr); console.log(typeof numInt); // 输出结果为 number
规则 号两边只要有一个是string都会把另一个数据转换成string类型除了以外的算术运算符 比如 - * / 等都会把数据转换成数字类型
注意当当号作为正号是会将数据转换成数字类型
//号做拼接
console.log(22) //输出为22
//号做正号 加号
console.log(22) //输出为22
console.log(22) //输出为22缺点是转换类型不明确
显式转换
以下是常用的显式转换示例及对应的结果 使用全局函数 Number() 将任意类型的变量转换为数字类型。 示例let strNum 10; let num Number(strNum); // 输出结果为 10 (number) 使用全局函数 String() 将任意类型的变量转换为字符串类型。 示例let boolValue false; let strBool String(boolValue); // 输出结果为 “false” (string) 使用全局函数 Boolean() 将任意类型的变量转换为布尔类型。 示例let zero 0; let isZero Boolean(zero); // 输出结果为 false (boolean)
例如转换成数字类型
Number(数据) 如果转换时String中有非数字转换失败时显示结果为NaN即不是一个数字NaN也是Number类型的数据代表非数字 parselnt(数据) 只保留整数 parseFloat(数据) 保留整数和小数
自增运算符
前置先加再用 、后置先用再加
let i 1
console.log(i 2 ) //输出结果为4 i先加1再计算
console.log(i 2 ) //输出结果为3 i先参与计算BUT 在独立使用的时候两者结果并灭有区别比较运算符
js中需要注意的比较运算符 左右两边值是否相等 左右两边时候类型和值都相等
在js开发中比较是否相等推荐使用
同样比较String 比较的是其对应的ASCII码
运算符比较级
优先级运算符顺序1小括号()2一元运算符 – !3算数运算符* / -4关系运算符 5相等运算符 ! !6逻辑运算符 ||7赋值运算符8逗号运算符,
一元运算符中优先级很高
分支语句
if三元运算符switch
if分支语句
if单分支
script//注意这边类型转换我们可以直接在前面写一个号// let score ( prompt(please you score))let scoreNumber( prompt(please you score))if (score 700) {alert(you score 700)}
/script双分支语句
script//注意这边类型转换我们可以直接在前面写一个号// let score ( prompt(please you score))let scoreNumber( prompt(please you score))if (score 700) {alert(you score 700)}else {alert(you scoer 700 )}
/script多分支语句
script//注意这边类型转换我们可以直接在前面写一个号// let score ( prompt(please you score))let scoreNumber( prompt(please you score))if (score 90) {alert(you score is 优秀)}else if(score 80) {alert(you score is 良好)}else if(score70) {alert(you score is 中等)}else {alert(you scoer 及格 )}
/script三元运算符
语法
条件 ? 满足条件时执行的代码 : 不满足条件时执行的代码console.log(35?3:5) //返回值为5数字补0案例 let num (please print number)num num 10 ? 0num:numalert(num)switch分支语句
语法 switch(sp){case :alert(num1num2)breakcase -:alert(num1-num2)breakcase *:alert(num1*num2)breakcase /:alert(num1/num2)breakdefault:alert(恁不输入加减乘除恁弄啥嘞)}
//注意switch 需要配合break使用 不然会造成switch穿透While循环
基本语法
打印10遍abc
let i 0
while (i10){document.write(abc br)i
}循环的退出
break 和continue 与java中作用相同
for循环