六 js函数和this
js的所有代码都是由funtion组成,funtion即函数的类型。
一.函数有两种写法
-----1.定义式
function test() { //定义一个函数
console.log("function test called!!");
}
-----2.变量式
var test2 = function () {
console.log("var test2 function called!!");
};
我们可以调用typeof()查看类型
var type = typeof(test2);
console.log(type); //function
二.函数也是对象
-----1.函数既然是对象,即就可以有属性和功能。函数也可以动态的增加属性,如下:
function test() {
console.log("function test() called!!!");
}
test.user_name = "zhangsan";
console.log(test.user_name); //zhangsan
三.函数的实例化
函数的实例化也有两种方式:
---------1.直接在函数名后面加上"()" @@@@@常用这种方式
function test() {
console.log("function test() called!!!");
}
test(); //function test() called!!!
---------2.使用关键字"new"进行实例化
function test() {
console.log("function test() called!!!");
}
new test(); //function test() called!!!
四.this机制
//=====================this机制==================
function my_func(rhs, lhs) {
console.log(this, rhs, lhs);
}
//显示不确定的this
//my_func(); //console显示
//--------------显示传递this-----------
//函数名.call(this,参数...) 显示传递this
my_func.call({ 0: "jade" }, 2, 3);
//------------------------------------
var tools = {
my_func: my_func,
};
//表.key() --->this是表
tools.my_func(2, 3); //this是tools
// 相当于
tools.my_func.call(tools, 2, 3);
//强制绑定this,优先级最高
//函数.bind,不会改变原来函数对象的this,而是会产生一个新的临时的对象
//bind好了this
var new_func = my_func.bind({ name: "jade" });
new_func(3, 4);
tools.my_func = new_func;
tools.my_func(3, 4); //this是表{name:"jade"}
my_func(3, 4); //this不变,consloe
//====call与bind有什么区别呢?==
//bind最牛的地方是什么?是绑定this的时候,
//不是由调用者来决定的
new_func.call({ 0: 1 }, 3, 4); //this还是表{name:"jade"},不是{0:1}
//==================总结=============================
//在函数里面访问this,this是由调用的环境来决定的,不确定,一般不使用
//1.显示的传递this,函数.call(this对象,参数)
//2.隐式的传递this,表.key_函数(参数),this---》表
//3.bind优先级别是最高的
六 js函数和this的更多相关文章
- 通用js函数集锦<来源于网络> 【二】
通用js函数集锦<来源于网络> [二] 1.数组方法集2.cookie方法集3.url方法集4.正则表达式方法集5.字符串方法集6.加密方法集7.日期方法集8.浏览器检测方法集9.json ...
- JS函数-我调用自己试试看
前言 最近在读<JavaScript语言精粹>,对递归函数有了进一步的认识,希望总结下来: 递归是一种强大的编程技术,他把一个问题分解为一组相似的子问题,每一问题都用一个寻常解去解决.递归 ...
- 【vue】vue +element 搭建项目,将js函数变成vue的函数
demo:时间转换 1.目录 <1>在src文件夹下新建文件夹prototypefns--------在此文件夹创建util.js, <2>在prototypefns下新建文件 ...
- 浅谈js函数三种定义方式 & 四种调用方式 & 调用顺序
在Javascript定义一个函数一般有如下三种方式: 函数关键字(function)语句: function fnMethodName(x){alert(x);} 函数字面量(Function Li ...
- 如何编写高质量的 JS 函数(1) -- 敲山震虎篇
本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/7lCK9cHmunvYlbm7Xi7JxQ作者:杨昆 一千个读者,有一千个哈姆雷特. 此系列文 ...
- 如何编写高质量的 JS 函数(2) -- 命名/注释/鲁棒篇
本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/sd2oX0Z_cMY8_GvFg8pO4Q作者:杨昆 上篇<如何编写高质量的 JS 函数 ...
- 常用 JS 函数
各种业务开发都离不开对数据的处理,然而遇到的很多数据都是不好处理的.这个时候就需要寻求搜索引擎的帮助.这种方法效率是非常低下的,而且根据作者的个性不能保证其对自己的口味.因此这篇文字包含了一份 JS ...
- 如何编写高质量的 JS 函数(3) --函数式编程[理论篇]
本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/EWSqZuujHIRyx8Eb2SSidQ作者:杨昆 [编写高质量函数系列]中, <如何 ...
- (day65、66)Vue基础、指令、实例成员、JS函数this补充、冒泡排序
目录 一.Vue基础 (一)什么是Vue (二)为什么学习Vue (三)如何使用Vue 二.Vue指令 (一)文本指令 (二)事件指令v-on (三)属性指令v-bind (四)表单指令v-model ...
随机推荐
- navicat连接oracle失败
正常是成功的,失败的话,就是oci.dll的问题 在这边下载: https://www.oracle.com/technetwork/topics/winsoft-085727.html 然后找到对应 ...
- quartz实现定时任务
一个定时的demo 引入maven依赖: <dependency> <groupId>org.quartz-scheduler</groupId> <arti ...
- mvn install package区别
package是把jar打到本项目的target下,而install时把target下的jar安装到本地仓库,供其他项目使用
- 递归、嵌套for循环、map集合方式实现树形结构菜单列表查询
有时候, 我们需要用到菜单列表,但是怎么样去实现一个菜单列表的编写呢,这是一重要的问题. 比如我们需要编写一个树形结构的菜单,那么我们可以使用JQuery的zTree插件:http://www.tre ...
- QT4.5.3移植到hi3536
QT版本:qt-embedded-linux-opensource-src-4.5.31.添加交叉编译(1)copy qt-embedded-linux-opensource-src-4.5.3/mk ...
- vue-router重新定向、redirect与alias区别
redirect app.vue <router-link to="/goParams/918/i like vue">goParams</router-link ...
- docker+Nexus Repository Manager 搭建私有docker仓库
使用容器安装Nexus3 1.下载nexus3的镜像: docker pull sonatype/nexus3 2.使用镜像启动一个容器: docker run -d -p 8081:8081 -p ...
- Windows XP解决显示桌面图标消失的问题
1.依次单击“开始”,“运行”,在运行对话框中输入regsvr32 /n /i:u shell32.dll,按回车键 2.弹出“shell32.dll中的DllInstall成功”的窗口,表明已将数据 ...
- TCP、UDP和HTTP详解
http:是用于www浏览的一个协议.tcp:是机器之间建立连接用的到的一个协议. 1.TCP/IP是个协议组,可分为三个层次:网络层.传输层和应用层.在网络层有IP协议.ICMP协议.ARP协议.R ...
- React篇-子组件调用父组件方法,并传值
react 中子组件调用父组件的方法,通过props: 父组件: isNote(data){} <div className="tabC01"> <FTab ta ...