JavaScript 代码片段

WBOY
发布: 2024-08-30 21:00:10
原创
245 人浏览过

Javascript Code Snippets

数据类型

原始数据类型

数字

雷雷

字符串

雷雷

布尔值

雷雷

未定义:

雷雷


雷雷

符号

雷雷

BigInt

雷雷

非数字 (NaN)
NaN 代表“Not-a-Number”,表示不是合法数字的值

雷雷

如何检查数据类型?

雷雷

班级

1) 类只能有一个构造函数

雷雷

遗产

雷雷

获取和设置

雷雷

立即调用函数表达式 (IIFE)

IIFE 是一个一旦定义就运行的函数

雷雷

高阶函数

高阶函数是将其他函数作为参数或返回函数作为结果的函数

雷雷

可变阴影

当局部变量与外部作用域中的变量同名时,就会发生变量遮蔽。
局部变量会覆盖或隐藏其自身作用域内的外部变量。
外部变量保持不变,可以在本地范围之外访问。

雷雷

在 JavaScript 中访问 HTML 元素

在 JavaScript 中访问 HTML 元素有多种方法:

按 ID 选择元素:

雷雷

按类名选择元素:

雷雷

按标记名选择元素:

雷雷

CSS 选择器:

雷雷

按值传递

雷雷

通过引用传递

雷雷

使用严格

它将 JavaScript 引擎切换到严格模式,捕获常见的编码错误并引发更多异常。

雷雷

扩展运算符

它允许在需要零个或多个参数或元素的地方扩展可迭代对象,例如数组或字符串

雷雷

实例化

运算符检查对象是否是特定类或构造函数的实例。

雷雷

筛选

此方法创建一个新数组,其中包含通过所提供函数实现的测试的所有元素。

雷雷

减少

此方法对数组的每个元素执行归约函数,从而产生单个输出值。

雷雷

休息

此参数语法允许函数接受不定数量的参数作为数组。

雷雷

声明类型

隐式全局变量
隐式全局变量是在分配值时在全局范围内自动创建的变量,而无需使用 var、let 或 const 等关键字显式声明。但如果处于严格模式
,则会抛出错误

雷雷

常量
它声明了一个不能重新赋值的常量。

雷雷


它声明了一个块作用域变量。
无法使用相同名称重新初始化

雷雷

var
它声明一个函数范围或全局范围的变量。它鼓励提升和重新分配。

雷雷

综合事件

合成事件:React 提供了一个围绕本机浏览器事件的 SyntheticEvent 包装器。该包装器规范了不同浏览器之间的事件属性和行为,确保无论浏览器如何,您的事件处理代码都以相同的方式工作。

雷雷

JavaScript 中的提升

提升是一种 JavaScript 机制,其中变量和函数声明在编译阶段被移动到其包含范围的顶部,从而允许它们在代码中声明之前使用。但是,仅提升声明,而不提升初始化。

雷雷

类型强制

它是将值从一种数据类型自动转换为另一种数据类型。强制转换有两种类型:隐式强制转换和显式强制转换。

隐性强制

例如

雷雷

显式强制

当我们使用内置函数手动将值从一种类型转换为另一种类型时,就会发生这种情况。

let num = 5; let str = String(num); // "5" let str2 = num.toString(); // "5" let str3 = `${num}`; // "5"
登录后复制

Truthy Values

Non-zero numbers (positive and negative)
Non-empty strings
Objects (including arrays and functions)
Symbol
BigInt values (other than 0n)

Falsy Values

0 (zero)
-0 (negative zero)
0n (BigInt zero)
"" (empty string)
null
undefined
NaN (Not-a-Number)

Props (Properties)

To pass data from a parent component to a child component. It is immutable (read-only) within the child component.

// Parent Component function Parent() { const data = "Hello from Parent!"; return ; } // Child Component function Child(props) { return 
{props.message}
; }
登录后复制

State

To manage data that can change over time within a component. It is mutable within the component.

// Function Component using useState import { useState } from 'react'; function Counter() { const [count, setCount] = useState(0); return ( 

Count: {count}

); }
登录后复制

Closure

A closure in JavaScript is a feature where an inner function has access to the outer (enclosing) function's variables and scope chain even after the outer function has finished executing.

function outerFunction(outerVariable) { return function innerFunction(innerVariable) { console.log('Outer Variable:', outerVariable); console.log('Inner Variable:', innerVariable); }; } const newFunction = outerFunction('outside'); newFunction('inside');
登录后复制

Currying

Currying is a technique of transforming a function that takes multiple arguments into a sequence of functions that each take a single argument.

function add(a) { return function(b) { return a + b; }; } const add5 = add(5); console.log(add5(3)); // Output: 8 console.log(add(2)(3)); // Output: 5
登录后复制

Generators

Generators are special functions that can be paused and resumed, allowing you to generate a sequence of values over time.

function* generateSequence() { yield 1; yield 2; yield 3; } const generator = generateSequence(); console.log(generator.next()); // { value: 1, done: false } console.log(generator.next()); // { value: 2, done: false } console.log(generator.next()); // { value: 3, done: false } console.log(generator.next()); // { value: undefined, done: true }
登录后复制

Stay Connected!
If you enjoyed this post, don’t forget to follow me on social media for more updates and insights:

Twitter:madhavganesan
Instagram:madhavganesan
LinkedIn:madhavganesan

以上是JavaScript 代码片段的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责声明 Sitemap
PHP中文网:公益在线PHP培训,帮助PHP学习者快速成长!