网站定制开发怎么做,如何在网站做投票,石家庄知名网站,凡客诚品的售后服务有哪些大家好#xff0c;我是来自CSDN的博主PleaSure乐事#xff0c;今天我们开始有关JS的学习#xff0c;希望有所帮助并巩固有关前端的知识。
我使用的编译器为vscode#xff0c;浏览器使用为谷歌浏览器#xff0c;使用webstorm或其他环境效果几乎一样#xff0c;使用系统自…大家好我是来自CSDN的博主PleaSure乐事今天我们开始有关JS的学习希望有所帮助并巩固有关前端的知识。
我使用的编译器为vscode浏览器使用为谷歌浏览器使用webstorm或其他环境效果几乎一样使用系统自带的默认浏览器效果可能会有偏差但是问题不大都可以使用。 目录
JavaScript介绍
JS简介
JS书写位置
内部JS
外部JS
JS注释
结束符
输入输出语法
输出
document.write
编辑
console.log
alert
输入
字面量
JavaScript变量
定义
基本使用
变量的声明
变量的赋值
变量的更新与变量值的交换
命名规则与规范
规则
规范
let和var关键字的区别
作用域
变量提升
重复声明
全局属性
JavaScript数组
JavaScript常量
JavaScript数据类型
基本数据类型
number数字类型
string字符串类型
字符串基本定义
字符串拼接
boolean布尔型
undefined未定义型
null空类型
复杂数据类型
JavaScript类型转换
隐式转换
编辑
显示转换
结语 JavaScript介绍
JS简介
JS是一种客户端浏览器编程语言主要用于监听、表单验证、数据交互、服务端编程node.js等方面由ECMAScript和Web APIs两部分组成其中Web APIs包含DOM文档操作和BOM操作浏览器两方面。
JS书写位置
内部JS
内部JS主要写在body内但是要在/body上方即整个body最后目的是为了操作上面的html元素。内部JS的主要书写方法如下
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
bodyh1PleaSure乐事/h1scriptalert(我是来自CSDN的PleaSure 希望我的博客对你有帮助)/script
/body
/html 作为内部JS也可以直接在html按键中直接书写需要的JS代码但是注意在vue中会使用这样的方法尽量避免使用这样的写法例如
button onclickalert(hello world)点击生效/button
外部JS
外部JS是在目标html文件外部建立一个以.js结尾的文件并在目标html文件中在script中使用其路径进行引入在.js文件中直接写需要的js内容。 但是一定要注意的是在引用需要的js文件后script/script中不能写其他的代码否则会自动忽略。 例如
//test.html
bodyh1PleaSure乐事/h1script srctest.js/script
/body//test.js
alert(我是来自CSDN的PleaSure 希望我的博客对你有帮助) JS注释
JS的注释和C、Java等类似也分为单行注释和块注释两类书写格式同样为两个左斜杆和斜杠星号比如
//注释
/*注释*/
结束符
CSS中需要「封号」来判断结束但是JS中可以不写一般跟着团队需求和开发规范来写。
输入输出语法
输出
document.write
输出语法的第一个为document.write可以结合h1等标签进行书写。具体使用方法如下
bodyh1PleaSure乐事/h1scriptdocument.write(小黑子)/script
/body console.log
第二种输出语法是console.log控制台输出主要供程序员调试时使用在页面当中不显示但是控制台中会出现。控制台的调用方法为右键浏览器-检查页面元素即可调出。 alert
第三种输出方式则为使用页面弹出警示框alert同内部JS中出现的alert 即为在用户进行操作前会进行提示。这一个输出已经在上面的JS书写位置部分已经讲解就不再阐述。
输入
在JS当中输入主要就一种prompt可以由此获得用户输入的内容。其中prompt括号中的前半部分应当输入提示信息后半部分输入“输入框”中的默认信息。代码及效果如下
bodyscriptvar userInput prompt(请输入你的请求, 学费了);if (userInput ! 学费了) {document.write(你输入的请求是 userInput);}else{document.write(已学费还要努力);}/script
/body PS这里如果输入其他内容则会输出if语句当中的内容这里就不再做展示。
字面量
在JS当中字面量是一种表示特定值的语法形式它直接在源代码中表示数据本身。字面量不是变量而是在代码中直接写出的实际数据。当你读取或编写代码时你看到的就是它的实际值即“所见即所得”。JS当中的字面量主要包含以下几种
数字字面量直接写出数字可以是整数或浮点数。例如114514, 3.14。字符串字面量由引号包围的一系列字符可以使用单引号或双引号。例如hello, world。布尔字面量只有两个可能的值true 或 false。空字面量null 表示一个空值或不存在的对象引用。未定义字面量undefined 表示一个变量已经被声明但是还没有被赋值。对象字面量使用大括号 {} 包围的一组键值对。例如{key: value}。数组字面量使用方括号 [] 包围的一系列值。例如[1, 2, 3]。模板字面量使用反引号 包围的字符串可以嵌入变量和表达式。例如Hello, ${name}!。正则表达式字面量由斜杠 / 包围的模式用于字符串匹配。例如/abc/gi。
JavaScript变量
定义
变量是存储数据的容器当不是数据本身。本质是程序在内存中申请的一块用来存储数据的小空间。需要注意的是如果变量过大或者其他情况可能会导致内存溢出的情况。 基本使用
变量的声明
变量的声明由两部分构成声明关键字和变量名也称标识。声明的关键字为let即提供的声明变量的词语。语法为关键字变量例let xiaoheizi。可以在一句let语句中同时定义多个变量例如let agename…… 。不过为了更好的可读性一般分开写不写在同一行。
变量的赋值
赋值与Java等一致可以使用alert或者documen.write在页面中进行输出。注意变量在声明的时候可以直接赋值即初始化。
bodyscriptlet ageage 18document.write(age)/script
/body 也可以和上面的prompt一起使用。
变量的更新与变量值的交换
变量可以重新进行赋值但是不可以重复定义。
多个变量可以使用一个中间变量进行交换冒泡排序就是基于中间变量进行交换的。
命名规则与规范
规则
变量命名不能使用关键字如varlet等作为变量名只能使用下划线数字等且数字不能打头并严格区分大小写。
规范
变量命名应当做到命名有意义见名知其意并使用驼峰命名比如使用pleaSureCsdn就是一个典型的驼峰命名且见名知意。
let和var关键字的区别
作用域
声明的变量具有函数作用域。在一个函数内部使用 var 声明一个变量那么这个变量在整个函数体中都可见。如果在全局作用域中声明那么它将成为一个全局变量。
let 声明的变量具有块作用域。这意味着在 { } 内部声明的变量只在该代码块内可见。
变量提升
var 声明的变量会被提升至作用域的顶部即我们可以在声明之前访问这些变量虽然其值会是 undefined。
let 声明的变量不会被提升。在声明之前访问这些变量会导致一个引用错误。
重复声明
var 允许在同一作用域内重复声明同一个变量名后面的声明会覆盖前面的声明。
let 不允许在同一个作用域内重复声明同一个变量名。尝试这样做会抛出一个语法错误。
全局属性
当你在全局作用域中使用 var 声明变量时该变量会自动成为 window 对象的一个属性。
使用 let 声明的变量不会成为 window 对象的属性即使它是在全局作用域中声明的。
JavaScript数组
数组就是数据的组合将一组数据存储在单个变量名下。声明方式为关键字let 数组名arr 数组字面量[] 也可以用new array构造函数声明。
数组中每个数据按照顺序保存都有编号也称为索引号、下标从0开始和Java、C等相似但是不同的地方是在JavaScript当中数组可以存储不同类型数据即在同一个数组当中存储整数字符串等。
scriptlet age [114514,123123,145678];let name [jack,tom,lily];console.log(age);console.log(name);document.write(age);document.write(br);document.write(name);
/script JavaScript常量
JS当中使用const声明的变量叫常量。
声明方式关键字const 变量名 数值 例const PI 3.1415926
使用场景某个变量永远不会改变使用const定义不用let或var定义。需要特别注意的是const定义的时候一定要初始化切不可修改用let定义的时候可以先不赋值。
JavaScript数据类型
JavaScript中的数据类型都是弱数据类型赋值后才知道它的数据类型。强数据类型就是赋值之前就已经知道类型比如Java中会先用int定义一个变量名此时我们已经知道了数据类型那么就知道该变量的类型就称为强数据类型。PS需要留意undefined和null二者的区别。
基本数据类型
number数字类型
该类型包含整数、浮点数小数可以进行加减乘除这四种基本的运算以及取模运算。但是需要注意运算之间的需要注意优先级。
此时我们引入一个概念NaN。NaN代表一个计算错误表示一个不正确为未被定义的数学操作的到的结果。NaN是粘性的任何跟NaN的操作都会返回NaN。就像以下输出都会是NaN
let result Number(Hello World);
console.log(result);
let result 0 / 0;
console.log(result);
let result Infinity - Infinity;
console.log(result);
let result 123abc * 2;
console.log(result);
string字符串类型
字符串基本定义
字符串常用单引号、双引号、反引号套起来使用单引号和双引号基本没有区别一般推荐使用单引号引号中没有内容就称为空字符串但是需要注意哪怕只有一个空格都不是空字符串。
scriptlet name jacklet age 18let gender 男let hobby [唱,跳,rap,篮球]let phone 123456
/script
单双引号可以相互嵌套外单内双或者外双内单必要时可以使用转义符\来输出单双引号
字符串拼接
字符串拼接可以直接用加号进行比如数字字符拼接 ‘giegie’ 18 ’nb‘、字符相连‘哥哥’ ‘giegie’。另外还有一种字符串叫模版字符串即外面用反引号包裹里面用${变量名}替代可以参考python中的输出形式 例document.write(‘我今年${age}了’}。
scriptlet name PleaSure;let age 30;let greeting Hello, my name is ${name} and I am ${age} years old.;console.log(greeting);
/script boolean布尔型
只有两个固定的值true和false
undefined未定义型
表示未赋值的变量即已经定义了变量但是还没有初始化。
null空类型
表示赋值了但内容为空即一个尚未创建的对象已经创建了一个对象但是还处于没准备好的阶段
复杂数据类型
复杂数据类型也常被称为复合数据类型或引用数据类型是指那些由简单数据类型原始类型组合而成的数据结构。这些类型通常需要更多的内存空间并且它们的值存储在堆内存中而变量本身只存储指向这些值的引用指针。当变量被赋值为复杂数据类型时实际上存储的是指向数据所在位置的内存地址而非数据本身
主要包含数组、对象、函数、Map和Set、TypedArray 和 DataView等。
JavaScript类型转换
JS当中的转换原因表单、prompt获得的数据默认为字符串而非其他类型故不能直接进行相加 所以我们需要把数据类型进行类型转换后再进行我们需要的操作。
隐式转换
隐式转换是系统内部自动进行类型转换如果号两边只要有一个字符串们就会把另一个也转换成字符串 但是除了意外-*/都自动转换为数字类型。
scriptconsole.log(1 1)console.log(1 pleasure)console.log(1 2)console.log(1 2)console.log(1 - 2)console.log(1 - 2)console.log(12)console.log(12)
/script 显示转换
由于隐式转换的逻辑不严谨而且过于依赖经验所以需要显示转化来转化为我们需要的类型。
对于数字型可以直接用Number类型转化为数字类型例Number(目标) 。特例NaN也是数字类型代表非数字。
可以用parseInt只保留整数。例parseInt(目标)。
可以用parseFloat保留小数 例parseFloat(目标) 结语
今天对JavaScript进行了一定介绍并对变量、数组、常量、数据类型、类型转换等进行了学习并与大家分享希望对大家有帮助。
如果对您有帮助希望您可以为我留下点赞、评论、收藏或关注这对我真的很重要非常感谢
