JavaScript精粹(一)

JavaScript(简称为JS)是一种广泛应用于网页开发的脚本语言,具有以下几个主要作用:

网页交互:JavaScript 可以用于创建动态的网页效果,例如响应用户的操作,实现页面内容的动态更新,以及验证用户输入等。
与用户交互:通过 JavaScript,网页可以与用户进行实时的交互,例如表单验证、响应点击事件、实现动画效果等,从而提升用户体验。
操作 DOM:JavaScript 可以通过 DOM(Document Object Model 文档对象模型)来操作网页的结构、样式和内容,使开发者能够动态地修改页面元素,实现页面的动态效果。
异步数据请求:JavaScript 可以通过 AJAX 技术(Asynchronous JavaScript and XML 异步 JavaScript 和 XML)向服务器发送异步请求,获取数据并动态更新页面内容,实现无需刷新页面即可加载新数据的功能。
构建 Web 应用:JavaScript 还可以用于构建复杂的 Web 应用,例如单页应用(SPA,Single Page Application)和动态网站,通过 JavaScript 的框架和库(如React、Angular、Vue.js等),开发者可以更高效地构建现代化的 Web 应用程序。

总的来说,JavaScript 在网页开发中扮演着至关重要的角色,它使得网页不再是静态的展示页面,而是可以实现丰富的交互和动态效果,从而提升用户体验和网站的功能性。

这里写自定义目录标题

  • 一、JavaScript发展史
    • 1.1 JavaScript用途
    • 1.2 JavaScript非常好学
  • 二、Hello Word!
    • 1.1 js代码的书写
      • 1.1.1 javascript标签的书写:
      • 1.1.2 放置位置,执行顺序
      • 1.1.3 console.log() 控制台
      • 1.1.4 alert()
      • 1.1.5 prompt()
    • 1.2 一个简单的js过程
      • 1.2.1获取元素
      • 1.2.2 绑定事件
      • 1.2.3写js代码需要注意什么?
    • 1.3 不同位置的js代码
      • 1.3.1 当js代码放在获取的元素之前的时候
      • 1.3.2 将js代码放在标签内
    • 1.4 事件
    • 1.5 在标签中添加 或者 获取内容
      • 1.5.1 innerHTML
      • 1.5.2 innerText
  • 三 变量和字面量初步
    • 1.1 变量和初步认识this
      • 1.1.1 定义变量
      • 1.1.2 变量要先申明才能用
      • 1.1.4 变量的运用
      • 1.1.2 this的简单认识
    • 1.2 数字的字面量
      • 1. 八进制举例:
      • 2. 16进制举例:
      • 3. NaN
    • 1.3 字符串
    • 1.4 变量类型
      • 1.4.1 数据类型(5种)
      • 1.4.2 引用类型
  • 四、数学运算符
    • 1.1 数学运算符
      • 1.1.1 string → number (显示类型转换)
      • 1.1.2 number → string
      • 1.1.3 toString()
      • 1.1.4 隐式转换
      • 1.1.5 取余 %
    • 1.2 关系运算符
      • 1.2.1关系运算符的正统,number和number进行数学运算,得到的答案boolean
      • 1.2.2 不正统的关系运算,为了面试
    • 1.3 逻辑运算符
      • 1.3.1 && 与运算符
      • 1.3.2 || 或运算符
      • 1.3.3 ! 非运算符
    • 1.4 赋值运算符
    • 1.5 Math对象方法


一、JavaScript发展史

1.1 JavaScript用途

前端三层:

  • 结构层 HTML 从语义的角度描述页面的结构
  • 样式层 CSS 从审美的角度装饰页面
  • 行为层 JavaScript 从交互的角度提升用户体验
    说白了,JavaScript用来制作web页面交互效果,提升用户体验

1.2 JavaScript非常好学

好学的点是什么:

  • JavaScript是有界面效果:不像C语言,黑底白字,很枯燥的。
  • JavaScript的语法来源于C和Java:有C和Java的经验同学好学很多。
  • JavaScript是弱变量类型的语言,动态数据类型语言。
  • JavaScript运行在宿主环境中,不关心内存,垃圾回收。

不好学的点是什么:

  • 兼容性问题: IE8是个怪胎,很多东西都不一样,所以就要写兼容写法,不怕造轮子,多写几遍
  • 花式写法很多,抽象:从简单入手,细细品味代码
  • 太多细节: 为知笔记认真写自己的笔记,自己做实验; 老师的课程已经精挑细选了细节,并不盲目堆砌

二、Hello Word!

1.1 js代码的书写

1.1.1 javascript标签的书写:

三种写法都是对的

<script></script>
<script type="text/javascript"></script>
<script language="javascript"></script>

JavaSript程序,要写在HTML页面中,运行页面的时候,这个页面上的JS也就一起运行了。也就是说,js的运行必须有宿主环境,最最常见的宿主环境,就是浏览器

1.1.2 放置位置,执行顺序

可以放置在页面中任何位置,但是,我们通常放在body或者head结束之前,且要注意加载顺序,从上到下依次加载
就像css一样,js还可以引入外部js文件,通常放在head结束之前

<script src="index.js"></script>

1.1.3 console.log() 控制台

console.log("内容");

在控制台输出内容,字符串需要加引号(单双引号不区分,成对出现就好)

1.1.4 alert()

alert("内容");

1.1.5 prompt()

var a = prompt("请输入用户名:");

会把用户输入的值返回,存到a里面

1.2 一个简单的js过程

我们想要用js操作元素,和我们的css一样,需要选择到这个元素,当然,我们的css是通过选择器,那么js是通过什么呢?

1.2.1获取元素

我们来学习第一个获取元素的方法

document.getElementById("id名");
        //通过ID选择器获取元素
//document代表整个HTML页面

1.2.2 绑定事件

当我们获取到元素以后,我们可以操作元素了,我们来给他绑定一个点击事件,通常也叫做添加监听。

document.getElementById("box").onclick = function () {
    alert("Daniel好帅!Daniel好帅!");
};

1.2.3写js代码需要注意什么?

通过上面的一段简单的js代码,我们可以总结出一些js的代码规范

  • 代码要缩进,缩进要对齐
  • js严格区分大小写
  • 语句字符都要半角符号
  • 每条完整语句后面要写分号
  • JavaScript对空格和换行不敏感,因此,语句后面的分号就显得尤为重要,分号代表一个语句执行完毕

1.3 不同位置的js代码

1.3.1 当js代码放在获取的元素之前的时候

这个时候由于代码是由上到下执行的,因此js找不到box,这个时候就会报错,这个时候我们可以用

window.onload = function(){}

将我们的代码包裹起来,这个代码的意思是:页面加载完成(标签、图片、框架…)后,执行代码。
但是,一个页面只能出现一次

<script>
window.onload = function(){
    document.getElementById("box").onclick = function(){
        alert( '这是我的第一段JavaScript代码~' );
    };
};
</script>
<body>
<div id='box'></div>
</body>

1.3.2 将js代码放在标签内

神奇的是,我们还能将js的代码放在标签里面,但是,写法有所不同

<div id='box' onclick='alert("这是我的第一段JavaScript代码~")'></div>

我们可以发现,少了function方法,好比我们有onclick这一个属性一样直接用等号加引号接上他的属性值
但是,这样子写没办法维护,代码一多久杂乱无章,可读性差因此我们不会这样写js

1.4 事件

JS里面有很多的事件,刚刚我们讲的onclick就是其中的左键点击事件。
我们可以讲这些事件大致分为几类:鼠标事件、键盘事件、表单事件、系统事件。此处做简单认识,暂时无需全部掌握。
鼠标事件:

onclick 鼠标点击事件
onmouseover/onmouseout 鼠标被移入/移出(会冒泡,暂时不需要理解)
onmouseenter/onmouseleave 鼠标移入/移出(常用)
ondblclick 鼠标双击事件
onmousedown 鼠标按键按下事件(按下不弹起)
onmousemove 鼠标移动事件
onmouseup 某个鼠标抬起事件

表单事件:

onblur 元素失去焦点
onfocus 元素获得焦点
onchange 用户改变表单的内容 (发生在失去焦点之前)
用户改变表单内容:当失去焦点的时候表示改变完成,但是又在失去焦点事件之前执行
onreset 重置按钮被点击(注意:要给form表单设置该事件)
onsubmit 提交按钮被点击

键盘事件:

onkeydown 某个键盘的键被按下
onkeypress 某个键盘的键被按下或按住
onkeyup 某个键盘的键被松开

系统事件:

onload 某个页面或图像被完成加载
onresize 窗口或框架被调整尺寸
onselect 文本被选定
onerror 当加载文档或图像时发生某个错误(xss跨站脚本攻击时使用)

1.5 在标签中添加 或者 获取内容

我们先来做一个小小的案列,当我们鼠标移入box盒子的时候显示一段文字:

1.5.1 innerHTML

我们又学习到一个新的属性:innerHTML 获取元素里面的内容或者添加内容

document.getElementById('box').onmouseover = function(){
    document.getElementById('box').innerHTML = '大家好,我是Daniel';
};

当然也可以获取内容

console.log(document.getElementById('box').innerHTML);

这个时候我们可以获取里面的内容,是获取到里面所有的内容,包括标签

1.5.2 innerText

此外,还有一个innerText也可以添加内容

document.getElementById('box').onmouseover = function(){
    document.getElementById('box').innerText = '<p>大家好,我是Daniel。</p>';
};
document.getElementById('box').onmouseover = function(){
    document.getElementById('box').innerHTML = '<p>大家好,我是Daniel。</p>';
};

但是我们可以看出来,innerText不能解析标签,而innerHTML可以。
注意:这两个属性都是可读可写的,也就是既可以修改也可以获取.


三 变量和字面量初步

1.1 变量和初步认识this

变量(Variables),和高中代数学习的x、y、z很像,它们不是字母,而是蕴含值的符号。
它和直接量不同,直接量5,就是数字5;直接量”你好”就是字符串“你好”。现在这个变量不一样了,你看见一个a,实际上它不是字母a,而是里面蕴含的不同的值。

1.1.1 定义变量

<script type="text/javascript">
    //定义一个变量
    var a;
    //赋值
    a = 100;
    //输出变量a
    console.log(a);
</script>

我们使用var关键字来定义变量,所谓的关键字就是一些有特殊功能的小词语,关键字后面要有空格。var就是英语variables变量的缩写,表示定义一个变量。一旦你

var a

你的电脑内存中,就会开辟一个空间,来存储这个变量a。现在就可以给这个变量赋值,JS中给变量赋值用等号,等号右边的值赋给左边

a = 100

现在a变量的值就是100。所以我们输出

console.log(a)    //100

1.1.2 变量要先申明才能用

使用一个变量,必须先进行一个var,才能使用。var这个过程可以叫做声明declaration,也可以叫做定义definition。
现在我们直接运行语句:

console.log(b);   //这个b没有被var过,所以要报错

在这里插入图片描述

因为b没有被定义,所以b现在不是一个变量,系统不认识这个b的。抛出引用错误。而且
如果一个变量,仅仅被var了,但是没有被赋初值呢,此时这个变量的值就是undefined 未定义

var a;
console.log(a);  //undefined

变量也可以一边定义一边赋值

var a = 10;

还可以同时定义多个变量

var a = 10,b = 20;

变量的名称是标识符(identifiers),任何标识符的命名都需要遵守一定的规则:

  • 在JavaScript语言中,一个标识符(identifier)可以由 字母、下划线(_)、美元($)符号、数字(0-9) 组成,但不能以数字开头 。也就是说,一个标识符必须由字母、下划线、美元符号开头,后续可以有字母、下划线、美元符号、数字。因为JavaScript语言是区分大小写的,所以A和a不是同一个变量。并且不能是JavaScript保留字、关键字。

1.1.4 变量的运用

之前我们设置了一个js事件,鼠标移入会显示内容,那么,当移出的时候我们也给他设置事件,让里面的内容清空

document.getElementById('box').onmouseover = function(){
    document.getElementById('box').innerHTML = '大家好,我是Daniel。';
};
document.getElementById('box').onmouseout = function(){
    document.getElementById('box').innerHTML = '' ";
};

这个时候,我们可以看到我们的页面中有一大串重复的语句document.getElementById(‘box’) ,这时候我们就可以用变量把他给存起来。

var oBox = document.getElementById('box');
oBox .onmouseover = function(){
    oBox .innerHTML = '大家好,我是Daniel。';
};
oBox .onmouseout = function(){
    oBox .innerHTML = ''";
};

这个时候,我们可以发现,我们的代码量少了很多,优化了代码,也提升了运行速度,但是,我们却不能这样子,

var oBox = document.getElementById('box');
var x= oBox .innerHTML
oBox .onmouseover = function(){
    x = '大家好,我是Daniel。';
};
oBox .onmouseout = function(){
    x = ''";
};

这个时候是什么情况呢,是我们把oBox的内容复制给了x,再将’大家好,我是Daniel。复制给x,这时候,等价于给x新赋值了内容,把之前的覆盖了。在js里面 ‘=’是赋值的意思,‘==’才是等于的意思

1.1.2 this的简单认识

this指向触发这个事件的对象

oBox1.onmouseenter = function () {
    this.innerHTML = "我爱Daniel!";//在js里面=是赋值
};
oBox1.onmouseleave = function () {
    this.innerHTML = "Daniel好帅!";//在js里面=是赋值
};

字面量:英语叫做literals,有些书上叫做直接量。
我们先来学习数字的字面量,和字符串的字面量。剩余的字面量类型,我们日后遇见再介绍

1.2 数字的字面量

数字的字面量,就是这个数字自己,并不需要任何的符号来界定这个数字。
JavaScript中,数字的字面量可以有三种进制:

  • 10进制:普通的数字就是十进制
  • 8进制:如果以0开头、或者以0o开头、或者以0O开头的都是八进制,八进制只能用0~7来表示
  • 16进制:如果以0x 或0X开头的都是十六进制。

1. 八进制举例:

以0开头,所以就是八进制;显示的时候会以十进制显示 036 = 3*8+6=30

    console.log(036);  //30
    console.log(044);   //36
    console.log(010);   //8
    console.log(0o36); //30
    console.log(0O36); //30
    console.log(010);   //8

注意,八进制只能出现0~7这8中字符,如果表示不合法,那么JS将自动的认为你输入错了,从而用十进制进行显示:
console.log(088);//88 以0开头,按理说是八进制,但后面的数字错了,所以以十进制显示
但是以0o开头、0O开头的数字,如果后面写错了,控制台报错

2. 16进制举例:

十六进制数:0 1 2 3 4 5 6 7 8 9 a b c d e f

console.log(0xff);   //255
console.log(0x2b);  //43
console.log(0x11);  //17

小数的字面量也很简单,就是数学上的点。计算机世界中,小数称为“浮点数”,允许使用e来表示乘以10的几次幂:

console.log(5.6e5); //560000
console.log(1e-4); //0.0001
console.log(.1e-3); //0.0001

只有十进制有小数的字面量,八进制、十六进制没有小数的字面量
最后学习两个特殊的字面量:

Infinity 无穷大

试图输出一个非常大的数字:

console.log(3e45645645645645);  //infinity

至于多大的数字能生成无穷大,不同浏览器不一样,不要管,当然也可以是负无穷大

3. NaN

英语全名叫做not a number,不是一个数。比较哲学的是,这个“不是一个数”是一个数字字面量

console.log(0/0);

简单得说就是用不是数字字面量或数字字符串参与运算,或者不符合运算法则的结果就是NaN
总结一下,数字字面量有 整数字面量(十进制、16进制、八进制),浮点数字面量(要记住e),Infinity,NaN

1.3 字符串

字符串是一个术语,就是人类说的语句、词。字符串的字面量,必须用双引号、单引号包裹起来。字符串被限定在同种引号之间;也即,必须是成对单引号或成对双引号。

console.log("今天天气很好")

或者

console.log('今天天气很好')

但是绝对不能

console.log('今天天气很好")

无论什么类型,只要用引号引起来以后就是字符串
如果在字符串里面要使用引号,那么必须用转义符号""转义:

console.log("老师说你像\"考拉\"一样漂亮");

1.4 变量类型

这个变量是什么类型,和赋的值有关系,而和定义的时候是没有关系的。定义的时候,都是用var关键字定义的
检测数据类型用typeof

var a = 10;
console.log(typeof a);

1.4.1 数据类型(5种)

基本类型5种:

  • number 数字类型
  • string 字符串类型
  • undefined undefined类型,变量未定义时的值,这个值自己是一种类型
  • boolean 布尔类型,仅有两个值true 和 false,讲if语句时我们细说
  • null null类型,空对象 这个值自己是一种类型,遇见时我们细说

(1) number 数字类型

var a = -100;

(2)string 字符串(无论什么类型,用引号引起来就是字符串)

 var a = '100';

注意:空字符串,也是字符串。
(3) undefined

var a;
console.log(a);   //undefined

(4) boolean 布尔值(true/false)

var a = false;

1.4.2 引用类型

所谓的引用类型就是在进行比较的时候比较的不仅是值,还有内存地址
(1)function 函数类型

var a = function () {
        console.log("Daniel!");
    };
    var b = function () {
        console.log("Daniel!");
    };
    console.log(typeof a); // function
    console.log(a === b); //false
    };

我们可以发现 虽然这两个函数长得一模一样,但是却不相等,这就是因为在定义的时候开辟了两个不同的内存,导致他们的内存地址不相等,所以值不等。
还有json,数组也是引用类型,不过,function是独立的function类型,json和数组是object类型

(2)object对象(元素节点、数组、JSON、null)

元素节点:

var oBox = document.getElementById('box');
console.log(typeof oBox); //object

数组:
数组(数组里面可以放任意的数据类型,包括数组)

var a = [1,2,3,'Daniel','好帅'];

可以通过下标的方式获取数组里面的内容,数组的下标从0开始

console.log(a[2]);    //3

通过.length获取数组的长度

console.log(a.length)   //5

类型:object

var a = [1,2,3,4];
var b = [1,2,3,4];
console.log(typeof a); //object
console.log(a === b); //false

JSON:

  • JSON,里面放置键值对,由逗号隔开,最后一个可以不加逗号
  • 键值对:由引号引起的属性 冒号 值构成
  • 就属性而言:可以不用引号,但有些后台语言不认识没有冒号的JSON,因此我们统一要求加冒号
  • 就值而言:可以是任意语句,但是一般传到后台的是字符串数据,在js自身去使用的话可以是任意类型
var a = {
            "name" : 'Daniel',
            "sex" : '男',
            "age" : 18,
            "fn" : function () { console.log("哈哈");}
        };
        console.log(a.name); //调用里面的属性 值
        console.log(a.fn());

但是,和数组不一样的是,json里没有长度这个属性,除非你定义了

console.log(shuaiGe.length); //undefined

类型:object

    var a = {
        "name" : "Daniel"
    };
    var b = {
        "name" : "Daniel"
    };
console.log(typeof a); // object
    console.log(a === b); //false

null:
在一个节点元素没有添加事件的时候,他的事件就是null

var oBox = document.getElementById('box');
console.log(oBox.onclick); //null
console.log(typeof oBox.onclick); //object

所以我们在绑定一个事件的时候想要解绑,就可以用null

var oBox = document.getElementById('#box');
    oBox.onclick = function (ev) {
        console.log("你好!");
    };
    oBox.onclick = null;

四、数学运算符

运算符(Operators,也翻译为操作符),是发起运算的最简单形式。运算符的分类见仁见智,我们的课程对运算符进行如下分类:

  • 数学运算符(Arithmetic operators)
  • 比较运算符(Comparison operators)
  • 逻辑运算符(Logical operators)
  • 赋值运算符(Assignment operators)
  • 按位运算符(Bitwise operators)
  • 条件 (三元) 运算符(Conditional operator)

1.1 数学运算符

数学运算符的正统,是number和number的数学运算,结果是number。出于面试的考虑,有一些奇奇怪怪的数学运算:
数学运算中,只有纯数字字符串、布尔值、null能够帮你进行隐式转换
- + - * / % ()

1.1.1 string → number (显示类型转换)

(1)parseInt()
parseInt就是将一个string转为一个整数,不四舍五入,直接截取整数部分。如果这个string有乱七八糟的东西,那么就截取前面数字部分。如果两个数字之间有字符串,那么只截取第一个数字。

var a = "123.12px123";
var b = parseInt(a);
console.log(typeof b); //number
console.log(b); //123

(2)parseFloat()
会截取小数点

var a = "123.12px123";
var b = parseFloat(a);
console.log(typeof b); //number
console.log(b); //123.12

1.1.2 number → string

将一个数字,与一个空字符串进行连字符运算,那么就是自动转为字符串了,不仅是数字适用,其他类型要转换成字符串也适用

var a = 123;
var b = a + "";
console.log(b); //123
console.log(typeof b);  //string

1.1.3 toString()

将其他类型转换为string类型

var str4 = 100;
console.log(typeof str4.toString()); //string

1.1.4 隐式转换

就是没有写parseInt()、parseFloat()自己帮你转格式

console.log(3 * "8"); //24
console.log("3" * "8"); //24
console.log("48" / "2"); //24
console.log("24" % 55); //24
console.log(3 * null);  //0   隐式转换的时候null将被转为0
console.log(3 * false);  //0  隐式转换的时候false将被转为0
console.log(3 * true);  //3  隐式转换的时候true将被转为1
// 不纯的字符串和undefined是不能帮你进行隐式转换的,结果都是NaN
console.log(3 * "8天"); //NaN 数学运算中,不纯的字符串没法隐式转换
console.log(3 * undefined); //NaN  数学运算中,undefined不能进行隐式转换

加号比较特殊,加号两边都是数字类型或者数字类型的字符串的时候,那么就是数学加法;两边不都是数字或者数字类型的字符串的时候,那么就是字符串的拼接,结果是字符串。

var sum = 3 + 4; //7

以上是运算

console.log("你" + "好"); //你好
var sum = "3" + "4"; //34

这种就是字符串的拼接,所以,加号没有隐式类型转换

总结

  • 无论哪种运算,只要出现了undefined参与运算,结果都是NaN。
  • 然后"4"、false、true、null都能进行隐式转换。
  • 加号比较特殊,面对"4"没有隐式转换的

1.1.5 取余 %

两个值相除的余数

var a = 13 % 5;
console.log(a);   //3

13除以5 商 2 余3, 所以结果为3

1.2 关系运算符

<img src="img/1.jpg" alt="Daniel的媳妇儿,你们的师娘!" id="box" width="200" >
  >   大于
  <   小于
  >=  大于等于
  <=  小于等于
  ==  等于
  !=  不等于
  === 全等于
  !== 不全等

1.2.1关系运算符的正统,number和number进行数学运算,得到的答案boolean

console.log(8 > 5);
console.log(7 < 4);

(1)= 等号 赋值

var a = 10; //将10赋值给a

(2)== 等等 等于

var a = 10;
var b = "10";
console.log( a == b );  //true

(3)=== 全等 数据类型判断值和类型 引用类型判断内存地址和值

var a = "3",var b = 3;
console.log( a === b );  //false

1.2.2 不正统的关系运算,为了面试

(1)string 和 string 比较的就是字符编码顺序
字符编码顺序 à 数字、大写字母、小写字母

"a" < "b" //true
"A" < "B" //true
"A" < "a" // true ,大写字母在字符集里面是在小写字母前面
"1" < "A"   //true ,数字在字母前端
"blank" < "blue"   //true   因为一位一位比,直到比出大小
"25678" < "111111111"    //false  因为是string和string比,比的是字符编码顺序 所以一位一位的比

(2)与数字进行关系运算时,纯数字字符串被转为数字,null转换为0,true转换转为1, false转换为0 (隐式类型转换)

注意的是:null不能进行和0的相等判定

null < 0.00001   //true
null > -0.0001   //true
null == 0   //false  
false == 0   //true
true == 1 //true

NaN不等于自己,不全等于自己

NaN == NaN   //false
NaN === NaN   //false
NaN != NaN //true
NaN !== NaN //true

string 和 number比,string会被隐式转换为number

console.log( "234" < 235 ); //true

要注意的是,不要出洋相,不能连续使用关系运算符!!
2 > 2 > 1
的值是多少?

解:原式=(3>2) >1 = true > 1 = false (因为true会被当做1来与1进行比较)

也就是说,不能连续使用关系运算符!!因为一旦连续使用了,实际上还是从左至右计算,所以就有上一步的boolean参与了下一步的运算。
如果想要使用连续关系运算:
1<2 && 2<3

1.3 逻辑运算符

逻辑运算符就三个:

  • && 逻辑与运算
  • || 逻辑或运算
  • ! 逻辑非运算

正统来说,参与逻辑运算的是boolean和boolean,得到的结果也是boolean

1.3.1 && 与运算符

都真才真 有假就假 “短路语法”:a&&b a真抛出b a假抛出a

console.log(1 && 2); //2
console.log(false && 2); //false

1.3.2 || 或运算符

有真就真,都假才假 “短路语法”: a || b a真抛出a a假抛出b

console.log(1 || 2); //1
console.log(false || 2); //2

1.3.3 ! 非运算符

取反

console.log( !1 ); //false
console.log( !false ); //true

1.4 赋值运算符

  • = 赋值
  • += 加等于
  • -= 减等于
  • *= 乘等于
  • /= 除等于
  • %= 模等于
  • ++ 加加
  • -- 减减

赋值运算的参与者,一定是变量
(1)+=

var a = 1;
a += 2;        //这行语句等价于a = a + 2;
console.log(a);   //3

(2)/=

var b = 6;
b /= 3;   //等价于b = b / 3
console.log(b); //2

(3)%=

var c = 100;
c %= 10; //等价于c = c % 10;
console.log(c); //0
 
var a = false + true && 13;
原式 = 0 + 1 && 13
     = 1 && 13
     = 13

(4)++

var e = 10;
e++; //等价于e=e+1
console.log(e); //11

++可以与输出语句写在一起,++写在变量前和写在变量后不是一个意思

var a = 10;
var x = a++// 先赋值 再加1
var y = ++a : // 先加1 再赋值

++有花式玩儿法,仅面试有用:

var a = 8;
console.log(4 + a++);   //12  , 先使用原来的a的值,就是4+8,输出12.然后a加1  a为9
console.log(a);     //9

(5)运算符的计算顺序:
++ -- !贴身的 →→→ 比较 →→→ 逻辑 →→→ 赋值

var a = 3 < 6 && 7 < 14; //true
原式 = true && true
    = true
var a = 1 + 2 < 3 + 3 && 3 + 4 < 2 * 7;
原式 = 3 < 6 && 7 < 14
     = 上一题
     = true
var a = false + true && 13;
原式 = 0 + 1 && 13
     = 1 && 13
     = 13
var a = 15;
false + a++ + true > 8 && 13 || 6
原式 = false + 15 + true > 8 && 13 || 6
     = 16 > 8 && 13 || 6
     = true && 13 || 6
     = 13 || 6
     = 13

1.5 Math对象方法

  1. Math.pow(x,y) x的y次幂
    Math.pow(3,4) //81
  2. Math.sqrt(x); x的根号
    Math.sqrt(81); //9
  3. Math.floor() 向下取整
    Math.floor(3.14) //3
  4. Math.ceil() 向上取整
    Math.ceil(3.14) //4
  5. Math.max() 取最大值 参数没有个数限制
    Math.max(3,4) // 4
  6. Math.max() 取最小值 参数没有个数限制
    Math.min(3,4); //3
  7. Math.random() 随机数 [0,1) 之间,取得到0,取不到1
    要取到[a,b]之间的随机整数,公式:Math.floor(Math.random()*(b-a+1) + a),比如要取[2,4]之间的整数
    Math.floor(Math.random()*(4-2+1) + 2);
  8. Math.abs() 取绝对值
    Math.abs(-2) // 2
  9. Math.round() 四舍五入
    Math.round(3.14) //3

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

JAVA云his医院管理系统源码(如何解决传统HIS的弊端、在医院管理中的具体应用场景有哪些)

开发技术&#xff1a; 前端&#xff1a;AngularNginx&#xff1b; 后台&#xff1a;JavaSpring&#xff0c;SpringBoot&#xff0c;SpringMVC&#xff0c;SpringSecurity&#xff0c;MyBatisPlus等&#xff1b; 数据库&#xff1a;MySQL MyCat&#xff1b; 基于云计算技术…

FreeRTOS事件标志组

目录 一、事件标志组的概念 1、事件标志位 2、事件标志组 二、事件标志组相关API 1、创建事件标志组 2、设置事件标志位 3、清除事件标志位 4、等待事件标志位 三、事件标志组实操 1、实验需求 2、CubeMX配置 3、代码实现 一、事件标志组的概念 1、事件标志位 表…

【Windows】回忆Win98

回忆Win98&#xff0c;又看到了这个Excel界面&#xff0c;上次还是十多年前的计算机课上 1、安装环境 Win11家庭版,23H2,VMware Workstation Pro 16 , 2、安装步骤及参考 虚拟机里的硬盘设置成SATA&#xff08;否则各种错误&#xff09;&#xff0c;安装MSDOS7.1&#xff…

【Java 演示灵活导出数据】

演示灵活导出数据 &#x1f389;&#x1f389;&#x1f389;&#x1f389;&#x1f389;&#x1f389;【小吴小吴bug全无开通公众号】关注公众号获取第一时间博客动态 背景今天临时起兴打开稀土掘金导航栏看到页面推广gitee项目恰巧最近也在学习python了解到python爬虫很厉害&…

eNSP PRO全面安装教程来了(文末附下载方式)

华为eNSP PRO已经全面开放了&#xff0c;这意味着用户可以自由地访问和使用这个模拟器&#xff0c;来进行以下活动&#xff1a; 「学习和培训」&#xff1a;对于正在准备华为认证&#xff08;如HCIA、HCIP、HCIE&#xff09;的专业人士来说&#xff0c;eNSP PRO提供了一个实际…

129.哈希表:有效的字母异位词(力扣)

242. 有效的字母异位词 - 力扣&#xff08;LeetCode&#xff09; 题目描述 代码解决以及思路 这个方法的时间复杂度为O(N)&#xff0c;其中N是字符串的长度&#xff0c;空间复杂度为O(1)&#xff08;因为辅助数组的大小是固定的26&#xff09;。 class Solution { public:bo…

MySQL、JDBC复盘及规划

数据库仍有习题尚未做完&#xff0c;策略从一天做完改为每天5到10题&#xff0c;以此达到掌握和复习的效果&#xff0c;JDBC的六部仍需每天练习&#xff0c;从明天开始正式进行JavaWeb的学习&#xff0c;预计持续到七月中旬&#xff0c;还会完成一个书城项目&#xff0c;六月底…

听说SOLIDWORKS科研版可以节约研发成本?

近几年来&#xff0c;政府越来越重视科研带动产业&#xff0c;绩效优良的产业技术研究院对于国家和地区的学术成果转化、技术创新、产业发展等具有不可忽视的促进和带动作用。研究院会承担众多新产业的基础研究工作&#xff0c;而常规的基础研究需要长期的积累&#xff0c;每个…

虚拟化软件栈面临的安全威胁主要涉及几个方面

1.基于虚拟层&#xff08;Hypervisor&#xff09;的攻击&#xff1a;VM Escape&#xff1a;攻击者利用虚拟化软件允许多个操作系统共享单个硬件处理器的漏洞。这使得黑客可以在受控制的虚拟层上攻击宿主机上的每个虚拟机。 VM sprawl&#xff1a;当网络上的虚拟机数量超过管理…

(done) 关于 pytorch 代码里常出现的 batch_first 到底是啥?

参考文章&#xff1a;https://pytorch.org/docs/stable/generated/torch.nn.utils.rnn.pad_sequence.html 首先看参考文章里的解释&#xff0c;如下图 从文章描述来看&#xff0c;当 batch_first True 时&#xff0c;输出的张量的 size 是 B x T x *。当 batch_first False…

Vue实战技巧 —— 企业开发实战中的常见疑难问题

Vue企业开发实战中的常见疑难问题 1. 解决Vue动态路由参数变化&#xff0c;页面数据不更新2. vue组件里定时器销毁问题3. vue实现按需加载组件的两种方式4. 组件之间&#xff0c;父子组件之间的通信方案5. Vue中获取当前父元素&#xff0c;子元素&#xff0c;兄弟元素6. 开发环…

JVM 双亲委派机制详解

文章目录 1. 双亲委派机制2. 证明3. 优势与劣势 1. 双亲委派机制 类加载器用来把类加载到 Java 虚拟机中。从JDK1.2版本开始&#xff0c;类的加载过程采用双亲委派机制&#xff0c;这种机制能更好地保证 Java 平台的安全。 1.定义 如果一个类加载器在接到加载类的请求时&…

最新极空间部署iCloudpd教程,实现自动同步iCloud照片到NAS硬盘

【iPhone福利】最新极空间部署iCloudpd教程&#xff0c;实现自动同步iCloud照片到NAS硬盘 哈喽小伙伴们好&#xff0c;我是Stark-C~ 我记得我前年的时候发过一篇群晖使用Docker部署iCloudpd容器来实现自动同步iCloud照片的教程&#xff0c;当时热度还很高&#xff0c;可见大家…

MySQL旧表做分区流程

1. 为什么做分区 数据库分区是将数据库中的数据划分成独立的部分&#xff0c;每个部分称为一个分区。分区可以根据特定的标准&#xff0c;如范围、列表或哈希值&#xff0c;将数据分隔到不同的物理存储位置中。数据库表分区可以在多种情况下提供显著的好处。以下是一些应该考虑…

如何对基本公共服务均等化进行统计监测

党的十九大指出“履行好政府再分配调节职能&#xff0c;加快推进基本公共服务均等化&#xff0c;缩小收入分配差距”&#xff0c;提出到2035年基本公共服务均等化基本实现。国务院相继于2012年和2017年发布了《国家基本公共服务体系“十二五”规划》和《“十三五”推进基本公共…

Windows里使用ollama本地大模型部署

下载 ollama官网进行下载 下载完后下一步下一步即可 安装完成后验证是否成功&#xff0c;打开命令行输入ollama&#xff0c;有该指令即安装成功 环境变量配置 配置模型下载位置 看自己电脑硬盘情况配置 打开所有ip接口访问权限 如果想要远程调用ollama接口&#xff0c;…

Output directory is not specified

场景&#xff1a;从GitHub拉取Java项目使用IDEA打开运行的时候抛出 java: 写入com.common.exception.ChatException时出错: Output directory is not specified网上大部分是说在项目结构增加编译器输出路径&#xff0c;但我在实际开发的项目的时候这里为空&#xff0c;包括我加…

测试用例设计方法:招式组合,因果判定出世

1 引言 上篇讲了等价类划分和边界值分析法&#xff0c;而这两种方法只考虑了单个的输入条件&#xff0c;并未考虑输入条件的各种组合、输入条件之间的相互制约关系的场景。基于此短板&#xff0c;因果图法和判定表法应运而生。 2 因果图法 2.1 概念及原理 2.1.1 定义 一种…

分布式光伏监控系统功能模块详解

目前&#xff0c;分布式光伏发电系统的总容量比较小&#xff0c;并且光伏电站的功率受外界环境影响容易出现大起大落的现象。这使电压调整变得很困难。光伏电站运行维护人员不足&#xff0c;长时间不保养维护会影响光伏电站的发电效率。针对上述问题&#xff0c;鹧鸪云基于无线…

汇聚荣科技:拼多多开店没有流量应该怎么办?

拼多多开店没有流量是一个常见的问题&#xff0c;许多新手商家都会遇到这样的困境。那么&#xff0c;如何解决这个问题呢?下面从四个方面进行详细阐述。 一、优化店铺和商品 首先&#xff0c;要确保店铺和商品的质量。店铺要有自己独特的风格和特色&#xff0c;商品要有高质量…