javascrip入门(代码片段)

橘猫吃不胖~ 橘猫吃不胖~     2023-02-02     158

关键词:

1 代码书写位置

JavaScript代码的3种书写位置:
行内式:是将单行或少量的JavaScript代码写在HTML标签的事件属性中

<a href="javascript:alert('消息框')">橘猫吃不胖</a>

内嵌式(嵌入式):使用<script>标签包裹JavaScript代码,<script>标签可以写在<head><body>标签中

<script type="text/javascript">
	 //js代码
</script>

外部式(外链式):将JavaScript代码写在一个单独的文件中,一般使用“js”作为文件的扩展名,在HTML页面中使用<script>标签进行引入,适合JavaScript代码量比较多的情况。注意外部式的<script>标签内不可以编写JavaScript代码,步骤为:
(1)先创建js文件(.js)
(2)在页面中使用<script src="js文件名"></script>导入

在编写JavaScript代码时,需要注意基本的语法规则:
1、JavaScript严格区分大小写,在编写代码时一定注意大小写的正确性
2、JavaScript代码对空格、换行、缩进不敏感,一条语句可以分成多行书写
3、如果一条语句结束后,换行书写下一条语句,后面的分号可以省略

2 注释

JavaScript代码的注释方式,以及在VS Code编辑器中对应的快捷键如下:
1、单行注释:以“//”开始,到该行结束或<script>标签结束之前的内容都是注释。快捷键:ctrl + /
2、多行注释:“ /* 注释内容 */”。需要注意的是,多行注释中可以嵌套单行注释,但不能再嵌套多行注释。快捷键:shift + alt + a

3 输入和输出语句

1、alert(“字符串”):是一个消息提示框(只有一个确定按钮的对话框)
2、confirm(“字符串”):确认对话框(含有确定和取消按钮的对话框),当用户点击“确定’”按钮时该函数返回true,当用户点击“取消”按钮时返回false
3、prompt(“字符串”):带有一个输入框的消息提示框,当用户点击“确定”按钮时,返回用户输入的信息,当用户点击“取消”按钮时,关闭窗口
4、console.log(“信息”):在终端输出信息
5、console.info(“信息”):在终端输出信息
6、console.error(“信息”):在终端显示红色的错误信息

4 JavaScript变量

4.1 什么是变量

变量是程序在内存中申请的一块用来存放数据的空间。例如,程序在内存中保存字符串“小明”和“小张”,如下图所示。

4.2 变量的使用

变量的使用,分为两步:声明变量和变量赋值。
1、声明变量

var age;//声明一个名称为age的变量

2、变量赋值

age = 10;//为变量age赋值

3、变量初始化

var age = 10;//声明变量的同时为变量赋值

4.3 变量的语法细节

1、更新变量的值,示例代码如下:

var myName = '小明';
console.log(myName);	// 输出结果:小明
myName = '小红';		// 更新变量的值
console.log(myName);	// 输出结果:小红

2、同时声明多个变量

var myName, age, email;//同时声明多个变量不赋值
var myName = '小明', age = 18, email = 'xiaoming@localhost';//同时声明多个变量并赋值

3、声明变量的的特殊情况
①只声明变量,但不赋值。

var age;
console.log(age);	

结果为undefined

②不声明变量,直接输出变量的值。

console.log(age);	

控制台会报错

③不声明变量,只进行赋值。

age1 = 10;
console.log(age1);

输出结果10

注意:直接赋值一个未声明的变量,也可以正确输出变量的值。这个情况是JavaScript语言的特性。

4.5 变量的命名规范

在对变量进行命名时,需要遵循变量的命名规范,具体如下:
1、由字母、数字、下划线和美元符号($)组成
2、严格区分大小写
3、不能以数字开头
4、不能是关键字、保留字
5、要尽量做到“见其名知其意”
6、建议遵循驼峰命名法,首字母小写,后面的单词首字母大写

vue入门组件化开发(代码片段)

创建组件的两种方式:1、局部组件声明、注册和使用:方法一(推荐)、<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title></head><body><scripttype="text/javascrip 查看详情

javascrip笔记心得(持续更新)(代码片段)

JavaScrip笔记心得一、JavaScript简介1、JavaScript2、JavaScript使用方法3、JavaScript的核心构成4、Javascript的代码注释5、Javascript的数据类型6、变量的声明和赋值7、表达式与运算符二、JavaScrip语句和函数1、if分支结构2、switch分支结构3、whi... 查看详情

javascrip笔记心得(持续更新)(代码片段)

JavaScrip笔记心得一、JavaScript简介1、JavaScript2、JavaScript使用方法3、JavaScript的核心构成4、Javascript的代码注释5、Javascript的数据类型6、变量的声明和赋值7、表达式与运算符二、JavaScrip语句和函数1、if分支结构2、switch分支结构3、whi... 查看详情

javascrip(代码片段)

 #javascript基础##一、javascript的介绍###(一)javascript的诞生>1994年,网景公司(NetScape)发布了Navigator浏览器0.9版,这是历史上第一个比较成熟的浏览器,引起了广泛关注。但是,这个版本的浏览器只能用来浏览,不具备与... 查看详情

javascrip笔记心得(持续更新)(代码片段)

JavaScrip笔记心得一、JavaScript简介1、JavaScript2、JavaScript使用方法3、JavaScript的核心构成4、Javascript的代码注释5、Javascript的数据类型6、变量的声明和赋值7、表达式与运算符二、JavaScrip语句和函数1、if分支结构2、switch分支结构3、whi... 查看详情

zt-----用javascrip写一个区块链(代码片段)

...人懂得隐藏在它们背后的技术。在这篇博客中,我将会用JavaScript来创建一个简单的区块链来演示它们的内部究竟是如何工作的。我将会称之为SavjeeCoin!全文分为三个部分: 实现一个基本的区块链实现POW交易与挖矿奖励 ... 查看详情

ts编程——面向对象随手录——接口_命名空间——重构javascrip3d引擎代码部分——函数(代码片段)

导出一个接口:exportdefaultinterfaceInnerfun():void;类去实现一个接口;实现的时候类型推导出已经引用:可以使用接口来确保类拥有指定的结构,约束对象,避免很多潜在的小错误。尤其在写字面量对象时importInnerf... 查看详情

htmlpupsternavbar入门代码(代码片段)

查看详情

phpfacebookphpsdk入门代码(代码片段)

查看详情

web前端---javascrip基础

avaScrip基础JavaScrip简介第一个JavaScrip代码数据类型运算符数据类型转换流程控制常用内置对象一、JavaScrip简介1.JavaScrip历史背景介绍    布兰登?艾奇(BrendanEich,1961年~),1995年在网景公司,发明的JavaScript。  一开始JavaS... 查看详情

htmlmememaker的入门代码(代码片段)

查看详情

htmlmememaker的入门代码(代码片段)

查看详情

markdown入门(代码片段)

查看详情

markdown入门(代码片段)

查看详情

markdownwebpack-入门(代码片段)

查看详情

htmlhtml:入门(代码片段)

查看详情

markdownfirebase入门(代码片段)

查看详情

markdownreactnativeandroid入门(代码片段)

查看详情