慕课网前端工程师JavaScript学习笔记

2021-08-06 20:35:31 阅读：247 来源： 互联网

标签：慕课 false log JavaScript 笔记字符串 console true String

附加学习：
https://www.w3school.com.cn/js/index.asp

01 JS语法与变量

认识输出语句

alert 弹出警告框

alert('aaa');
alert('bbb');
alert('ccc');

会打断程序运行，从第一条依次弹出

console.log 控制台输出

console.log('111');
console.log('222');
console.log('333');

不会打断程序运行，有多少条显示多少条

document.write() 写入 HTML 输出

document.write('aaa')

会重写当前html内容

innerHTML 写入 HTML 元素

document.getElementById("demo").innerHTML = 5 + 6;

变量：变量是存储数据值的容器。

字符串，用引号扩起来的就是字符串，可以是汉字、字母+汉字、字母+汉字+数字，甚至运算符

var b = '字符串', b1 = 'aaa', b2 = '111', b3 = '111字符串', b4 = '111+aaa+字符串';

输出字符串变量

console.log(b);
console.log(b1);
console.log(b2);
console.log(b3);
console.log(b4);

附加知识点

如果变量命名一致，将只输出相同变量命最后一个的赋值；
变量命名只能是一个词，由字母、数字、下划线、$组成，但不能以数字开头；不能使用js函数名或关键词，例如alert；大小写是不同的变量命名，a和A不相同；

输出自定义字符串，而不是变量a

console.log('a');

输出变量+字符串

console.log(a + 'a');

输出运算结果

console.log(a + a1)

常见命名错误

var error1 = 2m;
以数字开头错误

var error2 = a#3;
使用非下划线的符号错误

优秀的命名方法

下划线：

first_name, last_name, master_card, inter_city.

驼峰式大小写：

FirstName, LastName, MasterCard, InterCity.

02 数据类型与转换

数据类型 - 简单类型

五种可包含值的数据类型：

数字（number）
例如：1、2.5、1000、-1、2e3
字符串（string）
例如：'aaa'、'111'、'字符串'、'aaa字符串'、'1111+字符串'
布尔（boolean）
例如：true、false
对象（object）
函数（function）

有三种对象类型：

对象（Object）
日期（Date）
数组（Array）

同时有两种不能包含值的数据类型：

undefined
例如：声明变量后没有赋值、或者没有此变量，会出现undefined
null
表示是“空”对象，当需要将对象、数组销毁或删除事件监听时，通常会将他们设置为null

数据类型检测 typeof

var a = 111, b = '字符串', c = true, d;

console.log(typeof a);
console.log(typeof b);
console.log(typeof c);
console.log(typeof d);

注意点：

NaN 的数据类型是数值

数组的数据类型是对象

日期的数据类型是对象

null 的数据类型是对象

未定义变量的数据类型是 undefined

尚未赋值的变量的数据类型也是 undefined
无法使用 typeof 去判断 JavaScript 对象是否是数组（或日期）。

数据类型转换

其他值→数字

Number('')

将字符串、布尔值、undefined、null转换为数字类型

var n = Number('123');
console.log(n);
console.log(typeof n);

例：

Number('123');  // 123
Number('123.4');  //123.4
Number('2021年');  // NaN
Number('2e3');  // 2000
Number('');  // 0

Number('true');  // 1
Number('false');  // 0

Number('undefined');  // NaN
Number('null');  // 0

parseInt('');

截取非数字字符的第一个数字，并将其转化成整数(不四舍五入)。

var pi = parseInt('3.14');
console.log(pi);
console.log(typeof pi);

例子：

parseInt('3.14');  // 3 只获取3
parseInt('3.99');  // 3 只获取3，并且不四舍五入
parseInt('3.14圆周率');  // 3 所有文字、小数都被截掉
parseInt('圆周率3.14');  // NaN 如果字符串不是以数字开头，则转为NaN

parseFloat('');

截取所有数字字符

var pf = parseFloat('3.14');
console.log(pf);
console.log(typeof pf);

例子：

parseFloat('3.14');  // 3.14
parseFloat('3.99');  // 3.99
parseFloat('3.14圆周率');  // 3.14 所有文字都被截掉
parseFloat('圆周率3.14');  // NaN 如果字符串不是以数字开头，则转为NaN

其他值→字符串

String();

把任意类型的数字、文字、变量或表达式转换为字符串

var s = String(123);
console.log(s)
console.log(typeof s)

例：

String(123);  // '123'
String(123.4);  // '123.4'
String(2e3);  // '2000'
String(NaN);  // 'NaN'
String();  // ''

String(true);  // 'true'
String(false);  // 'false'

String(undefined);  // 'undefined'
String(null);  // 'null'

toString()

几乎所有值都有toString()方法，只是和String()用法不同，且无法转换null和undefined。

var a =1;
var b = 123;
String(a);  // '1'
typeOf(a);  // String
typeOf(b);  // Number
b.toString();  // '123'
typeOf(b);  //String;

其他值→布尔值

Boolean();

将其他值转化成true、flase类布尔值

var bl = Boolean(123);
console.log(bl)
console.log(typeof bl)

例子：

Boolean(123);  // true 0和NaN转为false，其他数值都转为true
Boolean(0);  // false
Boolean(NaN);  // false
Boolean(Infinity);  // true
Boolean(-1);  // true

Boolean('');  // false 空字符串转为false，其他字符串转为true
Boolean('abc');  // true
Boolean('false');  // true

Boolean(undefined);  // false
Boolean(null);  // false

JavaScript 类型转换表

数据类型 - 复杂类型

复杂类型包含：数组、对象、函数

数组举例

[1,2,3]

对象举例

{ a : 1, b : 2}

函数举例

function (){
  
}

表达式与操作符

表达式的种类：算数表达式、关系表达式、逻辑表达式、赋值表达式、综合表达式

算术表达式：

+  // 加
-  // 减
*  // 乘
/  // 除
%  // 取余

注意点：
运算顺序和数学一致：先运算括号内的 → 乘除 → 加减
+号有“加法”、“连字符”两个用途，若加号两边操作的都是数字则为加法运算，否则为连字符

关系表达式：

>    // 大于
<    // 小于
=    // 等于
>=   // 大于等于
<=   // 小于等于
==   // 等于
!=   // 不等于
=== // 全等于
!== // 不全等于

例子：

/* 相等和全等 */
5 == '5';  // true
5 === '5'  // false

1 == true;  // true
1 === true;  // flase

/* 特殊值的相等关系 */
null == undefined;  // true
null == 0;  // false
NaN == NaN  // false

逻辑表达式：

!  // 非，表示不，也可称为置反运算，置反的运算结果一定是布尔值
&&  // 且，表示并且，也可称为与运算，口诀：都真才真
||  // 或，表示或者，也可称为或运算，口诀：有真就真

!非使用例子&示意：

!true  // false
!false  // true
!0  // true
!!true  // true

&&且使用例子&示意：

true && true  // true
true && false  // false
false && true  // false
false && false  // false

||或使用例子&示意：

true || true  // true
true || false  // true
false || true  // true
false || false  // false

逻辑运算的优先级顺序：'!'非 → '&&'且 → '||'或

赋值表达式：

=  // 赋值

/* 自增自减运算 */
++  // 自增 在原来的基础上+1
--  // 自减 在原来的基础上-1

/* 快捷赋值：在原基础上进一步进行运算 */
+=  // a += 5;  等同于 a = a + 5;
-=  // a -= 5;  等同于 a = a - 5;
*=  // a *= 5;  等同于 a = a * 5;
/=  // a /= 5;  等同于 a = a / 5;
%=  // a %= 5;  等同于 a = a % 5;

自增自减运算例子：

var a = 3;
a++;  // 等同于 a = a + 1;
console.log(a);  // 4

a++ ：存储新值，用旧值（上一个值）来计算，也就是输出旧值；
++a ：存储新值，用新值（当前的值）来计算，也就是输出新值；
详细解答：https://blog.csdn.net/Lazy_Life/article/details/81214249

快捷赋值例子：

var a = 3;
a += 5;  // 等同于 a = a + 5;
console.log(a);  // 8

综合表达式：

运算顺序：非运算 → 数学运算 → 关系运算 → 逻辑运算

switch

三元运算

for语句的用法

标签：慕课,false,log,JavaScript,笔记,字符串,console,true,String
来源： https://www.cnblogs.com/inzens/p/JavaScript.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9