Javascript 初学笔记
变量作用域
自 ES2015 起,JS 引入let 和 const 关键词定义变量的块作用域(Block Scope)。
var 仅支持全局作用域(Global Scope)和函数作用域(Function Scope);
let 支持块作用域,即严格定义作用域在花括号{}里面;
counst 不仅支持块作用域,且定义的变量无法再修改。
var i = 5;
for (var i = 0; i < 10; i++) {
// some statements
}
// Here i is 10
let i = 5;
for (let i = 0; i < 10; i++) {
// some statements
}
// Here i is 5
[更多]
循环操作
for 循环
C 风格
for (let i = 0; i < arr.length; i++) {
// do iteration
}
JS 风格
for (let val of arr) {
// loop over values of array
}
for (let key in obj) {
// loop over keys of object
}
对象(Object)
创建新对象的四种方式
Object Initializer
let brother = {
name: 'Alex',
age: 25,
sayHello: function () {
return 'Hello!' + 'my name is' + this.name;
}
}
Constructor function
function Person (name, age, gender) {
this.name = name;
this.gender = gender;
this.age = age;
sayHello: function () {
return 'Hello!' + 'my name is' + this.name;
}
}
let brother = new Person('Alex', 25, 'male');
Object Constructor
let brother = new Object({
name: 'Alex',
gender: 'male'
age: 25,
sayHello: function () {
return 'Hello!' + 'my name is' + this.name;
}
})
Object.create() method
let brother = {
name: 'Alex',
gender: 'male'
age: 25,
sayHello: function () {
return 'Hello!' + 'my name is' + this.name;
}
}
let sister = Object.create(brother);
sister.name = 'Alice';
sister.gender = 'female'
补充:
sister = Object.create(brother) 在这里实际上是以 brother 作为原型构建的,亦即:
sister.__proto__ === brother
将返回 true。
对象原型(Object Prototype)
我们刚刚创建的brother 对象的 constructor 是 Person(),而 Person() 的原型是 Object()。如果我们运行:
brother.valueOf();
将列出 brother 中所有的属性和方法。但是,Person() 中并没有 valueOf() 方法,因此可以看出实际上 Person() 实际上继承了 Object() 中的方法 valueOf()。
访问对象原型
目前主流浏览器都支持:
brother.__proto__;
自 ECMAScript 2015 开始,也可以:
Object.getPrototypeOf(brother);
可继承成员
每个对象都有个属性 prototype, 例如 Object.prototype,Person.prototype。
Object.prototype 本身是一个对象,里面是 Object 的所有可继承成员。换句话说,prototype 里面不包含的成员是无法继承的。
修改原型
增加属性
我们可以直接给对象 bother 添加属性
brother.education = 'Bachelor of Computer Science';
也可以给对象原型 Person 添加属性
Person.prototype.nationality = 'Chinese'
增加方法
我们可以直接给对象 bother 添加方法
brother.coding = function(){
return '0 warning(s), 0 error(s)';
};
也可以给对象原型 Person 添加属性
Person.prototype.play = function(){
return 'Happy';
};
Reference
原型继承(Prototype Inheritance)
现在,假设我们想从 Person 构建一个 Student 子类。
Constructor function
首先需要构造函数(constructor function):
function Student(name, age, gender, degree) {
Person.call(this, name, age, gender);
this.degree = 'Undergraduate';
}
Prototype & Constructor Reference
此时,构造函数 Student() 的原型属性(prototype property)Student.prototype 并不具有 Person 里带有的方法, 因此还需要继承 Person 的方法。
例如, sayHello() 是Person 的方法,却不在 Student.prototype 中。
修改原型
Student.prototype = Object.create(Person.prototype)
以 Person.prototype 为原型构建对象并赋给 Student.prototype 就可以继承到 Person 的方法了。
恢复构造函数
但仅仅这样会造成另一个问题。由于 Student.prototype === Person.prototype,造成了 Student.prototype.constructor === Person.prototype.constructor。因此需要将 Student 的构造函数恢复成 Student 而不是 Person。
Student.prototype.constructor = Student
这样,继承就完成了。
Reference
Pipeline
const pipe = (f1, f2) => {
return (arg) => {
const result1 = f1(arg);
return f2(result1);
}
}
let timesTwo = (a) => a*2;
let timesThree = (a) => a*3;
const pipeline = pipe(timesTwo, timesThree);
console.log(`$6 x 2 x 3 = ${pipeline(6)}`);
Reference
JS String
字符串转数字
Number(string);
parseInt(string);
parseFloat(string);
字符串截取
string.charAt(index);
string.indexOf("foo");
string.lastIndexOf("foo")
string.match("pattern");
string.replace(/regex/, "foo");
string.slice(start, end);
string.substring(start, end);
string.substr(start, length);
字符串转数字
let number = Number(string);
let intNum = parseInt(string);
let floatNum = parseFloat(string);
Reference
Written with StackEdit.