Javascript基础语法详解

ops/2025/3/16 21:38:12/
  • 面向对象的语言.
  • 脚本语言,不需要编译,浏览器解释即可运行 .
  • 用于控制网页的行为.
  • 浏览器的source可以打断点调试, console输入代码可以执行
use strict指令:

在“严格模式”下运行js代码, 防止意外创建全局变量等, 提高代码安全性和执行效率.

使用:
  • 全局严格模式:在脚本的开头添加 "use strict".
  • 函数级严格模式: 在函数的开头添加 "use strict"
    javascript">function myFunction() {"use strict";// 仅该函数内部运行在严格模式下
    }
    
js的引入
1. 内部脚本
  • js可以放在任意位置,一般放在body标签底部.
<body><h1>Hello, World!</h1><script>javascript">console.log("Hello from inline script!");</script>
</body>
2. 外部脚本
<head><script src="script.js"></script>
</head>
基础语法
  • js区分大小写,语句末尾的分号可有可无
  • 注释和java一样
输出语句

window.alert(): 弹出警告框, window.可省略.

document.write(): 显示在页面上.

console.log() : 打印在控制台.

基本数据类型
  • 原始数据类型是不可变的,存储在栈内存中,按值比较.
  • Number:数字
  • String:字符串,用单引号、双引号包裹
  • Boolean:布尔值
  • Undefined:变量未赋值.
  • Null:表示“无”或“空值”,类型是 object
引用数据类型
  • 引用数据类型是可变的,存储在堆内存中,按引用比较

  • Object:表示对象,可以存储键值对

    javascript">let person = {name: 'Alice',age: 30
    };
    
  • Array:数组

    javascript">let numbers = [1, 2, 3, 4, 5];
    
  • Function:函数也是对象

    javascript">function greet() {return 'Hello!';
    }
    
  • Date:日期和时间

    javascript">let now = new Date();
    
类型检查

typeof :检查数据类型。

javascript">console.log(typeof num1); // "number"
console.log(typeof str1); // "string"
console.log(typeof isActive); // "boolean"
console.log(typeof notAssigned); // "undefined"
console.log(typeof emptyValue); // "object"
console.log(typeof person); // "object"
console.log(typeof numbers); // "object"
console.log(typeof greet); // "function"
字符串

length : 字符串长度

charAt() : 返回指定位置的字符
indexOf() : 查找子字符串首次出现的位置
trim() : 去除字符串两边的空格
substring() : 截取字符串

变量
1. var
  • var定义的变量可以被覆盖.
  • 具有函数作用域, 在函数内声明的var变量在函数内有效:
function testVar() {if (true) {var x = 10; // 函数作用域}console.log(x); // 输出: 10
}
testVar();//在函数外不能访问:
<script>  function testVar() {  if (true) {  var x = 10; // 函数作用域  }   }  alert(x);  
</script>
  • 不受块级作用域{}影响,即使声明在块内,块外也可以访问。
{var x = 10;
}
console.log(x); // 输出: 10
2. let
  • 具有块级作用域:变量只在声明的 {} 内有效,超出作用域不能访问
<script>  {  let a = 1;  }  alert(a);  //不会弹出警告框
</script>
  • 不能重复定义
{  let a = 1;  let a="s";  //报错
}
3. const
  • 作用域:和let一样,也不能重复定义

    javascript">{const d = 20;console.log(d); // 输出 20
    }
    console.log(d); // 报错: Uncaught ReferenceError: d is not defined
    
  • const 声明的变量必须初始化.

  • const修饰的原始数据类型不能重新赋值

  • const修饰的引用数据类型如对象,数组的内容可以修改,引用(地址)不能修改。

    javascript">const f = 30;
    f = 40; // 报错: TypeError: Assignment to constant variable.const arr = [1, 2, 3];
    arr.push(4); // 合法操作
    console.log(arr); // 输出 [1, 2, 3, 4]
    
显式类型转换
转换为字符串
javascript">console.log(String(123)); // 输出 "123"
console.log((123).toString()); // 输出 "123"
console.log(String(true)); // 输出 "true"
console.log(String(null)); // 输出 "null"
转换为数字
javascript">console.log(Number("123")); // 输出 123
console.log(Number("")); // 输出 0
console.log(Number("123abc")); // 输出 NaN
console.log(parseInt("123.45")); // 输出 123
console.log(parseFloat("123.45")); // 输出 123.45
转换为布尔值
  • 0NaNfalse;
  • 空字符串是false;
  • NullUndefinedfalse;
javascript">console.log(Boolean(1)); // 输出 true
console.log(Boolean(0)); // 输出 false
console.log(Boolean("")); // 输出 false
console.log(Boolean("hello")); // 输出 true

不要使用==比较,使用===等号,因为===不仅比较值,还会比较类型是否相等.

循环
for...in循环:
  • 可用于遍历对象,数组的属性,不能遍历字符串、SetMap.
  • 用于数组时,遍历的是数组的索引,不是数组的值。
let obj = { name: "Alice", age: 25, city: "NY" };
for (const key in obj) {console.log(key, obj[key]);
}
// 输出:
// name Alice
// age 25
// city NY
for...of循环:
  • 直接遍历值,可用于数组、字符串、SetMap 等,不能遍历对象
let arr = ["a", "b", "c"];for (const value of arr) {console.log(value); // 输出 "a", "b", "c"(值)
}
forEach() 循环

用于遍历数组.

语法:

array.forEach(function(currentValue, index, array) {});//currentValue(必需):当前正在处理的元素。
//index(可选):当前元素的索引
//array(可选):调用 forEach() 的原数组

示例:

javascript">let fruits = ["apple", "banana", "orange"];fruits.forEach(function(fruit, index) {console.log(index + ": " + fruit);
});//输出:
/*0: apple
1: banana
2: orange*/
javascript">let numbers = [1, 2, 3, 4];numbers.forEach(num => console.log(num * 2));//输出:2 4 6 8

注意:

forEach() 无法中途退出循环(break无效),return 也不会停止循环:

javascript">let arr = [1, 2, 3, 4, 5];arr.forEach(num => {if (num === 3) return; // 这里的 return 只会跳过当前迭代,不会终止循环console.log(num);
});

forEach() 不能直接修改原数组:

javascript">let arr = [1, 2, 3];arr.forEach(num => num = num * 2); // 这样不会改变数组
console.log(arr);  // [1, 2, 3]

forEach() 不会跳过 undefined.


http://www.ppmy.cn/ops/166321.html

相关文章

【云原生技术】编排与容器的技术演进之路

一、编排与容器的技术演进之路 1.1 DockerClient 此时 K8s 只是编排领域的一个选择&#xff0c;而 Docker 此时一家独大&#xff0c;所以 K8s 的客户端只 是作为 Docker 的客户端来调用 Docker 引擎来完成服务。 1.2 RUNC&Shim OCI催生 runcrunc&#xff0c;剥离 Docke…

C++ STL算法函数 —— 应用及其操作实现

一、STL算法函数分类概述 STL算法库提供了大量实用函数&#xff0c;按功能可分为以下五类&#xff1a; 1. 不修改序列的操作 定义&#xff1a;这些算法不会改变容器中的元素&#xff0c;仅对数据进行查询或统计。 典型函数&#xff1a; 函数功能示例find(first, last, value…

Java 集合遍历过程中修改数据触发 Fail-Fast 机制 ,导致报ConcurrentModificationException异常

Java Fail-Fast 机制 Fail-Fast 机制是 Java 集合框架中的一种错误检测机制&#xff0c;用于在遍历集合时检测结构修改。如果在迭代器创建之后&#xff0c;集合被修改&#xff08;例如添加或删除元素&#xff09;&#xff0c;并且这种修改不是通过迭代器自身的 remove() 方法进…

Webpack 知识点整理

​ 1. 对 webpack 的理解&#xff1f;解决了什么问题&#xff1f; Webpack 是前端工程化领域的核心工具&#xff0c;其核心定位是模块打包器&#xff08;Module Bundler&#xff09;&#xff0c;通过将各类资源&#xff08;JS、CSS、图片等&#xff09;视为模块并进行智能整合…

【GPT入门】第21课 langchain核心组件

【GPT入门】第21课 langchain核心组件 1. langchain 核心组件2.文档加载器 Document loader3.文档处理器3.1 langchain_text_splitters3.3 FAISS向量数据库和向量检索主要作用应用场景4. 对话历史管理1. langchain 核心组件 模型 I/O 封装 LLMs:大语言模型 Chat Models:一般…

用人工智能程序驱动机器人工作

算法模型训练&#xff1a;首先&#xff0c;需要收集与机器人任务相关的数据&#xff0c;例如机器人在不同环境下的运动数据、视觉图像数据、语音指令数据等。然后&#xff0c;使用这些数据来训练各种人工智能算法模型&#xff0c;如机器学习中的决策树、支持向量机&#xff0c;…

Rust语言的移动应用开发

Rust语言在移动应用开发中的应用 引言 随着移动设备的普及&#xff0c;移动应用开发已经成为软件开发领域的一大热点。传统上&#xff0c;移动应用开发主要依赖于Java、Swift和Kotlin等语言。然而&#xff0c;近年来&#xff0c;Rust语言因其独特的特性逐渐受到关注&#xff…

matlab 谐波分析公式绘图

1、内容简介 matlab158-谐波分析公式绘图 2、内容说明 略 3、仿真分析 略 4、参考论文 略