颠覆认知的『JavaScript』篇——02 语法、规范、错误、运算符、判断分支、注释

最新推荐文章于 2024-09-11 15:33:18 发布
最新推荐文章于 2024-09-11 15:33:18 发布
阅读量954 收藏
点赞数
分类专栏： 颠覆认知的『JavaScript』篇 文章标签： javascript html 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Mr_ZJQ/article/details/121938944
版权

一、规范

 js是以分号区分语句的，不写也可以，但是要规范，加了就习惯加上，不加就全都不加，有些可以不用加（if   switch   for   function）

//符号两边加空格
 var a = a + b

二、错误

1. 语法错误

所有语句都不会执行

2. 通用错误

1.错误语句之前的语句会执行，之后的不会执行

2. 不同脚本块之间相互独立错误不会相互影响

三、运算符

1. 运算优先级

2. + 运算符

任何数据类型+字符串=字符串

var a = 1 + "str" // a = 1str

3. *、/运算符

// *、/ 数学运算
var a = 5,
  	b = 2,
  	c,
    d;

d = a * b;      // 10
d = a * NaN     // NaN
d = a * 'str'   // NaN
c = a / b;      // 2.5
c = 0 / 0;      // NaN
c = 'a' / 'b';  // NaN
c = NaN / 5;    // NaN
c = NaN / NaN;  // NaN
c = 5 / NaN;    // NaN
c = 1 / 0;      // Infinity -> Number数据类型
c = -1 / 0;     // -Infinity -> Number数据类型

4. 交换两个数的方法

//交换a，b的值
var a = 1,
    b = 2;
var c = a;
var a = b;
var b = c;


//不加第三个变量
var a = a + b;
var b = a - b;
var a = a - b;

5. ++、--（自增、自减）

++ (--）将其操作数加1(减1)并返回—个值。

如使用后置自增（(自减)，操作符在操作数后x+＋(x--)，操作数将在自增前返回。

如使用前置自增(自减)，操作符在操作数后++X(--x)，操作数将先自增后返回。

var a = 1;
console.log(a++); // 1
console.log(a);   // 2

var b = 2;
console.log(++b); // 3
console.log(b);   // 3

var c = 3;
console.log(c--); // 3
console.log(c);   // 2

var d = 4;
console.log(--d); // 3
console.log(d);   // 3

进阶练习

var a = 5,
  	b;

/**
 * 1. b = a + 1 
 * 2. a++ 				a -> 6
 */
b = a++ + 1;
console.log(b, a); // 6 6

//-------------------------------------------------------------------------------

/**
 * 1. ++a  				a -> 6
 * 2. b = a + 1;
 */
b = ++a + 1;
console.log(b, a);  // 7 6 

//--------------------------------------------------------------------------------

/**
 * 1. a-- 				a -> 5
 * 2. 5 + --a			a -> 4
 * 2. --a 				a -> 3
 * 3. b = 5 + 3
 */
b = a-- + --a;
console.log(b, a);  // 8 3

//------------------------------------------------------------------------------

/**
 * 1.--a					a -> 4
 * 2. 4 + --a			
 * 3. --a 				a -> 3
 * 4. b = 4 + 3
 */
b = --a + --a;
console.log(b, a); // 7 3

//-----------------------------------------------------------------------------

/**
 * 1.	--a					a -> 4
 * 2. 4 + a++		
 * 3. b = 4 + 4				
 * 4. a++					a -> 5
 */
b = --a + a++;
console.log(b, a); // 8 5

6. > < >= <=  ==   === !=  !==（比较运算符）

返回值为bool值

如果操作数都是数值，则执行数值比较。

如果操作数都是字符串，则逐个比较字符串中对应字符的编码。

如果有任—操作数是数值，则将另一个操作数转换为数值，执行数值比较。

如果有任一操作数是布尔值，则将其转换为数值再执行比较。

相等不看数据类型。全等需要数据类型相等

NaN与包括自己在内的任何东西都不相等

// 1. 两个操作数都是number类型
var bool = 1 > 10; 	  		// false		
var bool = 20 < 100;  	 	// true
var bool = 10 === 10;  		// true
var bool = 10 == 10;	   	// true

// 2. 两个操作数都是string类型
var bool = 'a' > 'b'; 		// false   a对应的ASCII码 < b对应的ASCII码
var bool = 'abc' > 'aac'; // true			按顺序逐个比较字符的ASCII码

// 3. 任一操作数是number类型
var bool = 1 == '1';    	// true  str -> Number(str)
var bool = 1 !== '1';  		// true   全等比较时，不转换操作数，值和数据类型都相同才返回true

// 4. 任一操作数是boolean类型
var bool = true > 0;     // true  boolean -> Number(true) -> 1
var bool = false == 0;	 // true 	boolean -> Number(false) -> 0
var bool = true > '12';  // false boolean -> Number(true) -> 1  str -> Number('12') -> 12

// NaN与包括自己在内任何东西都不相等
var bool = NaN == NaN; // false

四、判断分支

1. if  else

// 查询成绩等级
var score = 63;
if (score >= 90) {
  console.log('您的成绩等级为A');
}
if (score >= 80 && score < 90) {
  console.log('您的成绩等级为B');
}
if (score >= 70 && score < 80) {
  console.log('您的成绩等级为C');
}
if (score >= 60 && score < 70) {
  console.log('您的成绩等级为D');
}
if (score < 60) {
  console.log('您的成绩不及格');
}

if (score >= 90) {
  console.log('您的成绩等级为A');
} else if (score >= 80 && score < 90) {
  console.log('您的成绩等级为B');
} else if (score >= 70 && score < 80) {
  console.log('您的成绩等级为C');
} else if (score >= 60 && score < 70) {
  console.log('您的成绩等级为D');
} else if (score >=0 && score < 60) {
  console.log('您的成绩不及格');
} else {
  console.log('您的成绩出现异常');
}

2. switch条件语句

var city = window.prompt('请输入您所在的地区');

switch (city) {
  case '北京':
    console.log('15K');
    break; // 中止当前循环
  case '上海':
    console.log('13K');
    break;
  case '深圳':
    console.log('12K');
    break;
  case '广州':
    console.log('11K');
    break;
  default:
    console.log('9K');
}

switch (true) {
  case score >= 90 && score <= 100:
    console.log('您的成绩等级为A');
    break;
  case score >= 80 && score < 90:
    console.log('您的成绩等级为B');
    break;
  case score >= 70 && score < 80:
    console.log('您的成绩等级为C');
    break;
  case score >= 60 && score < 70:
    console.log('您的成绩等级为D');
    break;
  case score >= 0 && score < 60:
    console.log('您的成绩不及格');
    break;
  default:
    console.log('您的成绩出现异常');
}

五、&& || ！逻辑运算

undefind、null、NaN、""、0、false 都是假，其余的都为真

1. &&

遇到真就往后走，遇到假就返回当前的值

  • 1 && 1 ：1  真

    1 && 0 ：0  假

    0 && 1 ：0  假

    0 && 0 ：0  假

true && 1;  				// 1
'123' && false; 		// false
undefined && 'str'; // undefined
'str' && NaN; 			// NaN
'' && null; 				// ''
0 && 5; 						// 0

2. ||

遇到假就往后走，遇到真就返回当前的值

  • 1 && 1 ：1  真

    1 && 0 ：1  真

    0 && 1 ：1  真

    0 && 0 ：0  假

true || 1;  				// true
'123' || false; 		// '123'
undefined || 'str'; // 'str'
'str' || NaN; 			// 'str'
'' || null; 				// null
0 || 5; 						// 5

3. ！

取反

var a = !1; //true

六、注释

1.单行注释

//单行注释

2. 块注释

/* 这是第一行
 * 中间的每一行最好加上*，这样更加规范，看起来也更加舒服
 *
 */

七、小练习

输入一个星期一至星期日任意一天，然后选择上午下午，打印出那个时段的计划，比如说我星期一下午去喝茶了，然后就打印出来

第一种方法

  var day = window.prompt('请填写星期几');
        var time = window.prompt('选择上午或下午');
        if(time = '上午'){
            switch(day){
                case '星期一':
                    console.log('去喝茶');
                    break;
                case '星期二':
                    console.log('去喝茶');
                    break;
                case '星期三':
                    console.log('去喝茶');
                    break;
                case '星期四':
                    console.log('去喝茶');
                    break;
                case '星期五':
                    console.log('去喝茶');
                    break;
                case '星期六':
                    console.log('去喝茶');
                    break;
                case '星期天':
                    console.log('去喝茶');
                    break;
                default:
                    console.log("请输入星期一至星期日");
            }
        }
        else if(time = '下午'){
            switch(day){
                case '星期一':
                    console.log('去喝茶');
                    break;
                case '星期二':
                    console.log('去喝茶');
                    break;
                case '星期三':
                    console.log('去喝茶');
                    break;
                case '星期四':
                    console.log('去喝茶');
                    break;
                case '星期五':
                    console.log('去喝茶');
                    break;
                case '星期六':
                    console.log('去喝茶');
                    break;
                case '星期天':
                    console.log('去喝茶');
                    break;
                default:
                    console.log("请输入星期一至星期日");
            }

        }

第二种

var day = window.prompt('请填写星期几');
var time = window.prompt('选择上午或下午');
var days = ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日'];
var times = ['上午', '下午'];
var plans = ['计划1', '计划2', '计划3', '计划4',
  '计划5', '计划6', '计划7', '计划8',
  '计划9', '计划10', '计划11', '计划12',
  '计划13', '计划14'];
switch (day) {
  case days[0]:
    if (time == times[0]) {
      console.log(days[0] + times[0] + plans[0]);
    } else if (time == times[1]) {
      console.log(days[0] + times[1] + plans[1]);
    } else {
      console.log('输入格式错误');
    }
    break;
  case days[1]:
    if (time == times[0]) {
      console.log(days[1] + times[0] + plans[2]);
    } else if (time == times[1]) {
      console.log(days[1] + times[1] + plans[3]);
    } else {
      console.log('输入格式错误');
    }
    break;
  case days[2]:
    if (time == times[0]) {
      console.log(days[2] + times[0] + plans[4]);
    } else if (time == times[1]) {
      console.log(days[2] + times[1] + plans[5]);
    } else {
      console.log('输入格式错误');
    }
    break;
  case days[3]:
    if (time == times[0]) {
      console.log(days[3] + times[0] + plans[6]);
    } else if (time == times[1]) {
      console.log(days[3] + times[1] + plans[7]);
    } else {
      console.log('输入格式错误');
    }
    break;
  case days[4]:
    if (time == times[0]) {
      console.log(days[4] + times[0] + plans[8]);
    } else if (time == times[1]) {
      console.log(days[4] + times[1] + plans[9]);
    } else {
      console.log('输入格式错误');
    }
    break;
  case days[5]:
    if (time == times[0]) {
      console.log(days[5] + times[0] + plans[10]);
    } else if (time == times[1]) {
      console.log(days[5] + times[1] + plans[11]);
    } else {
      console.log('输入格式错误');
    }
    break;
  case days[6]:
    if (time == times[0]) {
      console.log(days[6] + times[0] + plans[12]);
    } else if (time == times[1]) {
      console.log(days[6] + times[1] + plans[13]);
    } else {
      console.log('输入格式错误');
    }
    break;
  default:
    console.log('输入格式错误');
}

Mr_ZJQ
关注
专栏目录
【JavaEE初阶】前端篇：JavaScript基础语法
哎呀是小张啊 的博客
10-01 1894
这篇博客主要介绍的是 JS 的相关内容，介绍了 JS 的基础的语法 ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
JavaScript笔记
shine_my的博客
03-13 3277
JavaScript笔记
javascript能不能不写分号、书写位置、如何注释
EGeek
09-26 481
能，但是开发一定要写！ 如果不写分号浏览器会自动添加，但是会消耗一些系统资源。 而且浏览器有时会错加分号，所以开发时必须写。  
JavaScript基础语法
Living_Amethyst的博客
09-20 1100
JS中所有的对象都是Object类型，无论这个对象叫啥名字，有啥属性，都是相同类型。对象：浏览器把页面中的每个标签/元素都抽象成了一个对象，使用JS就可以直接拿到这些对象，也就可以基于JS来操作页面内容了。在使用某个变量的时候，就会先在当前{ }去找，如果找不到，就往外层{ }去找，一直找到最顶层还找不到，就认为变量未定义。创建了变量add，对add初始化，用一个函数对它初始化，add这个变量的类型，就是函数类型——function。undefined的值是undefined，类型也是undefined。
java体系学习总结记录——超长篇
qq30211478的博客
12-26 3537
Java体系学习 一、主流语言介绍 1、c语言：底层编程，比如嵌入式、病毒开发等应用，可以替代汇编语言来开发系统程序；高层应用可以开发从操作系统到各种应用软件。是一种面向过程的语言。 2、java：广泛应用于企业级软件开发、安卓移动应用开发、大数据云计算等领域。 3、Python：在人工智能方面有很大优势，广泛用于图形处理、科学计算、web编程、引擎开发、多媒体应用。被称为胶水语言，能够调...
JavaScript笔记整理-01 基础知识
qq_43717736的博客
07-08 165
整理一下JavaScript一些知识 JavaScript课程 初识JavaScript 1、变量 JavaScript中推荐使用单引号 // vscode中js注释快捷键 // 单行注释 ctrl + / /* 多行注释 shift + alt + a */ // 这是一个输入框 prompt("请输入你的年龄:"); // 获取输入框内文本并输出 var myname = prompt("请输入您的名字");
前端笔记之JavaScript（十）深入JavaScript节点&DOM&事件
RopeHuo
03-27 165
一、DOM JavaScript语言核心。变量的定义、变量的类型、运算符、表达式、函数、if语句、for循环、算法等等。这些东西都属于语言核心，下次继续学习语言核心就是面向对象了。JavaScript能做非常多的事情：DOM开发、Ajax开发、Canvas开发、NodeJS开发、前端框架(React、Vue、Angular等等)、HTML5开发。这些都需要语言核心的知识。 DOM开发...
SQL Server 2022从入门到精通
热门推荐
weixin_43178406的博客
06-26 2万+
本文主要介绍了SQL Server 2022从入门到精通，希望能对学习数据库，尤其是学习SQL Server的同学们有所帮助。 文章目录 1. 前言 2. 书籍推荐 2.1 本书特色 2.2 本书作者 2.3 本书目录 2.4 适合读者
PHP开发者的JavaScript快速教程（phper简明js教程）
云客的技术博客【云游天下 做客四方】
05-16 1440
本文提供word格式文档，下载链接: https://pan.baidu.com/s/1CcM2Dl4_rG0qe0omxPG8zQ 提取码: 9isx 前言： 每一位PHP开发者或多或少的都掌握一些JavaScript知识，本文写在《云客Drupal8源码分析》前端相关章节发布前，意在帮助沉浸在后端世界的phper快速进入前端js世界（推荐phper关注学习Drupal，那是php世界的珠峰...
Flutter：从入门到实践
GitChat
07-02 2813
ES6全部常用特性整理(一)
xuzhijia1991的博客
12-16 1440
文章概述 这里我们要介绍的是ECMAScript以及他这几年发布的新特性，可能你会说，这不就是ES6么，我天天用的就是这个，的确，就目前而言一个合格的前端开发都应该对他比较熟悉。 那为什么我们这里还是要再次说起ECMAScript呢，具体的原因也很简单。 第一点就是结合面试过程中的经验，我们发现很多开发者并没有理解语言和平台之间的关系。 以javascript为例，我们日常编写的代码，哪些属于语言层面，哪些属于平台层面，这一点，很多人都回答不出来。 在以前，不了解这些一样可以写代码，但是在node平台发展的
软件著作权申请教程（超详细）（2024新版）软著申请
m0_75269526的博客
09-09 2781
软件著作权，软著，软著申请，软用户使用手册：提交登记软件的任何一种文档的连续的前30页和连续的后30页，每页不少于30行。如果是多人合作开发著作权人不是一个人的话，还需要准备一份合作开发协议。首先我们需要在官网里面注册一个账号，并且完成实名认证，一般是注册【个人】的身份。合作开发协议书：这个如果是著作权人有多个（多个人一起开发）就需要提供这个材料。在填报完成之后需要打印一个签章页签字（如果不是个人需要盖章）注册完成后点击下面进行登记，如果没有实名需要先实名认证（源代码：源程序前连续的30页和后连续的30页。
js中【Worker】相关知识点详细解读
最新发布
2301_79858914的博客
09-11 828
JavaScript 中的 Worker 是一个可以在后台线程中运行代码的 API，这样可以避免主线程（通常是 UI 线程）被阻塞。使用 Worker 时，JavaScript 可以在多线程环境中工作，解决了单线程的瓶颈问题。通常情况下，JavaScript 是单线程的，也就是所有的代码（包括 DOM 操作和事件处理等）都在同一个线程里执行。如果某段代码需要大量计算，或者运行时间过长，会阻塞整个页面，导致界面卡顿甚至崩溃。Worker提供了一种将复杂或耗时的任务分配到后台线程执行的方法。
echarts.js+china.js实现中国地图各省数据案例
qq_58258855的博客
09-11 409
实现中国地图各省数据案例
JS笔记
2201_76100326的博客
09-11 850
javascript中的对象分为3种：自定义对象，内置对象，浏览器对象 JavaScript 中的所有事物都是对象：字符串、数字、数组、日期，等等。在 JavaScript 中，对象是拥有属性和方法的数据。属性是与对象相关的值。方法是能够在对象上执行的动作。.关键词（）
JavaScript基础
zhangh040629的博客
09-10 1271
//** 控制浏览器弹出一个警告框* alert()*/alert;/** 让计算机在页面中输出一个内容*/write;/** 向控制台输出一个内容*/log;</</</</
jEasyUI 创建带复选框的树形菜单
wjs2024的博客
09-10 343
jEasyUI 是一个基于 jQuery 的框架，它为用户提供了一套完整的用户界面组件，包括菜单、窗口、表格等。在本文中，我们将重点介绍如何使用 jEasyUI 创建一个带复选框的树形菜单。
2030研发趋势：颠覆、合作与转型——毕马威前瞻
"《2030年的研发远景：毕马威-201904》研究报告揭示了未来十年生命科学领域面临的重大变革。在行业生产力下滑、成本上升和产品生命周期缩短的背景下，个性化医疗的崛起和新竞争者的加入正在重塑研发格局。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值