2、函数、对象、对象方法函数的使用、扩展运算符、箭头函数、symbol

一、函数

1、数字类型的用法

带Number的先判断是不是数字类型

Number.isNaN() 判断是否 是非数值

  • 非数值返回 true
  • 数值类型返回 false
console.log(Number.isNaN(NaN)); // true
console.log(Number.isNaN(false)); // false
console.log(Number.isNaN(null)); // false
console.log(Number.isNaN(undefined)); // false
console.log(Number.isNaN(2)); // false

Number.inFinite() 判断是非无穷 (有限的)

  • 有限的 true 无穷的 false
console.log(Number.isFinite(2.1231)); // true
console.log(Number.isFinite('2.1231')); //  false
console.log(Number.isFinite(Math.PI)); // true **
console.log(Number.isFinite(-Infinity)); // false
console.log(Number.isFinite(3.000000000)); // true
console.log(Number.isFinite(null)); // false
console.log(Number.isFinite(true)); // false

Number.parsetInt() 返回整数

Number.parseInt == parseInt

console.log(Number.parseInt('12.12312')); // 12
console.log(Number.parseInt(12.12312)); // 12
console.log(Number.parseInt(null)); //   NaN
console.log(Number.parseInt(undefined)); //  NaN
console.log(Number.parseInt('1.23')); // 1

Number.isInteger() 用来判断是否是整数

console.log(Number.isInteger(1)); // true
console.log(Number.isInteger('1')); // false
console.log(Number.isInteger(1.2222)); // false
console.log(Number.isInteger(null)); // false
console.log(Number.isInteger(undefined)); // false
console.log(Number.isInteger(1.0000000000)); // true

Math.trunc() 用于去除一个数的小数部分,返回整数部分

会隐式转换

console.log(Math.trunc(1.63214)); // 1
console.log(Math.trunc('1.23214')); // 1
console.log(Math.trunc(null)); // 0
console.log(Math.trunc(undefined)); // NaN
console.log(Math.trunc(1.00000)); // 1

Math.sign()用来判断一个数到底是正数、负数、还是零

  • 正数返回1 负数返回-1 零返回0 非数值返回NaN
console.log(Math.sign(1.12321)); // 1
console.log(Math.sign(-1.12321)); // -1
console.log(Math.sign(0)); //0 
console.log(Math.sign(null)); // 0
console.log(Math.sign(true)); // 1
console.log(Math.sign(undefined)); // NaN

二、对象

1、对象的使用(3条)

let s ="say"
let h = 'hello'
let name = 'zs'
let obj = {name,age: 18,say() {//可以省略functionconsole.log("说话了");},[s + h](){//表达式可以当作属性console.log("sayHello");}
}
console.log(obj);//{name: 'zs', age: 18, say: ƒ}
obj.sayhello()//sayHello
  • 删除对象中的属性 delete
    • delete obj.age

2、对象的方法(6条)

Object.is() 比较两个值是否严格相等,或者是全等

console.log(Object.is(10, 10)); // true
console.log(Object.is(10, '10')); //false
console.log(Object.is(NaN, NaN)); // true

Object.assign(目标对象,源对象…) **

  • 函数作用:将源对象的属性赋值到目标对象上
  • 目标对象会改变 源对象不会改变
var obj1 = { a: 1, b: 2,}
var obj2 = { c: 3, d: 4 }
var obj3 = { a: 6, e: 5 }
let obj4 = Object.assign(obj1, obj2, obj3) //跟obj1一样
console.log(obj1);//{a:6 b:2 c:3 d:4  e:5}  目标函数会改变
console.log(obj2);//{c:3 d:4} 源函数不会改变
  • 对象深拷贝
let obj5 = Object.assign({}, obj3)
obj3.a = 8
console.log(obj3);//{a:8 e:5}
console.log(obj5);//a:6 e:5

Object.getPrototypeOf()

  • 函数作用:获取一个对象的prototype属性
function Person() { }//构造函数
Person.prototype.name = 'zs'//原型
Person.prototype.age = 18//原型
var p1 = new Person()//实例化
console.log(Object.getPrototypeOf(p1));//{name: 'zs', age: 18}

Object.setPrototypeOf()

  • 函数作用:设置一个对象的prototype属性
  • 原型的指向会发生改变
Object.setPrototypeOf(p1, {color: 'red'
})
console.log(Object.getPrototypeOf(p1));//{color: 'red'}

Object.keys()

  • 函数作用:获取对象中的属性名、
var obj3 = { a: 6, e: 5}
console.log(Object.keys(obj3));//['a', 'e']

Object.values()

  • 函数作用:获取对象中的属性值
var obj3 = { a: 6, e: 5}
console.log(Object.values(obj3));//[6, 5]

三、函数的使用

1、初始化

2、||

  • 相当于 if ()
  • 如果运算符 || 左侧为true,直接返回左侧的值,否则返回右侧的值
    == false 0 undefined null返回右侧==
function fn(age) {var age = age || 20console.log(age)
}
fn(false) // 20  
fn(null) //  20  
fn(true) // true 
fn(undefined) // 20  
fn(0) // 20 
fn(1) // 1 

3、??

除了null 和undefined其他传过来的都是直接执行

function fn(age) {var age = age ?? 20console.log(age);
}
fn(false) // false
fn(null) // 20
fn(true) //  true
fn(undefined) // 20
fn(0) // 0
fn(1) //  1

例子:

function fn1(name) {// var name = 'zs'  形参相当于var了一个  不能重复let name = 'ls'console.log(name);
}
fn1('zs')//程序会报错

4、扩展运算符 …

(1)、数组(6条)

  • 遍历数组
var arr = [1, 2, 3, 4]
console.log(...arr);//1 2 3 4
console.log([...arr]);//[1 2 3 4]
  • 当作数组中元素
var arr = [1, 2, 3, 4]
var arr1 = [0, ...arr]
console.log(arr1);// [0, 1, 2, 3, 4]
  • 数组深拷贝
var arr = [1, 2, 3, 4]
var arr_2 = [...arr]
arr.unshift(5)//数组开头添加元素5
console.log(arr);//[5, 1, 2, 3, 4]
console.log(arr_2);//[1, 2, 3, 4]
  • 函数的调用
var arr_1 = [0, 1, 2, 3, 4]
function fn(a, b, c) {console.log(a, b, c);
}
fn(arr_1[0], arr_1[1])//0 1 undefined
fn(...arr_1)//0 1 2
  • 与解构赋值连用
var arr = [1, 2, 3, 4]
var [x, y, z] = [...arr]
console.log(x, y, z);//1 2 3
  • 将伪数组转为真正数组
var str = '是web31'
console.log(Array.from(str));//['是', 'w', 'e', 'b', '3', '1']
console.log([...str]);//['是', 'w', 'e', 'b', '3', '1']

(2)、对象(3条)

  • 遍历对象
  • 要加 { }
var obj = {name: "zs",age: 18
}
console.log({ ...obj });//{name: 'zs', age: 18}
  • 对象深拷贝
var obj = {name: "zs",age: 18
}
var obj_1 = { ...obj }
delete obj.age
console.log(obj);//{name: 'zs'}
console.log(obj_1);//{name: 'zs', age: 18}
  • 合并
var a = { a: 1, b: 3 }
var b = { b: 2, ...a, }
console.log(a); //{a: 1, b: 3}  会覆盖前面的
console.log(b);//{b: 3, a: 1}

四、箭头函数(重点)

1、箭头函数格式

  • 去掉function ()后面写 =>
var fn_1 = (name) => {console.log(name)//ls
}
fn_1("ls")

补充:

  • 定时器函数打印出来是数字类型
let setInterval1 = setInterval(function () {
}, 1000)
console.log(setInterval1);//1
  • map也可以写成箭头函数
let arr = [1, 2, 3]
arr.map(function (item, index) {
})
arr.map((item, index) => {
})

2、箭头函数的特点(7条)

  • 箭头函数只有一个参数可以省略小括号

var fn = x => {console.log(x)//10
}
fn(10)
  • 箭头函数返回值只有一条语句可以省略return和 {}

// var fn_1 = (y) =>{ return y }
var fn_1 = y => y
console.log(fn_1(20))//20
  • 箭头函数没有内置对象 arguments

var fn_2 = function () {console.log(arguments);//可以输出
}
fn_2()
var fn_2 = () => {console.log(arguments) //会报错 arguments is not defined
}
fn_2()
  • 箭头函数不能是构造函数

//正常函数
var Person = function () { }
console.log(Person.prototype);//{}
var p1 = new Person()
console.log(p1);//Person {}
//箭头函数
var Person = () => { }
console.log(Person.prototype)//undefined
var p1 = new Person()
console.log(p1); // 会报错 Person is not a constructor
  • 箭头函数的this不能发生改变,call() 和 apply() 能调用箭头函数

//正常的
var obj = { age: 18 }
var fn_3 = function () { console.log(this); }
fn_3() //window
fn_3.call(obj) //{age: 18}
fn_3.apply(obj) //{age: 18}
//箭头函数
var fn_3 = () => { console.log(this); }
fn_3()//window
fn_3.call()//window
fn_3.call(obj)//报错
fn_3.apply(obj)//报错
  • 箭头函数没有原型对象 (prototype原型)

var Person = () => { }
console.log(Person.prototype)//undefined
  • 箭头函数的this指向父作用域 (定义他的地方)

var birth = 2000
var obj = {birth: 1990,getAge: () => { //因为是箭头函数  所以指向父作用域  window 2000var fn = function () {return new Date().getFullYear() - this.birth;// 2024 - 2000};return fn();}
};
console.log(obj.getAge());//24

五、symbol(唯一值)

  • symbol的类型
let sy1 = Symbol()
console.log(typeof sy1)//symbol   symbol类型的
  • symbol声明的变量是独一无二的
let sy2 = Symbol('a')
let sy3 = Symbol('a')
console.log(sy2 == sy3)//false  两个不一样
  • ==初衷:==为了解决对象中属性名冲突的问题
let a = Symbol("a")
let obj = {a:1, b:2, [a]:3}
console.log(obj)// {a: 1, b: 2, Symbol(a): 3}
console.log(obj.a)//1
console.log(obj[a])//3
  • for in 和 keys遍历 不能获取symbol的属性
for (let key in obj) {console.log(key) //只能获取a和b
}
console.log(Object.keys(obj));//['a', 'b'] 不能获取symbol
  • Object.getOwnPropertySymbols函数 只能获取symbol类型
console.log(Object.getOwnPropertySymbols(obj))//[Symbol(a)]
  • Reflect.ownKeys函数 获取所有属性名 (重点)
console.log(Reflect.ownKeys(obj));//['a', 'b', Symbol(a)]
  • Symbol.for() 函数(了解)
  • 函数作用:根据参数名,去全局环境中搜索是否有以该symbol.for()参数为名的symbol值,有就返回他,没有就以该参数名来创建一个新的symbol值
let a_1 = Symbol.for('b')
let a_2 = Symbol.for('b')
console.log(a_1 == a_2);//true
  • Symbol.keyFor函数 (了解)
  • 函数作用:返回一个以被登记在全局环境中的symbol.for()值的key,没有就返回undefined。
let a_1 = Symbol.for('b')
let a = Symbol('a')
console.log(Symbol.keyFor(a_1));//b
console.log(Symbol.keyFor(a));//undefined

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

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

相关文章

for、while、do...while循环的使用

本篇文章只记录for、while、do...while循环的使用&#xff0c;由于java循环较为简单&#xff0c;所以直接上代码。 1、for循环 需求&#xff1a;循环遍历求和 1-100。 public class Demo {public static void main(String[] args) {int sum 0;for (int i 1; i < 100; i…

Android手机定位

目录 一、定位功能准备 1.申请权限 2.开启定位所需功能 &#xff08;1&#xff09;定位 &#xff08;2&#xff09;WiFi &#xff08;3&#xff09;移动数据连接&#xff08;基站&#xff09; 二、获取定位信息 1.定位条件器 Criteria 2.定位管理器 LocationManager …

YOLOv5目标检测学习(4):YOLOV5源码的文件结构解析

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言①py、cpp、java后缀的文件②md、txt、yml后缀的文件③yaml后缀的文件 一、.github文件夹1.1 workflows文件夹&#xff1a;该文件夹通常包含GitHub Actions 的工…

Python基础语法:基本数据类型(列表)

现实世界中总是存在一组一组的事物。"组"的概念作为基本数据类型的一种&#xff0c;它也是来源于我们去解决现实生活中的一些问题而产生的。它需要有“组”这样的一个数据类型来丰富我们的基本数据类型。 那么在Python中如何来表示“组”的概念呢&#xff1f; 在Py…

RHEL9 DNF/YUM仓库管理软件包

DNF/YUM仓库管理软件包 一个基于RPM包的软件包管理器能够从指定的服务器自动下载RPM包并且安装&#xff0c;自动处理依赖性关系&#xff0c;并且一次性安装所有依赖的软件包C/S模式 Server服务端提供RPM软件包与数据库文件repodataClient客户端使用dnf仓库 常用组合 组合参…

解决Klipper下位机ID获取失败问题

使用硬件&#xff1a; 上位机&#xff1a;必趣派&#xff0c;版本CB1_Debian11_Klipper_kernel5.16_20230303 下位机&#xff1a;八爪鱼STM32F407 问题&#xff1a;上位机获取下位机ID失败。 解决&#xff1a;咨询DIY群友&#xff0c;也对这个问题不太了解。我调试过程中&…

Python 导入Excel三维坐标数据 生成三维曲面地形图(面) 4-1、线条平滑曲面(原始图形)

环境和包: 环境 python:python-3.12.0-amd64包: matplotlib 3.8.2 pandas 2.1.4 openpyxl 3.1.2 scipy 1.12.0 代码: import pandas as pd import matplotlib.pyplot as plt from mpl_toolkits.mplot3d import Axes3D from scipy.interpolate import griddata fro…

SPI学习笔记

总线介绍 SPI&#xff0c;是英语Serial Peripheral interface的缩写&#xff0c;顾名思义就是串行外设接口。SPI协议主要作为主控芯片去配置外围芯片的接口协议。SPI接口主要应用在 EEPROM&#xff0c;FLASH&#xff0c;实时时钟&#xff0c;AD转换器&#xff0c;还有数字信号…

【vivado】 clock wizard 时钟IP

一、前言 MMCM和PLL是在FPGA设计中不可避免需要使用到的时钟资源&#xff0c;对于其功能及使用方法的理解是正确进行FPGA设计的前提。 二、Xilinx 时钟 IP配置 vivado中使用时钟向导(Clocking Wizard)配置时钟IP核&#xff0c;其框图如下&#xff1a; clk_in 输入时钟&#…

基于YOLOv8/YOLOv7/YOLOv6/YOLOv5的的商品标签识别系统(Python+PySide6界面+训练代码)

摘要&#xff1a;开发商品标签识别系统在提升零售业运营效率和顾客购物体验中发挥着关键作用。本篇博客详细阐述了如何应用深度学习技术构建此类系统&#xff0c;并提供了完整的代码实现。该系统基于高效的YOLOv8算法&#xff0c;并与YOLOv7、YOLOv6、YOLOv5进行了性能对比&…

*Javaweb -- MyBatis*

一:介绍: 1.MyBatis是一个优秀的 ①持久层 ②框架,用于简化JDBC的开发! ①:JAVAEE有三层的结构:表现层, 业务层, 持久层. 表现层代表的是页面的展示,业务层则指的是对于相关逻辑的处理, 而持久层, 指的则是对于数据进行持久化,保存在数据库当中. 持久层具体的来说就是负责…

数字孪生+工业互联网标识解析,打造智能工厂新标杆!

当前&#xff0c;工业4.0浪潮愈发澎湃&#xff0c;加快数字化、网络化、智能化发展成为了制造业转型升级的必然要求。 51WORLD基于数字孪生技术与工业互联网标识解析体系&#xff0c;打造了一个集协同化供应、个性化定制、智能化生产于一体的全连接产线孪生平台&#xff08;以…

antv L7结合高德地图使用dome1

antv L7结合高德地图使用 一、设置底图二 、添加antv L7 中要使用的dome1. 安装L7 依赖2. 使用的dome 、以下使用的是浮动功能3. 运行后显示 自定义样式修改1. 设置整个中国地图浮动起来 自定义标注点1. 静态标注点2. 动态标注点&#xff08;点位置需要自己改&#xff09;3. 完…

Python笔记:函数

Python函数定义规则&#xff1a; 函数代码块以def关键词开头&#xff0c;后接函数标识符名称和圆括号()。任何传入参数和自变量必须放在圆括号中间&#xff0c;圆括号之间可以用于定义参数。return [表达式] 结束函数&#xff0c;选择性地返回一个值给调用方&#xff0c;不带表…

Windows系统中安装docker及镜像加速的配置

文章目录 一.安装wsl二.下载docker desktop三.更换Docker镜像引用出处 一.安装wsl 在安装wsl之前&#xff0c;先在Windows中配置WSL环境,步骤很简单&#xff0c;按照以下文章进行 Windows10/11配置WSL(Ubuntu)环境 以管理员身份打开Windows PowerShell&#xff0c;执行以下命…

模型驱动架构MDA

MDE 模型驱动工程&#xff08;MDE, Model-Driven Engineering&#xff09;是软件工程的一个分支&#xff0c;它将模型与建模拓展到软件开发的所有方面&#xff0c;形成一个多维建模空间&#xff0c;从而将工程活动建立在这些模型的映射和转换之上。[1] MDE的基本原则是将模型视…

2.Windows平台Python的下载、安装和配置环境变量——跟老吕学Python编程

2.Windows平台Python的下载、安装和配置环境变量——跟老吕学Python编程 一、下载Windows版Python1.Python官网2.Windows版Python下载网址 二、在Windows安装Python1.全自动安装Python&#xff08;不推荐&#xff09;1.1 启动安装1.2 安装进度1.3 安装完成1.4 查看版本 2.自定义…

Python sort从大到小排序面试题

在Python中&#xff0c;你可以使用内置的sorted()函数或者列表的sort()方法来对列表中的元素进行从大到小的排序。 使用sorted()函数&#xff1a; numbers [3, 1, 4, 1, 5, 9, 2, 6, 5, 3, 5] sorted_numbers sorted(numbers, reverseTrue) # 设置reverseTrue实现从大到小排…

基于单片机的智能水位监控识别系统设计

摘 要:本文通过描述以STC12C5A60S2单片机作为MCU的智能水位监控系统的设计进行分析,对系统中的各电路原理进行简单概述,将系统通过液晶进行人机交互,并可通过按键对水位上下限进行调整,采用超声波检测模块对水位检测并具有水位情况预警功能。系统经过智能化的排水和注水操…

【GO】HTTP标准库1 - http协议基础知识

目录 一 http协议 1 http协议 2 http request 3 请求方法 4 URL 5 协议版本 6 请求头 7 Content-type 9 POST与GET区别 10 HTTP Response 11 常见的状态与话术 12 HTTP 响应头 13 完整的HTTP响应 14 HTTPS 一 http协议 1 http协议 HTTP&#xff08;HyperText Tra…