news 2026/8/4 14:58:31

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/8/4 7:24:51

AI 数字孪生工厂:西门子与中信特钢的实践,如何降本 11%?

一、行业痛点&#xff1a;特钢制造的降本困局钢铁行业作为重工业支柱&#xff0c;长期面临 "三高两低" 的发展瓶颈&#xff1a;高能耗、高排放、高成本与低效率、低附加值。中信特钢作为全球特钢领军企业&#xff0c;其生产流程涵盖冶炼、连铸、轧制等十余个核心环节…

作者头像 李华
网站建设 2026/8/3 14:18:02

Spring IoC的实现机制是什么?

大家好&#xff0c;我是锋哥。今天分享关于【Spring IoC的实现机制是什么&#xff1f;】面试题。希望对大家有帮助&#xff1b; Spring IoC的实现机制是什么&#xff1f; 超硬核AI学习资料&#xff0c;现在永久免费了&#xff01; Spring IoC&#xff08;Inversion of Contro…

作者头像 李华
网站建设 2026/8/3 15:10:00

耐用折叠屏手机推荐:三星Galaxy Z TriFold如何破解“折痕与耐用”难题?

当折叠屏手机从概念产品走向大众市场&#xff0c;消费者最关心的问题之一就是耐用性。毕竟&#xff0c;折叠屏设备多出了复杂的机械结构和柔性屏幕&#xff0c;这些部件在日常使用中面临更多挑战。那么&#xff0c;如今的折叠屏手机在耐用性方面达到了什么水平&#xff1f;三星…

作者头像 李华
网站建设 2026/8/3 15:44:52

前端技术风险防控:以防为主,防控结合

前端技术风险防控&#xff1a;以防为主&#xff0c;防控结合 1. 核心理念&#xff1a;防与控的辩证关系 防&#xff1a;在风险发生前&#xff0c;通过技术手段、流程规范、架构设计等主动预防&#xff0c;从根源上减少风险发生的概率。 控&#xff1a;当风险不可避免地发生时&a…

作者头像 李华
网站建设 2026/8/3 20:24:19

入门大模型必知的100个基础问题(附简明答案)

写在前面 这篇内容将图片中的要点按顺序整理为「100 个基础问题 简明答案」。你可以把它当作查阅清单&#xff1a;从概念、结构、训练、评估到优化与应用&#xff0c;快速过一遍大模型&#xff08;LLM&#xff09;最常见的知识点。 100个基础问题什么是大模型&#xff1f; 答案…

作者头像 李华