js
所有的引用类型(数组、对象、函数),都具有对象特性,即可自由扩展属性(除了“null”意外)
var obj = {};
obj.a = 100;
var arr = [];
arr.a = 100;
function fn() {}
fn.a = 100;
所有的引用类型(数组、对象、函数),都有一个proto(隐式原型)属性,属性值是一个普通的对象
console.log(obj.__proto__);//{__defineGetter__: ƒ, __defineSetter__: ƒ, hasOwnProperty: ƒ, __lookupGetter__: ƒ, __lookupSetter__: ƒ, …}
console.log(arr.__proto__);//[constructor: ƒ, toString: ƒ, toLocaleString: ƒ, join: ƒ, pop: ƒ, …]
console.log(fn.__proto__);//ƒ () { [native code] }
所有的函数,都有一个prototype(显式原型)属性,属性值也是一个普通对象
console.log(fn.prototype);//{constructor: ƒ}
所以的引用类型(数组、对象、函数),proto属性值指向它的构造函数的“prototype”属性值
console.log(obj.__proto__===Object.prototype)//true
当试图得到一个对象的某个属性时,如果这个对象本身没有这个属性,那么会去它的proto(即它的构造函数的prototype)中寻找
function Foo(name, age){
this.name = name
}
Foo.prototype.alertName = function(){
alert(this.name)
}
var f = new Foo('zhangsan');
f.printName = function(){
console.log(this.name);
}
f.printName()
f.alertName()
rn
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View
} from 'react-native';
export default class MyApp extends Component {
constructor(props){
super(props)
this.state = {times:0}
}
timePlus() {
let times = this.state.times
times++;
this.setState({
times: times
})
}
componentWillMount() {
console.log('componentWillMount');
}
componentDidMount() {
console.log('componentDidMount');
}
shouldComponentUpdate() {
console.log('shouldComponentUpdate');
return true;
}
componentWillUpdate() {
console.log('componentWillUpdate');
}
componentDidUpdate() {
console.log('componentDidUpdate');
}
render() {
console.log('render');
return (
<View style={styles.container}>
<Text style={styles.welcome} onPress={this.timePlus.bind(this)}>
Welcome to React Native!
</Text>
<Text style={styles.instructions}>
{this.state.times}次
</Text>
<Text style={styles.instructions}>
Press Cmd+R to reload,{'\n'}
Cmd+D or shake for dev menu
</Text>
</View>
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
welcome: {
fontSize: 20,
textAlign: 'center',
margin: 10,
},
instructions: {
textAlign: 'center',
color: '#333333',
marginBottom: 5,
},
});
AppRegistry.registerComponent('MyApp', () => MyApp);