前端入门笔记 05 —— js基础

news2024/11/19 9:41:01

基于ES6

生成html文件,script标签引入js文件
简单语句直接用console面板

<!DOCTYPE html>
<html>
    <head>
        <title>js核心语法</title>
        <meta charset="UTF-8" />

    </head>
    <body>
        <script src = "./1.5js.js"></script>
    </body>

</html>
console.log("hello world");//在控制台输出

document.body.innerHTML= "Hello World";//html页面输出

数据类型

string:单双引号定义
number:浮点数
boolean: true/fals
typeof操作符
undefined 与 null
自动类型转换

  • =====

flasy: false/-/空字符串/null/undefined/NaN

number

console.log(1 === 1.0);
//true

string

//单引号or双引号,无char类型
//支持单引号内输出双引号,双引号内输出单引号
console.log("say" == 'say');
console.log("say 'yes'");
console.log('say "yes"');
console.log("say \"yes\"");
/*
say 'yes'
say "yes"
say "yes"
number string boolean
*/

//字符串相加会链接,类似C++的string
//字符串可以直接转换数字
console.log(3 * '2');
console.log(3 + '2');
console.log(1 + (2 + '3' + "not number"));

typeof

//type of
console.log(typeof 1, typeof(""), typeof false);
console.log(undefined, typeof undefined);
console.log(null, typeof null);
//没赋值返回undefined,可以用null强调这是个对象但还不存在

/*
number string boolean
undefined undefined
null object
*/

=== 和 ==

// 不建议使用== 会造成类型转换
//最好使用 ===和 !==
console.log(1 == 1, 1 == '1', 1 == true, 0 == false, '' == false, null == undefined);
console.log(1 === 1, 1 === '1', 1 === true, 0 === false, '' === false, null === undefined);

/*
true true true true true true   
true false false false false false
*/

falsy 值

//falsy值,输出falsy
if(false || 0 || '' || undefined || null || NaN)
{
    console.log("no");
}
else
{
    console.log("falsy");
}

变量定义

  1. let const, 不建议用var
  2. 变量名不能以数字开头
  3. 表达式返回值
  4. 动态类型:类型运行时可变
  5. let const是块级作用域
  6. 变量屏蔽与作用域
let a = 1 + 2;
a += 3;
let empty;
console.log(a, empty);

const b = 2;//const不可以修改变量

当你在{}内声明一个在{}外的同名变量的时候。{}内的块级作用域变量不与外部同名变量冲突(内部的同名覆盖了外部的)
当离开了块级作用域,同名变量内的值会变回外部的初始值

在这里插入图片描述

输出文件树
在这里插入图片描述

函数

//函数的参数可变
//函数写在尾部,在前方调用也是可以正常运行的

console.log(typeof(print_max_2));
console.log(print_max_2(0));
console.log(print_max_2(0,2,3));

function print_max_2(a,b)
{
    console.log("print max two", a, b);
    return a, b;
}

/*
function
print max two 0 undefined
undefined
print max two 0 2
2
*/

如果需要让函数不传入undefined变量,可以在开头处加入if判断a和b不为undefined(或者直接把undefined改成别的值)再继续运行函数后续内容

当然其实可以直接设置“缺省参数”

function (a = 0, b = 0){}
//类似于
function(a, b){
if(a == undefined)a = 0;
if(b == undefined)b = 0;
}

函数内对参数的修改不会改变其在外部的初始值,类似C语言的形式参数

可以把函数赋值给变量

const two_print = function print_max_2(a = 0,b = 0)
{
    console.log("print max two", a, b);
    return a, b;
}
two_print(1, 2);
  1. 需要注意,函数写在尾部,在前方调用也是可以正常运行的,不像C语言一样必须要声明在调用的前部。
  2. 但是如果把函数赋给变量,那么变量一定要在调用这个“函数变量部分”的前方
console.log(typeof(print_max_2));
print_max_2();
console.log(print_max_2(0));
console.log(print_max_2(0,2,3));

function print_max_2(a = 0,b = 0)
{
   console.log("print max two", a, b);
   return a, b;
}

const two_print = print_max_2;
two_print(1, 2);

箭头函数

效果和直接用变量一样

const test = (a,b) =>
{return a - b;}

btw, 如果return只是一个表达式,像上面一样,可以把大括号去掉,类似python的lambda

没有return

const test = (a,b) => a - b;

只有一个参数可以省略小括号

const test = a => a * a;

函数作为参数


function operate_add(a, b, func)
{
    return func(a, b);
}
function pow(a, b){
    const c = a;
    for(let i = 0; i < b; i++)
    {
        a *= c;
    }
    return a;
}
console.log(operate_add(2, 9, pow));
console.log(operate_add(2, 9, (a,b) => a / b));

//函数嵌套
const buildReapeatChar = char =>
{
    return num =>
    {
        let res = "";
        while(num--)
            res += char;
        return res;
    }
};
const repeat = buildReapeatChar("?");
console.log(repeat(10) + " question");
console.log(buildReapeatChar('.')(10) + " point");

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

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

相关文章

多线程(4)

文章目录1.单例模式2. 阻塞队列3. 定时器4.线程池前言 :   前面的一些文章&#xff0c;我们已经将有关多线的基础知识了解了&#xff0c; 下面我们来写一些关于多线程的代码案例&#xff0c;来强化对多线程的理解&#xff0c;另外通过这些案例补充一下其他方面的知识。 1.单例…

印度如何在云计算中抓住千载难逢的机会

云对印度的影响大流行和后大流行时期的虚拟和混合世界越来越依赖于云&#xff0c;并随之提高灵活性、敏捷性和创新性。在这场快速的数字化转型中&#xff0c;印度企业也纷纷加入云解决方案以促进业务增长。NASSCOM-EY的调查显示&#xff0c;78%的印度IT公司、53%的医疗保健和BF…

【Javascript】数字和字符串常用方法

数字常用方法&#xff1a; toFixed&#xff1a;保留小数位数&#xff0c;不够自动补0. 注意&#xff1a;返回值是字符串&#xff0c;不能和数字直接相加减&#xff0c;需要把字符串转化为数字&#xff1a;-0即可 取整&#xff1a; // round:四舍五入取整console.log(Math.roun…

SQL IN 操作符

IN 操作符 IN 操作符允许您在 WHERE 子句中规定多个值。 SQL IN 语法 SELECT column1, column2, ... FROM table_name WHERE column IN (value1, value2, ...); 参数说明&#xff1a; column1, column2, ...&#xff1a;要选择的字段名称&#xff0c;可以为多个字段。如果…

STM32——USART串口

文章目录一、通信接口二、串口通信三、硬件电路四、电平标准五、串口参数及时序六、STM32的USART外设简介七、USART框图八、USART基本结构九、数据帧十、起始位侦测和采样位置对齐十一、数据采样十二、波特率发生器十三、数据模式十四、串口发送电路设计关键代码USART_SendData…

基于Java+Swing+mysql眼镜店管理系统

基于JavaSwingmysql眼镜店管理系统一、系统介绍二、功能展示1.管理员登陆2.眼镜信息查询3.眼镜信息添加4.眼镜信息修改5.眼镜信息删除三、项目相关3.1 乱码问题3.2 如何将GBK编码系统修改为UTF-8编码的系统&#xff1f;四、其它1.其他系统实现2.获取源码一、系统介绍 该系统实…

Linux常用命令——find命令

在线Linux命令查询工具 find 在指定目录下查找文件 补充说明 find命令用来在指定目录下查找文件。任何位于参数之前的字符串都将被视为欲查找的目录名。如果使用该命令时&#xff0c;不设置任何参数&#xff0c;则find命令将在当前目录下查找子目录与文件。并且将查找到的子…

js设计模式(二)-创建型模式

创建型设计模式介绍 在软件工程中&#xff0c;创建型模式是处理对象创建的设计模式&#xff0c;试图根据实际情况使用合适的方式创建对象。基本的对象创建方式可能会导致设计上的问题&#xff0c;或增加设计的复杂度。创建型模式通过以某种方式控制对象的创建来解决问题。 创…

GCN-LSTM 预测出租车速度 英文 Taxi Speed Prediction Using GCN-LSTM

GCN-LSTM模型预测出租车速度 GCN&#xff1a;又称GNN&#xff0c;图神经网络 LSTM&#xff1a;长短时记忆网络 可做学习参考 Summary One of the most valuable findings in engineering is the determination of taxi speed. Since the GCN-LSTM program software can r…

BOM(一):window对象常见事件、定时器

BOM&#xff08;一&#xff09;BOM介绍window 对象的常见事件定时器location 对象navigator 对象history 对象BOM介绍 BOM是浏览器对象模型&#xff0c;它提供了独立于内容而与浏览器窗口进行交互的对象&#xff0c;其核心对象是 window。 BOM的构成 window 对象的常见事件 1.…

Python|每日一练|斐波那契数列|优化算法|迭代|动态计算|排列组合|时间复杂度:走楼梯

题目名称&#xff1a;走楼梯 时间限制&#xff1a;1000ms内存限制&#xff1a;256M 题目描述 现在有一截楼梯&#xff0c;根据你的腿长&#xff0c;你一次能走 1 级或 2 级楼梯&#xff0c;已知你要走 n 级楼梯才能走到你的目的楼层&#xff0c;请实现一个方法&#xff0c;计…

进程状态|操作系统|什么是pcb|什么是僵尸进程 |什么是孤儿进程 【超详细的图文解释】【Linux OS】

说在前面 今天给大家带来操作系统中进程状态的详解。 本篇博主将通过从进程状态的广泛概念&#xff0c;深入到Linux操作系统详细的一些进程状态。在解释进程状态的过程中&#xff0c;博主还会穿插一些操作系统一些重要概念&#xff01;本篇干货满满&#xff0c;请大家不要吝啬…

新建的普通用户无法使用sudo的问题

文章目录1.为什么新建用户无法使用sudo指令1. 查看sudoers的权限2. 切换成root用户解决问题1. 切换root用户2.进入 vim编辑器3. 配置成功1.为什么新建用户无法使用sudo指令 [lynVM-8-8-centos ~]$ sudo ls [sudo] password for lyn: lyn is not in the sudoers file. This i…

声学特征提取普及笔记

声学特征如何提取? 一、声学特征预处理 首先进行预处理,就是我们最后要提取一帧一帧的这种声学特征,这个语音信号经过预处理然后提取特征,那么特征也有用原始的傅里叶变换,STFT短时傅里叶变换得到这个语谱图特征,也有用FBANK就没有滤波器的输出,还有用MFCC。预处理包括…

SQL 通配符

通配符可用于替代字符串中的任何其他字符。 SQL 通配符 在 SQL 中&#xff0c;通配符与 SQL LIKE 操作符一起使用。 SQL 通配符用于搜索表中的数据。 在 SQL 中&#xff0c;可使用以下通配符&#xff1a; 通配符描述%替代 0 个或多个字符_替代一个字符[charlist]字符列中的…

Rabbitmq消息队列详解(三)——SpringBoot整合

SpringBoot整合 依赖&#xff1a; <!-- 加入rabbitmq --> <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-amqp</artifactId> </dependency>配置&#xff1a; spring:application:nam…

【C初阶】C初阶考试题

选择加编程一、选择题&#xff08;一&#xff09;递归&#xff08;二&#xff09;后置发生死循环&#xff08;三&#xff09;后置运算&#xff08;四&#xff09;操作符运算&#xff08;五&#xff09;全局变量与生命周期&#xff08;六&#xff09;操作符知识&#xff08;七&a…

前端对接微信公众号网页开发流程,前期配置

微信公众号网页开发&#xff0c;其实就是我们开发的h5网页需要放到微信浏览器环境中使用&#xff0c;但是需要对接公众号授权&#xff0c;授权之后可以获取到用户的个人信息&#xff0c;以及可以使用公众号提供的一些API,如&#xff1a;图片上传、图片预览、获取位置信息、微信…

【Java异常】Java异常监控重要手段 --异常链

目录标题前言一、异常链介绍1.1 异常链概述1.2 Java中如何使用异常链二、Throwable1.1 Throwable中哪些API提供存储cause的功能1.2 Throwable中如何获取cause三、项目实战演练示例1:未存储cause示例2:存储cause两层嵌套示例3:存储cause三层嵌套四、总结前言 “异常链”无论是在…

构造题(agc059_b)

https://atcoder.jp/contests/agc059/tasks/ B - Arrange Your Balls Editorial / Time Limit: 2 sec / Memory Limit: 1024 MB Score : 700700 points Problem Statement You have NN balls of colors C_1, C_2, \ldots, C_NC1​,C2​,…,CN​. Here, all colors are rep…