前端基础(JavaScript语法)

news2025/1/18 16:54:29

前言:今天学习JavaScript的基本语法,包括变量、函数、对象、数组。

目录

JavaScript

变量

函数

对象

数组


JavaScript

变量

定义变量

判断语句

判断等于:===

判断不等于:!=

if else语句

if(va==vb){
    console.log("值相等")
}
else{
    console.log("不相等")
}

for循环遍历

let a = {name:"MRJJ_9",age:"35"}
for (i in a) {
    console.log(a[i]);
}

函数

不需要返回值

function add(x,y){
    z=x+y
    console.log(`${z}`);
    return z;
}

const test=function(){
    console.log("test");
}

调用 test()

函数的重新命名

const newtest=test

箭头函数

const test=()=>{
    console.log("learning");
}

const chu=(x,y)=>x/y

等同于:const chu=(x,y)=>{return x/y}

function add(x,y) {
    console.log(arguments)
    let arrowFunc=(arrowFunc)=>{
        let res ="hello,"+arguments[0];
        console.log("箭头函数中的输出:"res);
    }
    arrowFunc('mrjj');
    return x+y;
}

undefined 未定义

NaN:Not a number

arguments

对象

对象引用前面要加上this.

let person = {
    "name":"MRJJ_9",
    "age":35,
sayHello:function(){
    console.log("hello")
},
sayBye(world){console.log(this.name+"再见"+world)}
}

创建一个新的对象、列表、集合、字典

let a=new Object();

let b=new Array();

let c=new Set(); 

let d=new Map();

对象取值 

let wy="name";

person[wy]

person["MRJJ_9"]

数值删除关键字 delete

.toString

遍历

for (i in person){

console.log(i,person[i]);

}

序列化操作,将对象转换为字符串,给每个键加上双引号,将其中的函数去掉

JSON.stringify(person)

JSON.parse()

数组

创建数据

let arr=['name','MRJJ_9'];

随时可以扩容和删除

在后面添加新的值

arr.push();

数组长度

arr.length;

删除,删除最后一个值

arr.pop();

删除前面的一个值

arr.shift();

往前面插入数据

arr.unshift();

切片取值,只取值不改值

arr.slice(start,end) (左闭右开)

删除值

arr.splice(start) 从start这个下标开始删值,后面的都删掉

arr.splice(start,num)从start这个下标开始删值,删的数量是num

arr.splice(start,num,param1,param2,...,paramN),删除值后,再在此位置上添加新的值

在指定位置添加新的值

arr.splice(start,num,param1,param2,...,paramN)

num=0,则在此位置上不删除,添加值

数组清空

arr=[];

arr.length=0;(如果定义了const常量,arr.length=0)

浅拷贝和深拷贝,具体可见python进阶赋值、深浅拷贝部分:

Python进阶(一)_MRJJ_9的博客-CSDN博客

浅拷贝:拷贝的是地址

深拷贝:拷贝的是对象的值

深拷贝的方法

遍历方法:

let arr_new=[];
for(j=0;j<arr.length;j++){
    arr_new[j]=arr[j];
}

用concat方法:new_arr=[].concat(arr)

用...将数组里的值都取出来,再形成新的数字 :new_arr=[...arr]

解构赋值

arr=[1, 2, 3, 4, 5]

let [a,b,c]=arr

则a=1,b=2,c=3,后面的值没有变量接受,不需要了

如果中括号里的值数量大于数组的长度,则后面的值undefined

定义的特殊语法,如果键和值的名一样,只需写键即可。

let mrjj="test";
let x={mrjj};
{mrjj: 'test'}

迭代器方法

arr.forEach((value) => {console.log(value)});

arr.forEach(function(value){console.log(value)});

for (v in arr){
    console.log(v);
}

数组值的更改

arr.forEach((value,index,a)=>{a[index]=value+"MRJJ"}); (但是原数组值改了)

map方法

new_arr = arr.map((value)=>{return value+="MRJJ_9"})(原数组的值未改)

简写方法:new_arr = arr.map(value=>value+="MRJJ_9")

值的过滤 filter

arr.filter((value)=>{return value<3})

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/896117.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Harmony OS教程学习笔记

基础知识 1.如何修改程序启动的第一个页面&#xff1f; 不想使用创建的默认的页面&#xff0c;这时需要修改启动页面&#xff0c;修改的地方在EntryAbility文件中的onWindowStageCreate方法中。 onWindowStageCreate(windowStage: window.WindowStage) {// Main window is cr…

解决无法访问 Github 问题

GitHub作为程序员访问最频繁的网站&#xff0c;程序员们经常需要访问 Github找开源项目、学习新框架、管理自己的个人开源项目等等。 github加速器 因为GitHub属于国外的网站&#xff0c;直接访问的话&#xff0c;速度非常慢&#xff0c;甚至访问不了&#xff0c; 今天给大家…

centos下使用jemalloc解决Mysql内存泄漏问题

参考&#xff1a; MySQL bug&#xff1a;https://bugs.mysql.com/bug.php?id83047&tdsourcetags_pcqq_aiomsg https://github.com/jemalloc/jemalloc/blob/dev/INSTALL.md &#xff08;1&#xff09;ptmalloc 是glibc的内存分配管理 &#xff08;2&#xff09;tcmalloc…

如何批量修改图片名为不同名称

如何批量修改图片名为不同名称&#xff1f;当今社会&#xff0c;因为人们都养成了随手拍照的习惯&#xff0c;所以拥有上千上万张照片的相册已经司空见惯不足为奇。然而&#xff0c;我们在保存这些照片时往往都会碰到一个大难题——电脑中的图片名称千奇百怪&#xff0c;让整个…

打开软件提示mfc100u.dll缺失是什么意思?要怎么处理?

当你打开某个软件或者运行游戏&#xff0c;系统提示mfc100u.dll丢失&#xff0c;此时这个软件或者游戏根本无法运行。其实&#xff0c;mfc100u.dll是动态库文件&#xff0c;它是VS2010编译的软件所产生的&#xff0c;如果电脑运行程序时提示缺少mfc100u.dll文件&#xff0c;程序…

由“美”出发 听艺术家林曦关于美育与智慧的探讨

不久前&#xff0c;林曦老师与我们的老朋友「十点读书」进行了一次线上直播&#xff0c;有关林曦老师十余年的书法教学&#xff0c;和传统美育的心得&#xff0c;以及因此诞生的新书《无用之美》。      这一次的直播&#xff0c;由“美”的主题出发&#xff0c;延伸出美育…

微服务参数透传实现

说明&#xff1a;在微服务架构中&#xff0c;用户身份经网关验证后&#xff0c;我们可以将用户信息&#xff0c;如ID加入到请求头上。后面的微服务中&#xff0c;可以设置一个拦截器&#xff0c;拦截请求&#xff0c;获取请求头上的用户ID&#xff0c;加入到ThreadLocal中。 最…

Spring【学习记录一】

Spring内容解释 早期的Spring仅指代Spring Framework&#xff0c;后来基于Spring Framework孵化出大量的项目&#xff0c;Spring的含义变成了指代Spring家族 Spring Framework是Spring家族所有成员的基础&#xff0c;想要学透Spring&#xff0c;就必须要掌握Spring Framework…

电脑提示concrt140.dll丢失或找不到怎么恢复

现在系统在安装的时候为了简化包体会将一些组件给删除了&#xff0c;这样会造成在运行某些程序的时候&#xff0c;出现组件丢失的提示。例如concrt140.dll丢失&#xff0c;如果不及时处理&#xff0c;会导致系统中不少程序无法正常使用&#xff0c;那么要如何处理这个问题呢&am…

SpringBoot案例-员工管理-删除员工

查看页面原型&#xff0c;明确需求 页面原型 有批量删除和删除单个数据 需求 查看接口文档 接口文档的链接如下&#xff1a; 【腾讯文档】SpringBoot案例所需文档 https://docs.qq.com/doc/DUkRiTWVaUmFVck9N 思路分析 删除单个数据&#xff0c;将要删除的员工信息的id传…

消息中间件主要作用

首先我们想一下&#xff0c;两个公司之间如果有互相调用接口的业务需求&#xff0c;如果没有引入中间件技术&#xff0c;是怎么实现的呢&#xff1f; 用户发起请求给系统A&#xff0c;系统A接到请求直接调用系统B&#xff0c;系统B返回结果后&#xff0c;系统A才能返回结果给用…

YOLOv5、YOLOv8改进:S2注意力机制

目录 1.简介 2.YOLOv5改进 2.1增加以下S2-MLPv2.yaml文件 2.2common.py配置 2.3yolo.py配置 1.简介 S2-MLPv2注意力机制 最近&#xff0c;出现了基于 MLP 的视觉主干。与 CNN 和视觉Transformer相比&#xff0c;基于 MLP 的视觉架构具有较少的归纳偏差&#xff0c;在图像识…

线代强化第四章

下面正式开始公式的证明&#xff1a; B改变了矩阵的秩&#xff0c;所以他是不满秩的。 就是说一个矩阵如果左边乘上一个列满秩的&#xff0c;它的秩不会改变 一个矩阵如果右边乘上一个行满秩的&#xff0c;它的秩不会改变 PROVE: 等于主对角线或副对角线上分块阵的秩的和 当两…

Three.js 实现模型材质局部辉光效果和解决辉光影响场景背景图显示的问题

1.Three.js 实现模型材质局部辉光效果 2.解决辉光效果影响场景背景图显示的问题 相关API的使用&#xff1a; 1. EffectComposer&#xff08;渲染后处理的通用框架&#xff0c;用于将多个渲染通道&#xff08;pass&#xff09;组合在一起创建特定的视觉效果&#xff09; 2. …

【100天精通python】Day36:GUI界面编程_Tkinter高级功能操作和示例

目录 专栏导读 一、GUI 高级功能 1 自定义主题和样式 2 实现拖放功能 3 多线程和异步编程 二、实战项目 1. 待办事项应用 2. 图像查看器 3. 文本编辑器 4 添加动画和过渡效果 5 多界面和多线程示例 专栏导读 专栏订阅地址&#xff1a;https://blog.csdn.net/qq_358…

前端-初始化Vue3+TypeScript

如果使用如下命令初始化项目&#xff0c;项目很干净&#xff0c;很适合了解项目的各个结构。 npm init vitelatest如果使用如下命令初始化项目&#xff0c;是可以选择你需要的组件 npm init vuelatest

Docker 容器数据卷

Docker挂载主机目录访问如果出现cannot open directory .: Permission denied 解决办法&#xff1a;在挂载目录后多加一个--privilegedtrue参数即可 如果是CentOS7安全模块会比之前系统版本加强&#xff0c;不安全的会先禁止&#xff0c;所以目录挂载的情况被默认为不安全的行…

你家的wifi安全么?

在移动互联网已经相当普及的今天&#xff0c;家用Wifi已经成为居家必备设备了&#xff0c;但你有没有考虑过这样一个问题&#xff0c;“我家的Wifi安全么&#xff0c;有没有可能被别人蹭网&#xff0c;或者被黑客登录进来&#xff0c;窃取数据&#xff1f;”下面就结合目前主流…

Bryntum Scheduler Pro 5.5.1 Crack

BRYNTUM 调度程序专业版,专业的日程安排小部件 Bryntum Scheduler Pro 5.5.1 一个专业有大脑的调度UI组件。Scheduler Pro 可帮助您安排任务&#xff0c;同时考虑资源和任务的可用性。 连接您的任务 让 Scheduler Pro 处理剩下的事情。它将根据您定义的链接安排您的任务并遵守任…

3D echarts在vue中的使用

注意&#xff1a;高度问题要如此设置即可解决 参考1 参考2