2409js,学习js1
alert("Hello");
[1, 2].forEach(alert);
/**/
不支持嵌套
.
变量名称
有两个限制
:
1,名称必须仅包含字母,数字
或$
和_
符号.
2,第一个字符
不能是数字
反引号串
:
let name = "哈哈";
alert( `你好, ${name}!` );
alert( `结果是${1 + 2}` );
调用typeof
(运算符)将返回一个类型名称串
.
提示函数:result = prompt(title, [default]);
转换:
value = String(value);
let num = Number(str);
两个运算:%(余)
与**(幂)
.
如果任何操作数
是串,则另一个操作数也会转换为串.
alert( '1' + 2 ); // "12"
alert( 2 + '1' ); // "21"
链接赋值:
a = b = c = 2 + 2;
常见位操作:
和(&)
或(|)
异或(^)
非(~)
左移(<<)
右移(>>)
零填充右移(>>>)
.
===
为严格相等,不仅值
,而且类型相等
!
??
a??b
的结果是:
如果定义了a
,则a
,
如果未定义a
,则为b
.
||
返回第1个真
的.
??
返回第1个定义了
的值.只在null/undefined
时用默认值
.
let height = 0;alert(height || 100); // 100
alert(height ?? 100); // 0
//一般,0高度为有效值.
可带标签退出:
outer: for (let i = 0; i < 3; i++) {for (let j = 0; j < 3; j++) {let input = prompt(`Value at coords (${i},${j})`, '');// 退出2层循环.if (!input) break outer; // (*)// 处理...}
}alert('Done!');
continue
,也可以用.
label: {// ...break label; // 工作// ...
}
//如下
break label; // 下跳,不工作!label: for (...)
猜
,可以为串
:
switch(x) {case 'value1': // if (x === 'value1')...[break]case 'value2': // if (x === 'value2')...[break]default:...[break]
}
Js
可以看见后面函数
:
sayHi("John"); // Hello, Johnfunction sayHi(name) {alert( `Hello, ${name}` );
}
对象
let user = {};// 置
user["likes birds"] = true;
// 取
alert(user["likes birds"]); // 真
// 删
delete user["likes birds"];
计算属性
let fruit = prompt("Which fruit to buy?", "apple");let bag = {[fruit]: 5,
};alert( bag.apple ); // //等价于
let fruit = prompt("Which fruit to buy?", "apple");
let bag = {};
bag[fruit] = 5;
区分in
let obj = {test: undefined
};alert( obj.test ); // 它未定义,还是没有?
alert( "test" in obj );
常与引用
const user = {name: "John"
};user.name = "Pete"; // (*)
alert(user.name); // Pete
复制对象
let user = {name: "John",age: 30
};let clone = Object.assign({}, user);alert(clone.name); // John
alert(clone.age); // 30
深度克隆
let user = {name: "John",sizes: {height: 182,width: 50}
};let clone = structuredClone(user);alert( user.sizes === clone.sizes );
// 不同对象.user.sizes.width = 60;
// 更改
alert(clone.sizes.width); // 不相关.
let html = document.querySelector('.elem').innerHTML;
// error if it's null
如果既不是null
且不是undefined
,则说它"存在".
换句话说,?.prop
中:
如果存在值
,作按值.prop
工作,
否则(当值
为undefined/null
时),它返回undefined
.
let user = {}; // 无地址alert( user?.address?.street ); //未定义,但无错.
可用:
let html = document.querySelector('.elem')?.innerHTML;
替换上面.
调用可能不存在的函数:
let userAdmin = {admin() {alert("I am admin");}
};let userGuest = {};
userAdmin.admin?.(); // I am admin
userGuest.admin?.();
可能不存在的
let key = "firstName";let user1 = {firstName: "John"
};let user2 = null;alert( user1?.[key] ); // John
alert( user2?.[key] ); // undefined
存在则删
delete user?.name;
符号
let id1 = Symbol("id");
let id2 = Symbol("id");alert(id1 == id2); // false
let id = Symbol("id");
alert(id.toString());//显式转换为串
不是
let id = Symbol("id");let user = {name: "John",[id]: 123 // 不是"id": 123
};
for in 不访问符号
let id = Symbol("id");
let user = {name: "John",age: 30,[id]: 123
};for (let key in user) alert(key);
alert( "Direct: " + user[id] );
表层克隆
let id = Symbol("id");
let user = {[id]: 123
};let clone = Object.assign({}, user);
alert( clone[id] ); // 123,会有它.
变参
function sumAll(...args) { // let sum = 0;for (let arg of args) sum += arg;return sum;
}alert( sumAll(1) ); // 1
alert( sumAll(1, 2) ); // 3
alert( sumAll(1, 2, 3) ); // 6
扩展
let arr = [3, 5, 1];
alert( Math.max(...arr) );let arr = [3, 5, 1];
let arr2 = [8, 9, 15];let merged = [0, ...arr, 2, ...arr2];
//合并.
let arr = [1, 2, 3];
let arrCopy = [...arr];
//复制数组
let obj = { a: 1, b: 2, c: 3 };
let objCopy = { ...obj };
//复制对象
类
class MyClass {// 类方法.constructor() { ... }method1() { ... }method2() { ... }method3() { ... }...
}
按钮
class Button {constructor(value) {this.value = value;}click = () => {alert(this.value);}
}let button = new Button("hello");setTimeout(button.click, 1000); // hello
继承
class Animal {constructor(name) {this.speed = 0;this.name = name;}run(speed) {this.speed = speed;alert(`${this.name} runs with speed ${this.speed}.`);}stop() {this.speed = 0;alert(`${this.name} stands still.`);}
}let animal = new Animal("My animal");
兔子继承:
class Rabbit extends Animal {hide() {alert(`${this.name} hides!`);}
}let rabbit = new Rabbit("White Rabbit");rabbit.run(5); // 5速度.
rabbit.hide(); // 隐藏!
根据条件生成类
function f(phrase) {return class {sayHi() { alert(phrase); }};
}class User extends f("Hello") {}
new User().sayHi(); // Hello
覆盖方法
class Animal {constructor(name) {this.speed = 0;this.name = name;}run(speed) {this.speed = speed;alert(`${this.name} runs with speed ${this.speed}.`);}stop() {this.speed = 0;alert(`${this.name} stands still.`);}}class Rabbit extends Animal {hide() {alert(`${this.name} hides!`);}stop() {super.stop(); // 调用父的this.hide(); // 然后停止.}
}let rabbit = new Rabbit("White Rabbit");
rabbit.run(5); // 5.
rabbit.stop(); // 不动,隐藏
默认继承
class Rabbit extends Animal {// 空的,则生成.constructor(...args) {super(...args);}
}
继承构造函数
必须调用super
才能执行其父(基本)构造函数
,否则不会为它创建对象
.
class Rabbit extends Animal {constructor(name, earLength) {super(name);this.earLength = earLength;}// ...
}
// now fine
let rabbit = new Rabbit("White Rabbit", 10);
alert(rabbit.name); // White Rabbit
alert(rabbit.earLength); // 10