news 2026/4/24 12:02:20

JS核心语法

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
JS核心语法
特性varletconst
块级作用域❌(函数级作用域)
变量提升✅(可先使用后声明)❌(暂时性死区)❌(暂时性死区)
重复声明
重新赋值❌(声明时必须赋值)
// var 问题:无块级作用域 if (true) { var a = 10; } console.log(a); // 10(全局可见,不合理) // let 解决块级作用域 if (true) { let b = 20; } console.log(b); // 报错:b is not defined // const 常量(不可修改引用) const PI = 3.14159; PI = 3; // 报错:Assignment to constant variable const obj = { name: '张三' }; obj.name = '李四'; // 允许(仅禁止修改引用,对象内容可改)
console.log(num); // undefined(变量提升,声明了但未赋值) var num = 10; // let/const 无变量提升 console.log(num2); // 报错:Cannot access 'num2' before initialization let num2 = 20;

三、数据类型

JS 是弱类型语言(声明变量时无需指定类型,赋值后类型可变),分为两大类:

3.1 原始类型(值类型)

存储具体值,占用空间小,赋值时拷贝值。

  • string:字符串(单引号 / 双引号 / 反引号包裹)
  • number:数值(整数、小数、NaN、Infinity)
  • boolean:布尔值(true/false)
  • undefined:声明变量未赋值时的默认值
  • null:表示 “空”(手动赋值,类型为 object,历史遗留问题)
  • symbol(ES6):唯一值(用于对象唯一属性名)
  • bigint(ES11):大整数(解决 Number 最大值2^53-1限制)
let str = 'Hello JS'; // string let num = 100; // number let bool = true; // boolean let un = undefined; // undefined let nu = null; // null let sym = Symbol('id'); // symbol let big = 9999999999999999999999999999n; // bigint

3.2 引用类型

存储内存地址,占用空间大,赋值时拷贝地址(多个变量指向同一内存)。

  • object:对象(普通对象、数组、正则、日期等)
  • function:函数(特殊的对象)
// 普通对象 let user = { name: '张三', age: 20 }; // 数组(特殊对象) let arr = [1, 2, 3]; // 函数(特殊对象) let fn = function() {};

3.4 类型转换

3.4.1 隐式转换(JS 自动触发,易踩坑)
  • 转布尔:0''undefinednullNaNfalse,其余为true
  • 转数字:字符串转数字('123' → 123'abc' → NaN),布尔转数字(true → 1false → 0)。
  • 转字符串:数字 / 布尔转字符串(123 → '123'true → 'true')。
3.4.2 显式转换(手动控制,推荐)
// 转数字 Number('123'); // 123 parseInt('123abc'); // 123(取整) parseFloat('123.45abc'); // 123.45 // 转字符串 String(123); // '123' (123).toString(); // '123' // 转布尔 Boolean(0); // false Boolean(''); // false Boolean('abc'); // true

逻辑运算符

用于条件判断,返回最终的真值 / 假值。

运算符说明示例短路规则
&&逻辑与true && false → false左假则返回左,左真返回右
``逻辑或`truefalse → true`左真则返回左,左假返回右
!逻辑非!true → false取反
// && 短路:左假返回左 console.log(false && 123); // false console.log(1 && 2 && 3); // 3(全部为真,返回最后一个) // || 短路:左真返回左 console.log(123 || false); // 123 console.log(0 || '' || 'abc'); // 'abc'(全部为假,返回最后一个) // 实用场景:设置默认值 let userName = ''; let name = userName || '游客'; // name → '游客'

三元运算符(条件运算符)

语法:条件 ? 表达式1 : 表达式2(简化 if-else)

let age = 18; let result = age >= 18 ? '成年' : '未成年'; console.log(result); // '成年' // 嵌套三元(不推荐多层,可读性差) let score = 85; let grade = score >= 90 ? 'A' : score >= 80 ? 'B' : 'C';
do-while 循环

语法:do { 循环体 } while (条件)(先执行一次,再判断条件)

let i = 0; do { console.log(i); i++; } while (i < 5);
增强循环(ES6+)

for-in:遍历对象的可枚举属性(不推荐遍历数组,会遍历原型链)

let obj = { name: '张三', age: 20 }; for (let key in obj) { console.log(key, obj[key]); // name 张三, age 20 }

for-of:遍历可迭代对象(数组、字符串、Map/Set 等),返回值而非索引

let arr = ['a', 'b', 'c']; for (let val of arr) { console.log(val); // a,b,c }
循环控制
  • break:跳出当前循环(终止循环)。
  • continue:跳过当前轮循环,进入下一轮。
    // break 示例:找到第一个偶数就停止 for (let i = 1; i < 10; i++) { if (i % 2 === 0) { console.log('第一个偶数:', i); // 2 break; } } // continue 示例:只打印奇数 for (let i = 1; i < 10; i++) { if (i % 2 === 0) { continue; } console.log(i); // 1,3,5,7,9 }
版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/23 12:25:03

房地产公司组织结构图在线设计 项目开发团队层级

良功绘图网站 (https://www.lghuitu.com ) 在房地产行业高速发展与市场竞争日益激烈的当下&#xff0c;企业的运营效率、协同能力与决策速度成为核心竞争力的关键要素。房地产项目开发具有周期长、涉及环节多、跨部门协作频繁、资源投入巨大等特点&#xff0c;从土地获取、规划…

作者头像 李华
网站建设 2026/4/23 23:50:31

Spring框架架构详解:从设计理念到企业级应用

1 Spring框架简介Spring框架是一个开源的Java平台&#xff0c;旨在简化企业级应用程序开发。由Rod Johnson于2003年创建&#xff0c;Spring的初衷是为了解决当时Java EE开发中的复杂性问题&#xff0c;特别是EJB&#xff08;Enterprise JavaBeans&#xff09;架构的臃肿和配置繁…

作者头像 李华
网站建设 2026/4/23 20:17:54

AI 质检系统全面替代人工:缺陷率下降 68%,精度远超肉眼

一、引言&#xff1a;传统质检的困局与 AI 破局的必然性2025 年&#xff0c;我国制造业质量竞争力指数已提升至 89.3&#xff0c;接近发达国家水平&#xff0c;这一突破的核心驱动力之一便是 AI 质检技术的规模化应用。长期以来&#xff0c;人工质检始终是制约制造企业提质增效…

作者头像 李华
网站建设 2026/4/17 6:22:51

AI核心知识54——大语言模型之Structured CoT(简洁且通俗易懂版)

结构化提示词 (Structured Prompting) 是将 提示工程 (Prompt Engineering) 从“玄学”变成“工程学”的关键一步。简单来说&#xff0c;结构化提示词就是把你的自然语言&#xff08;人话&#xff09;&#xff0c;按照一定的逻辑框架&#xff0c;组织成类似“代码”或“表单”的…

作者头像 李华
网站建设 2026/4/20 8:09:08

Spring Cloud

一、先搞懂&#xff1a;为什么需要 Spring Cloud&#xff1f;&#xff08;微服务痛点&#xff09;单体应用&#xff08;一个项目包含所有功能&#xff09;的问题&#xff1a;代码臃肿、开发协作难、升级风险高、并发瓶颈明显。微服务就是把单体应用拆成多个独立服务&#xff08…

作者头像 李华