2023年4月 继续学习JS(3)

This article is categorized as "Garbage" . It should NEVER be appeared in your search engine's results.


仍然参考《JavaScript高级程序设计(第4版)》

2024-01-18补充:由于本篇笔记没写完,而且从此断了半年的javascript学习,所以就这么放着吧


Javascript的数据类型

全部数据类型

6种简单数据类型:Undefined, Null, Boolean, Number, String, Symbol

1种复杂数据类型:Object

具体见P30


undefined和null

Javascript高级程序设计第4版 P31~P33

有关undefined:

// 没有声明过的变量直接使用会抛出错误

console.log(a);
// a没有声明过,所以这里抛出错误



// 声明但没有初始化的变量默认为undefined
var b;
console.log(b); // undefined
console.log(b === undefined) // true

// 虽然可以使用if(b)或if(!b)的方法判断undefined,但不推荐,因为可能会和null的效果混淆
// 不推荐使用if(b)
// 不推荐使用if(!b)
// 推荐使用使用if(b === undefined)
if(b === undefined){
// do something
}

有关null:

// "在定义将来要保存对象值的变量时,建议使用 null 来初始化,不要使用其他值。" (P32)

var b = null;
// 和undefined一样,虽然可以使用if(b)或if(!b)的方法判断null,但不推荐,因为可能会和undefined的效果混淆
// 不推荐使用if(b)
// 不推荐使用if(!b)
// 推荐使用if(b === null)
if(b === null){
// do something
}


// 特别注意:
console.log(null === undefined)  // false
console.log(null == undefined)  // true,尽量避免使用

Object类型

从书本的第6章开始看

注:翻译问题:Object虽然存在.keys()和.values()这样的函数,但实际上的称呼应该是:property(属性),property value.

和python的dictionary非常相似,用法也很相似,并且key区分大小写(python dict的key也区分大小写):

let person = new Object();
person.name = "Ashley";
person.NAME = "ASHLEY";
person.id = 15243;
person.ID = 12222;
console.log(person)

// { name: 'Ashley', NAME: 'ASHLEY', id: 15243, ID: 12222 }

python版

访问方式:可以使用点 . 访问,以及中括号 ["key"] 访问(就像python一样);

let person = new Object();
person.name = "Ashley";
person.id = 15243;
console.log(person.id)
// 15243
console.log(person['id'])
// 15243
console.log(person["name"])
// Ashley

两种访问方式的区别在于:当涉及到:使用变量访问,或者key包含空格等关键字的时候,只能使用中括号。

let person = new Object();
person.name = "Ashley";
person.id = 15243;
person.age = 20;

let key1 = "name";
console.log(person.key1);
// undefined 
console.log(person[key1])
// Ashley

接下来比较一些js object和python dict的区别

区别1:js的Object只能使用String作为key,不能使用Number或者其他东西,但你可以写初始化语句(对象字面量表示法)的时候使用Number,只是会被js引擎自动转换成String:

let person2 = new Object();
person2.666 = "Ashley"; // 错误
console.log(person2);

/*
evalmachine.<anonymous>:2
person2.123="Ashley"
       ^^^^

SyntaxError: Unexpected number
*/
person = {
    6: 1234565,
    name: "Ashley"
}
console.log(person)
// { '6': 1234565, name: 'Ashley' }

区别2:js的Object可以插入函数作为key:

let person = new Object();
person.name = "Ashley"
person.action = function() {
    return 'Ashley, RUN!';
}
console.log(person)
// { name: 'Ashley', action: [Function (anonymous)] }


console.log(person.action) // 这句话并没有在调用函数
// [Function (anonymous)]


console.log(person.action())
// Ashley, RUN!

接下来讨论一些常见操作:

判断是否存在key:

访问不存在的key时会返回 undefined ,所以可以直接判断  === undefined 

let person = new Object();
person.name = "Ashley";
person.id = 12345;
if (person.age === undefined) {
    person.age = 20;
} else {
    person.age += 1;
}

列出所有keys:

使用 Object.keys(xxxx) 

let person = new Object();
person.name = "Ashley";
person.id = 12345;
console.log(Object.keys(person))
// [ 'name', 'id' ]

列出所有values:

使用 Object.values(xxxxx) 

let person = new Object();
person.name = "Ashley";
person.id = 12345;
console.log(Object.values(person))
// [ 'Ashley', 12345 ]

枚举所有keys,然后根据key来访问value:

let person = new Object();
person.name = "Ashley";
person.id = 15243;
person.age = 20;

for (let key in person) {
    console.log(person[key]);
}

/*
Ashley
15243
20
*/

或者:(这里涉及到对Array的遍历要使用 of 

let person = new Object();
person.name = "Ashley";
person.id = 15243;
person.age = 20;

for (let key of Object.keys(person)) {
    console.log(person[key]);
}

/*
Ashley
15243
20
*/

Array(对比Python List)

接下来的笔记主要对比javascript Array和python list的相似/不同之处。

和python list真的非常相似了,但还是有一些不同:


不同1:

来自🔗 [2023-02-07 - Truxton's blog] https://truxton2blog.com/2023-02-07/

这种写法是合规的:

var a = [];
a[10] = 100;
console.log(a[10]); // 100
console.log(a[0]); // undefined
console.log(a); // [ <10 empty items>, 100 ]

而python就不能这么做,当然python也可以稍微变一下代码实现相似的功能。


不同2:

除了中括号,js还可以这样创建数组:

let arr = new Array();
let arr2 = new Array(100);

不同3:

python可以使用 lst = [0] * 100 这样的方法创建一个包含100个0的list

js要麻烦点:🔗 [Most efficient way to create a zero filled JavaScript array? - Stack Overflow] https://stackoverflow.com/questions/1295584/most-efficient-way-to-create-a-zero-filled-javascript-array

new Array(len).fill(0);

不同4:越界访问

python越界访问当然会报错,而js不会:

let arr = [0, 1, 2, 3, 4]
console.log(arr[100])
// undefined

这就使得某些判断代码要写得更小心


不同5:修改长度

js可以直接修改array的长度并产生效果:

let arr = [0, 1, 2, 3, 4]
arr.length = 3
console.log(arr)
// [ 0, 1, 2 ]

接下来讨论一些常见的array操作:


(断了,2024年1月才重新捡起来,后续的内容可能补充在2024-01-18之后的笔记里)



 Last Modified in 2024-01-18 

Leave a Comment Anonymous comment is allowed / 允许匿名评论