10.15 冯娜
学习日志
今天整理了对象和函数的创建方式、vue的事件绑定
一、对象的创建方式（6种）
1、字面量方式：
var car={
cname:'轿车',
width:'1.5m',
hiegth:'2m',
run:function(){
console.log('跑')
}
}
console.log(car.cname);
car.run();
2、表达式方式：
var person=new Object();//必须是 new
3、工厂模式（Object关键字）推荐使用
function school(sclass,teacher){ //一定要传参
var obj=new Object();
obj.sclass=sclass;
obj.teacher=teacher;
obj.say=function(){
console.log('hi')
}
return obj;//一定要return
}
var school1=new school(50,300);
console.log(school1.teacher); //用新创建的对象名调用
school1.say();//用新创建的对象名调用
4、使用构造函数
function Dog(name,age){ //传参的重要性！！！！
this.name=name;
this.age=age;
this.say=function(){
console.log('汪汪汪')
}
}
var Dog1=new Dog('乐乐','2岁啦');
console.log(Dog1.name);
Dog1.say();
5、原型模式（prototype关键字）
function cat(){
cat.prototype.name='胖胖';
cat.prototype.age='1岁啦';
cat.prototype.hobby=function(){
console.log('看铲屎官喜欢我又干不掉我的样子')
}
}
var cat1=new cat();
console.log("我叫："+cat.prototype.name);
cat1.hobby()
6、混合模式（原型和构造函数）
function book(name,price){//既然有构造函数，就不能忘记传参
this.name=name;
this.price=price;
}
book.prototype.sell=function(){ //使用原型创建方法
console.log('我可以给大家带来宇宙上的知识哦~')
}
var yuzhong=new book('宇宙的奥秘','￥49.9')
console.log(yuzhong.name,yuzhong.price)//用新创建的对象名调用
yuzhong.sell();
二、创建函数（3种）
1、函数声明（命名函数）
function sum1(num1,num2){
var sum=num1+num2;
console.log(sum);
}
sum1(1,2);
2、函数表达式（函数字面量）也就是匿名函数
var getSum=function(num1,num2){ //这里的getSum是变量名
return num1+num2;
}
console.log(getSum(2,3))
3、构造函数(参数必须加引号)不需要return
(1)
var Sum=new Function('a','b','return a+b');{
}
console.log(Sum(4,5))
三、事件绑定：
（1）body部分：
<div>
<button v-on:click='num++'>点击</button>
<button @click="num++">点击加一</button>
<button v-on:click="handle">点击2</button>
<button @click="handle()">点击三</button>
<button v-on:click="handle(123)">点击传参</button>
</div>
</div>
（2）js部分：
var vm = new Vue({
el: '#app',
data: {
num: 0
},
methods: {
handle: function() {
console.log(this === vm)
this.num++;//this就是vm 也就是vue的实例对象
}
}
})
事件绑定传参：
methods:{
handle: function(p,p1) {
console.log(p,p1)
this.num++;
}
}
近期评论