JavaScript篇.day09-数据类型,表达式,运算符,作用域,语句,严格模式

news2024/10/4 9:23:18

目录

1.数据类型

(1)原始数据类型

(2)隐式转换

(3)逻辑语句中的类型转换

(4)数据类型检测

2.表达式

3.运算符

(1)分类

(2)其他

4.作用域

5.语句

6.严格模式


1.数据类型

(1)原始数据类型

number, string, boolean, null, undefined, object

object对象包含: Array, Function, Date...

      function fun() {}
      console.log(typeof fun) //function
      console.log(typeof []) //object
      console.log(typeof new Date()) //object
      console.log(typeof null) //object
      console.log(typeof undefined) //undefined

(2)隐式转换

  • -,*,/

  • 非number类型运算时, 先将非number转换为number类型

  • e.g: null->0 undefined -> NaN ['5']->'5'->5 字母->NaN

  • + 运算规则 (规则1-3,优先级从高到低)

  • 规则1: 当一侧为String,字符串拼接

  • 规则2: 当一侧为Number类型, 一侧为原始类型, 将原始转为Number类型

  • 规则3: 当一侧为Number类型, 一侧为引用类型, 均转为字符串后拼接

      console.log('qw' + ['2']) // qw2 (规则1)
      console.log(7-'a');  // NaN
      console.log(10 + '23') // 1023 (规则2)
      console.log(10 + null) // 10   (规则3)
      console.log(10 / 0) // Infinity  相当于报错, 0不能作为除数

(3)逻辑语句中的类型转换

  • 只有单个变量, 转换为boolean值

  • null,undefined,'',NaN,0,false的值为false, 其他都是true,e.g:{},[]

  • 使用==比较规则

  • 规则1: NaN 和其他类型始终返回false, 包括自己

  • 规则2: Boolean 和其他类型比较, Boolean先转换为Number类型 true->1 false->0

  • 规则3: String和Number比较, 先将String转换为Number类型 ''->0

  • 规则4: null==undefined为true, null和undefined与其他任何比较均为false

  • 规则5: 原始类型和引用类型作比较时, 引用类型按照ToPrimitive规则转换为原始类型

      console.log(NaN == NaN) //false (规则1)
      console.log(true == 1) // true  (规则2)
      console.log('3' == 3) // true    (规则3)
      console.log(null == undefined) //true  (规则4)
      console.log('1,2' == ['1,2']) // true  ['1,2']->'1,2'  (规则5)
      console.log('a'-'b' == 'b' - 'a');  //false
      console.log('a'-'b');  //NaN
      console.log('b'-'a');  //NaN
      console.log(1111111111111);
      // 引用类型与引用类型作比较  地址不同   new创建对象
      console.log(new Object() == new Object());  //false  
      console.log({} == {});  //false
      console.log([1,2] == [1,2]);  //false

      // 对象类型 {}   
      // 字符串无length属性,  length是原型上的属性 Object的属性, 字符串不是对象,故无法通过该方式追加
      var str = 'aaa'
      console.log(str.length); //3 
      // str.t = 'b'   //字符串不是对象,故无法通过该方式追加
      // console.log(str.t);

  • ===严格等于

 // ===  严格等于   值和数据类型均相等返回true  先比较数据类型, 再比较值
      console.log(null === null);  //true
      console.log(null === undefined) //false
      console.log(4 == '4.00'); //true
      console.log(4 === '4.00')  //false

(4)数据类型检测

  • typeof 适用于基本数据类型的检测(Number,Boolean,String,...),引用类型全返回object

  • instanceof 适用于引用类型的检测

  • Object.prototype.toString() 两种类型检测均可 每个对象都有prototype属性

    console.log([1,2,3] instanceof Array); //true
     console.log(new Date() instanceof Date); //true
     console.log(Object.prototype.toString.call([1,2])); //[Object Array]
     console.log(Object.prototype.toString.call([1,2]).substring(8,13));  //Array  可通过字符串截取
     console.log(Object.prototype.toString.apply(null));  //[object Null]
     console.log(Object.prototype.toString.apply(undefined));  //[object Undefined]
     console.log(Object.prototype.toString.apply(NaN));  //[object Number]
     console.log(Object.prototype.toString.apply(4.00));  //[object Number]
     console.log(Object.prototype.toString.apply(4));  //[object Number]2

2.表达式

表达式指一中js短语, 可使js解释器用来产生一个值

(1)分类

  • 原始表达式: 常量,直接量(e.g:字符串), 关键字, 变量

  • 初始化表达式: 通过自变量形式创建数组,对象的表达式

  • 属性访问表达式

  • 函数表达式

  • 调用表达式

  • 对象创建表达式: 通过new的形式创建对象

      // 1. 原始表达式 e.g: 10   算式组成复合表达式e.g: 10 * 2
      // 2. 初始化表达式
      // (1) 创建对象
      var obj1 = { x: 1, y: 2 } //自变量的方式创建
      var obj2 = new Object()
      obj2.a = 3
      console.log(obj1) //{x: 1, y: 2}
      console.log(obj2) //{a: 3}
      // (2) 创建数组
      var arr1 = [1, 2]
      var arr2 = [1, , , , 3] // 稀疏数组 length:5 最后的逗号表分隔    for-in遍历时, 稀疏数组只返回有值的元素  for循环打印所有
      var arr3 = new Array(2, 3)
      var arr4 = new Array(3) //  创建长度为3的数组
      console.log(arr1) // [1,2]
      console.log(arr2) // [1, empty × 3, 3]
      console.log(arr3) //  [2, 3]
      console.log(arr4) //  [empty × 3]

      // 3.属性访问表达式
      console.log(obj2.a) //3
      console.log(obj2['a']) //3

      // 4. 函数表达式    必须后调用   先调用会报错, var声明的变量会变量提升至最前边
      // var fun2 = undefined
      // console.log(fun2);  //undefined
      var fun2 = function () {
        console.log('222222')
      }
      // 5. 调用表达式(调用函数)
      fun2()

      // 立即执行函数  !区分作用域(可写可不写)     (function({匿名函数})()   最后的()相当于调用函数
      !(function () {
        console.log('立即执行函数')
      })()

3.运算符

(1)分类

按照操作数的个数

  • 一元运算符: !

  • 二元运算符:

  • 三元运算符: 表达式1 ? 表达式2 : 表达式3 表达式1的结果为Boolean值,true则取表达式2的值,否则取表达式3的值

(2)其他

delete, in, void, ||

      // delete 运算符    删除属性
      var obj3 = new Object()
      // (1) 对象名.属性 = 属性值   使用该种方式定义的属性, delete可删
      obj3.x = 100
      console.log(obj3) // {x: 100}
      delete obj3.x
      console.log(obj3) // {}
      // (2) 定义属性   通过defineProperty()定义对象属性添加属性和值, 可控制属性操作权限    每个对象自身包含value,configurable,writable,enumerable属性
      Object.defineProperty(obj3, 'y', {
        value: 200,
        configurable: false, //是否可配置,是否可删除 默认true
        writable: true, //是否可修改 默认true
        enumerable: false, //是否可枚举(遍历) 默认true
      })
      console.log(obj3) //{y: 200}
      delete obj3.y
      console.log(obj3) //{y: 200}

      // in 运算符     判断某属性是否为obj上的属性
      console.log('y' in obj3) //true

      // void 运算符   阻止页面跳转 <a href="javascript: void(0)"></a>

      //   ||运算符          |位或(转换为二进制,每位相或,有1则1,全0则0,得值, e.g: 3 | 5 = 7 )
      function fun3(a,b,c){
        // c 默认为10, 传参使用实参的值, 否则使用默认值
        // 方式1: if判断
        // 方式2: 短路或, 左侧为true则不继续运算
         c = c || 10
         return a + b + c
      }
      console.log(fun3(1,2,20));  // 23

      // new 和 this 面向对象

4.作用域

      // 作用域
      var a = 10 //  全局变量 a 属于window
      function fun1() {
        var b = 20
        console.log(a) // 10 可访问全局变量a
        console.log(b) // 0
      }
      fun1() //先声明再调用
      console.log(a) //10
      // console.log(b);  //无法访问函数内的变量 Uncaught ReferenceError: b is not defined
      h = 5
      function fun2() {
        // var a = 1
        var d = (e = 5)
        var f = 5,
          g = 5
        i = 5
        // var a=1,b=1
        console.log(typeof d) // number   5
        console.log(typeof e) // number   5
        console.log(typeof f) // number   5
        console.log(typeof g) //number   5
        console.log(typeof h) //number   5
        console.log(typeof i) //number   5
      }
      fun2()
      console.log(typeof d) // undefined
      console.log(typeof e) // number   5
      console.log(typeof f) // undefined
      console.log(typeof g) // undefined
      console.log(typeof h) //number   5
      console.log(typeof i) //number   5

5.语句

// 语句
      //  1. 块 block  { }包裹   没有块级作用域
      {
        // 语句1;
        // 语句2; ...
        var c = 30 //没有作用域, var可进行变量提升
        console.log(c) //30
      }
      // { a: 1, b: 2 }  // SyntaxError
      console.log(c) //30   没有块级作用域

      // 2. try-catch / try-catch-finally/ try-finally  也可嵌套   try{}中发生异常,则在catch{}中捕获异常, finally{}中无论是否异常都执行
      try {
        var str = undefined
        var res = str.trim()
      } catch (e) {
        console.log(e)
      } finally {
        console.log('aaa')
      }
      console.log('qqq')

      // 3. for-in   顺序不确定, enumerable为false时无法遍历, for in对象属性受原型链影响
      var obj = { x: 1, y: 2 }
      for (var key in obj) {
        console.log(obj[key]) // 1     2
      }

6.严格模式

使用 'use strict'写在函数内部或js代码的最前边 增强安全性,添加限制

限制:

  • 不允许使用 with

  • 不允许声明的变量未赋值

  • arguments变为参数的静态副本

  • delete参数,函数名报错

  • delete不可配置的属性报错(使用defineProperty属性可删,但使用delete会报错)

  • eval, argument变为关键字, 不能作为变量,函数名

      function fun2(a, b) {
        'use strict'
        console.log(arguments)
        var obj4 = {x:1, x: 2}
        console.log(obj4);  // { x:2} 覆盖掉
      }
      fun2()  //Arguments [callee: ƒ, Symbol(Symbol.iterator): ƒ]
      fun2(10,20) //Arguments(2) [10, 20, callee: ƒ, Symbol(Symbol.iterator): ƒ]

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

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

相关文章

【微服务笔记03】微服务组件之Eureka注册中心高可用集群环境搭建

这篇文章&#xff0c;主要介绍微服务组件之Eureka注册中心高可用集群环境搭建。 目录 一、Eureka集群环境 二、搭建Eureka高可用集群环境 2.1、前提准备 &#xff08;1&#xff09;修改hosts配置文件 &#xff08;2&#xff09;创建父工程项目 2.2、搭建Eureka注册中心 …

数据可视化大屏Echarts高级开发散点图实战案例分析(地图扩展插件bmap.min.js、散点图、百度地图控件、柱图、涟漪动图、条件判断颜色)

系列文章目录 燃&#xff0c;拿来即用&#xff01;Echarts动态排名柱状图(自适应电脑和手机端)漏刻有时数据可视化Echarts组件开发(27)&#xff1a;盒须图(箱线图)前后端php交互的实战案例漏刻有时数据可视化Echarts组件开发(26):全国地图三级热力图下钻和对接api自动调用数据…

高压功率放大器在高校实验室的实际应用领域介绍

功率放大器的应用领域是很多电子工程师都关心的问题&#xff0c;那么功率放大器的使用场景又有哪些呢&#xff0c;下面来介绍一下安泰高压功率放大器在各个高校的实际应用情况。 图&#xff1a;激光切割 一、ATA-1000系列宽带功率放大器 应用领域&#xff1a;激光切割 适用高校…

Power BI 可视化修改配色

示例数据&#xff1a; 一、Power BI 按列排序 当把文本字段放在坐标轴&#xff0c;显示的顺序都乱了&#xff0c;完全不是自己想要的&#xff0c;就像下图所示&#xff1a; 默认按照Y轴的数值降序排序&#xff0c;如果选择按照month 以升序排序&#xff0c;就会如下所示&am…

【CDP】CDP集群如何通过Cloudera Manager配置使用SNMP方式转发告警

前言 这篇文章参考了大神的文章&#xff0c;如何在CDH平台上集成SNMP服务&#xff0c;然后实现了CDP集群集成SNMP服务&#xff0c;这里描述下&#xff0c;如何集成步骤&#xff0c;在CDP集群中告警是一个很重要的信息&#xff0c;最直观的衡量一个集群的健康状况&#xff0c;那…

[深度学习] 基于切片辅助超推理库SAHI优化小目标识别

对象检测是迄今为止计算机视觉中最重要的应用领域。然而&#xff0c;小物体的检测和大图像的推理仍然是实际使用中的主要问题&#xff0c;这是因为小目标物体有效特征少&#xff0c;覆盖范围少。小目标物体的定义通常有两种方式。一种是绝对尺度定义&#xff0c;即以物体的像素…

【小程序】自定义组件

文章目录组件的创建与引用自定义组件的样式自定义组件的数据、方法和属性data数据methods 方法properties 属性数据监听器纯数据字段组件的生命周期组件所在页面的生命周期插槽单个插槽多个插槽父子组件之间的通信behaviors组件的创建与引用 创建一个组件的步骤&#xff1a; …

发票额度报销最优排列组合问题

1、问题描述 因为我的公司每个月给员工会有一定的交通费额度&#xff0c;需要拿发票去报销才能获得的。要求的是发票总金额不能大于报销的额度。因此在实际报销的时候&#xff0c;你要一张张发票去排列组合经可能的把报销金额往报销额度那里去凑。比如你有1000元额度&#xff0…

Unity 3D JavaScript 脚本基础||Unity 3D C# 脚本基础

变量 数值变量。var a1000;var b3.1415926;字符串变量。 是由单引号或双引号括起来的 Unicode 字符序列。 布尔值。 只有 true 和 false 。用来描述某个事物为真或为假。 数组 是数据的集合&#xff0c;数组中的每一个元素都有自己独有的下标&#xff0c;下标从0开始计数。 表…

《收获,不止Oracle》读书笔记之第三章逻辑体系世界

1.数据库有序的逻辑体系 2.逻辑体系从老余养殖细细说起 推出的逻辑结构是&#xff1a;表空间&#xff08;tablespace&#xff09;、段&#xff08;segment&#xff09;、区&#xff08;extent&#xff09;、块&#xff08;block&#xff09;。Oracle server正是有条理地通过表空…

基础数学(七)——线性方程组的数值解法

文章目录考试要求基础知识一般求解思路消元法高斯消元法小主元导致的计算失误高斯列主元素消去法&#xff08;期末考试要求之一&#xff09;高斯消元法例题&#xff08;期末必考&#xff09;高斯消元法的优缺点减少fill-in现象&#xff08;了解&#xff09;矩阵分解Doolittle分…

【ROS】——常用命令(五)

文章目录前言1. rosnode1.1 rosnode list 列出活动节点1.2 rosnode ping 测试到节点的连接状态1.3 rosnode info 打印节点信息1.4 rosnode machine 列出指定设备上节点1.5 rosnode kill 杀死某个节点1.6 rosnode cleanup 清除不可连接的节点2. rostopic2.1 rostopic list(-v)2.…

【学习】深度强化学习

李宏毅深度学习一、深度强化学习Deep Reinforcement Learning (RL)什么是RL&#xff1f;&#xff08;三步骤&#xff09;计算loss计算A版本0版本1版本2版本32、梯度方法收集训练数据:探索3、actor criticMCTD版本3.5一、深度强化学习Deep Reinforcement Learning (RL) 什么是R…

【回答问题】ChatGPT上线了!给我推荐20个比较流行的图像语义分割模型

给我推荐20个比较流行的图像语义分割模型 在这里列出20个比较流行的图像语义分割模型&#xff1a;U-Net Mask R-CNN Fully Convolutional Network (FCN) SegNet DeepLab v3 PSPNet ENet ICNet RefineNet DenseASPP DenseNet LinkNet FPN BiSeNet ENAS Deeplab v3 GCN CRF-RNN …

Linux环境变量

文章目录什么是环境变量&#xff1f;什么是本地变量&#xff1f;如何获取环境变量&#xff1f;在shell中在程序中如何添加/删除环境变量&&本地变量&#xff1f;在shell中在程序中为什么环境变量能够被子进程继承&#xff1f;什么是环境变量&#xff1f; 环境变量是进程…

Vue初识系列【1】

文章目录一 前端体系1.1 前端三要素1.2 JavaScript 框架1.3 JavaScript 构建工具1.4 前端所需后端技术1.5 UI框架二 前后端分离史2.1 后端为主的 MVC 时代&#xff08;web1.0&#xff09;2.2 基于 AJAX 带来的 SPA 时代(web2.0)2.3 前端为主的 MV* 时代2.4 NodeJS 带来的全栈时…

OBS 进阶 音频面板优化

因为,面板高度就那么大,如果声音源很多的话,就有点乱。 优化目的:静音的,自动放在底部,这样,音频面板上面的都是没有静音的,也是我们最关注的部分。 目录 一、音频面板优化 1、不想要音频面板的title,将其去掉

【LeetCode每日一题】【2023/1/3】2042. 检查句子中的数字是否递增

文章目录2042. 检查句子中的数字是否递增方法1&#xff1a;直接遍历写法2&#xff1a;按本题特有条件方法2&#xff1a;栈方法3&#xff1a;std::stringstream写法22042. 检查句子中的数字是否递增 LeetCode: 2042. 检查句子中的数字是否递增 简单\color{#00AF9B}{简单}简单 句…

202301-第一周资讯

大家好&#xff0c;欢迎来到本周资讯&#xff0c;在过去的一周内呢&#xff0c;我们在示例DEMO、文档、教学视频上都有了较多的产出并且帮助大家解决了不少问题&#xff0c;赶紧看看上周成果吧&#xff01; 目录 DEMO 动态TopN报表 导出图文报告的脚本示例 Superpage pc端…

【FPGA】基本实验步骤演示 | Verilog编码 | 运行合成 | 设备/引脚分配 | 综合/实施 | 设备配置

写在前面&#xff1a;本章的目的是让你理解与门、或门和非门的行为&#xff0c;并使用 Verilog 语言实现多输入与门、或门和非门。在生成输入信号之后&#xff0c;你需要通过模拟来验证这些门的操作&#xff0c;并使用 FPGA 来验证 Verilog 实现的电路的行为。 0x00 引入&#…