人网站设计与制作,微站是什么东西,如何用dw8做网站视频,图书信息管理系统代码网站建设前端篇之JavaScript基础语法(三十四)
JavaScript的三种引用方式
JavaScript的三种引用方式分别是#xff1a;
内部引用#xff08;内联式#xff09;#xff1a;将JavaScript代码嵌入到HTML页面中的script标签内部。例如#xff1a;
script typetex…前端篇之JavaScript基础语法(三十四)
JavaScript的三种引用方式
JavaScript的三种引用方式分别是
内部引用内联式将JavaScript代码嵌入到HTML页面中的script标签内部。例如
script typetext/javascript// JavaScript代码
/script外部引用链接式使用script标签的src属性引入外部的JavaScript文件。例如
script typetext/javascript srcjs/script.js/script模块化引用ES6模块化使用import和export关键字将JavaScript代码模块化然后通过script标签的type属性设置为module来引入。例如
script typemoduleimport { func1, func2 } from ./modules.js;// 使用 func1 和 func2 函数
/scriptJavaScript 的变量与类型
JavaScript是一种动态类型语言变量的类型不需要显式地声明而是在运行时根据赋值来推断其类型。JavaScript中有以下基本的数据类型 数字(Number)整数或浮点数。 字符串(String)一串文本用单引号()或双引号()括起来表示。 布尔(Boolean)true或false。 空值(Null)表示一个空对象指针即该变量不指向任何对象。 未定义(Undefined)表示变量未定义或未赋值。 对象(Object)一种复合数据类型由多个键值对组成。 数组(Array)一种特殊的对象由多个元素组成。 函数(Function)一种可执行的对象包含一段可重复使用的代码。
在JavaScript中变量的类型可以通过typeof操作符来判断变量的类型。例如
var a 10;
console.log(typeof a); // 输出numbervar b hello;
console.log(typeof b); // 输出stringvar c true;
console.log(typeof c); // 输出booleanvar d null;
console.log(typeof d); // 输出objectvar e;
console.log(typeof e); // 输出undefined另外注意const关键字声明的变量是不可变的immutable一旦被赋值之后就无法修改。对于复杂类型如对象和数组虽然const声明的变量不可变但是对象和数组中的成员可以修改。
JavaScript是一种弱类型语言它的变量可以保存不同类型的数据。JavaScript的变量定义可以使用var、let和const等关键字。
var关键字定义的变量是全局变量可以在函数内部、函数外部以及全局上下文中使用。但是var定义的变量存在变量提升现象即变量在声明之前就可以使用这可能会导致一些意想不到的问题。
let和const关键字定义的变量是块级作用域变量只能在定义它的块中使用。let定义的变量可以被重新赋值而const定义的变量则不能被重新赋值。 var声明的变量作用域是函数作用域或全局作用域。 let声明的变量作用域是块作用域。 const声明的变量是一个常量一旦被赋值就不能再被修改作用域也是块作用域。
JavaScript还支持自定义类型可以使用构造函数来创建对象类型。例如
function Person(name, age) {this.name name;this.age age;
}let person new Person(Tom, 20);
console.log(person.name); // Tom
console.log(person.age); // 20JavaScript的输出方式
JavaScript可以通过多种方式输出结果包括
使用console.log()方法输出到控制台
console.log(Hello, world!);使用alert()方法弹出对话框输出
alert(Hello, world!);使用 document.write()输出结果在浏览器窗口中显示。
scriptdocument.write(Hello, world!);
/script4.在浏览器开发工具的console面板中输入JavaScript代码并回车直接输出结果
Hello, world!5.使用innerHTML属性将输出插入到HTML元素中例如
p idoutput/p
scriptdocument.getElementById(output).innerHTML Hello, world!;
/script6.使用window.open()函数打开一个新窗口并输出信息
window.open().document.write(Hello, world!);注意使用window.open()函数会被大多数浏览器拦截应谨慎使用。
7.使用 prompt()弹出一个对话框让用户输入内容并输出在对话框中
var name window.prompt(Whats your name?);
console.log(Hello, name !);JavaScript函数
JavaScript函数是一段可重复使用的代码块用于完成指定任务。函数由一组语句组成以关键字function开始后接函数名称和一组括号。函数可以接受参数也可以返回值。以下是一个简单的JavaScript函数示例
function add(a, b) {return a b;
}console.log(add(2, 3)); // 输出 5在上面的示例中add是一个函数名称它接受两个参数a和b返回它们的和。console.log用于输出函数调用结果5。
JavaScript函数是一组执行特定任务的语句。它们是用于执行特定任务的独立代码块可以在代码中重复使用。函数通常包括输入参数和返回值但不一定都要有。定义函数时必须给函数一个名称并在需要时调用它。例如以下是一个简单的JavaScript函数它将两个数字相加并返回结果
function addNumbers(a, b) {return a b;
}在上面的函数中addNumbers是函数的名称a和b是输入参数return a b是函数的返回值。要调用此函数请使用以下代码
var sum addNumbers(2, 3);在上面的代码中将数字2和3作为输入参数传递给addNumbers函数并将返回值赋值给变量sum。在这种情况下sum将是5。
JavaScrip的分支
JavaScript中的分支是用于根据条件执行不同的代码路径的结构。JavaScript中有两种类型的分支 - if/else语句和switch语句。
if/else语句根据一个条件来判断是否执行某段代码。如果条件为真则执行if语句块中的代码如果条件为假则跳过if语句块中的代码。if语句还可以与else语句一起使用以处理条件为假的情况
语法
if (condition) {// 执行条件为真时的代码
} else {// 执行条件为假时的代码
}示例
let age 18;if (age 18) {console.log(你已经成年了);
} else {console.log(你还未成年);
}switch语句switch语句基于一个表达式的值来执行不同的代码块。如果表达式与某个特定值匹配则执行与该值关联的代码块。如果没有匹配的值则执行default代码块
语法
switch (expression) {case value1:// 执行值为value1时的代码break;case value2:// 执行值为value2时的代码break;default:// 执行所有其他情况下的代码break;
}示例
let day Wednesday;switch (day) {case Monday:console.log(今天是星期一);break;case Tuesday:console.log(今天是星期二);break;case Wednesday:console.log(今天是星期三);break;default:console.log(今天是其他天);break;
}使用分支语句可以编写更具灵活性和可读性的代码以根据不同的条件执行不同的操作。
JavaScrip的循环
JavaScript提供了多种循环方式包括for循环、while循环、do…while循环和for…in循环。
for循环
for循环是JavaScript中最常见的循环结构它的一般形式如下
for (initialization; condition; increment/decrement) {// code to be executed
}其中initialization是循环变量的初始化condition是循环条件当条件为true时执行循环体increment/decrement是循环变量的增量或减量。
例如计算1到10的和
var sum 0;
for (var i 1; i 10; i) {sum i;
}
console.log(sum); // 输出552.while循环
while循环先判断循环条件是否为true如果为true则执行循环体。它的一般形式如下
while (condition) {// code to be executed
}例如计算1到10的和
var sum 0;
var i 1;
while (i 10) {sum i;i;
}
console.log(sum); // 输出55do…while循环
do…while循环先执行一次循环体然后判断循环条件是否为true如果为true则继续执行循环体。它的一般形式如下
do {// code to be executed
} while (condition);例如计算1到10的和
var sum 0;
var i 1;
do {sum i;i;
} while (i 10)
console.log(sum); // 输出55for…in循环
for…in循环用于循环遍历对象的属性。它的一般形式如下
for (variable in object) {// code to be executed
}其中variable是对象的属性名object是要遍历的对象。
例如遍历对象的属性
var person {name: John, age: 30, city: New York};
for (var x in person) {console.log(x : person[x]);
}
/*
输出
name: John
age: 30
city: New York
*/
