JS 中的 new 操作符
按照javascript语言精粹中所说,如果在一个函数前面带上new来调用该函数,那么将创建一个隐藏连接到该函数的prototype成员的新对象,同时this将被绑定到那个新对象上。这个话很抽象,我想用实例来让自己加深理解。
1.如果就一个函数,没有返回值,没有prototype成员,然后使用new,会是什么结果呢?如果一个函数没有返回值,那么如果不使用new来 创建变量,那么该变量的值为undefined.如果用了new,那么就是Object.说明一个函数的默认的Prototype是Object.
function Test1(str) {
this.a = str;
}
var myTest = new Test1("test1");
alert(myTest); //[object Object]
function Test1WithoutNew(str) {
this.a = str;
}
var myTestWithoutNew = Test1WithoutNew("test1");
alert(myTestWithoutNew); //undefined;
2.如果函数有返回值,但是返回值是基本类型。那么new出来的myTest还是object.因为基本类型的prototype还是Object. 而如果不使用new,那么返回值就是string的值。
function Test1(str) {
this.a = str;
return this.a;
}
var myTest = new Test1("test1");
alert(myTest); //Object
function Test1WithoutNew(str) {
this.a = str;
return this.a;
}
var myTestWithoutNew = Test1WithoutNew("test1");
alert(myTestWithoutNew); //"test1"
3。如果函数的返回值为new出来的对象,那么myTest的值根据new出来的对象的prototype而定。
function Test1(str) {
this.a = str;
return new String(this.a);
}
var myTest = new Test1("test1");
alert(myTest); //String "test1"
4。接下来我们开始讨论new中的this。如果我们给Test1的prototype中加入一个方法叫get_string(),那么get_string()中的this指的就是这个新对象。能够得到在new时候赋予该对象的属性值。
var Test2 = function(str) {
this.a = str;
}
Test2.prototype.get_string = function () {
return this.a;
};
var myTest2 = new Test2("test2");
alert(myTest2.get_string()); //“test2”
var Test2 = function(str) {
this.a = str;
}
Test2.prototype.get_string = function () {
return this.a;
};
var myTest2 = Test2("test2");
alert(myTest2)//undefined
5。如果我们修改了函数的prototype,又会发生什么样的情况呢? 那么就会发生类似继承的功能,其实就是js的伪类实现。
function Test1(str) {
this.b = str;
}
Test1.prototype.Get_Test1String = function () {
return this.b;
};
var Test2 = function(str) {
this.a = str;
}
Test2.prototype = new Test1("test1");
Test2.prototype.get_string = function () {
return this.a;
};
var myTest2 = new Test2("test2");
alert(myTest2); //Object
alert(myTest2.get_string()); //"test2"
alert(myTest2.Get_Test1String()); //"test1"
JS 中的 new 操作符的更多相关文章
- js中的new操作符与Object.create()的作用与区别
js中的new操作符与Object.create()的作用与区别 https://blog.csdn.net/mht1829/article/details/76785231 2017年08月06日 ...
- JS中的一元操作符
表达式 一元操作符 优先级 结合性 运算顺序 表达式是什么? 就是JS 中的一个短语,解释器遇到这个短语以后会把对它进行计算,得到一个结果参与运算,我们把这种要参与到运算中的各种各样的短语称为表达式. ...
- JS中的new操作符
在JS中定义一个构造函数,然后用new操作符构造对象obj,JS代码如下. function Base(){ this.name = "swf"; this.age =20; } ...
- JS中的 new 操作符简单理解
首先上一一个简单的 new 操作符实例 var Person = function(name){ this.name = name; this.say = function(){ return &qu ...
- JS中的delete操作符
首先,delete删除成功返回true,失败返回false. js代码: function wxCount ($element) { this.init($element); } wxCount.pr ...
- js中的new操作符解析
new 操作符做了以下事情: 1.创建一个对象,将对象赋值给this function Person(name, age) { console.log(this) //Person {} } let ...
- JS中void(0)操作符的使用
今天 在看源码时,发现这种写法 if(value === void(0)){ // } 以前没有见过这种写法,感觉就是判断一个变量是否有值,官网上是这样说的: void运算符 对给定的表达式进行求值, ...
- JS中的new操作符原理解析
var Person = function(name){ this.name = name; } Person.prototype.sayHello = function() { console.lo ...
- js-分享107个js中的非常实用的小技巧(借鉴保存)
转载原文:http://***/Show.aspx?id=285 1.document.write(""); 输出语句 2.JS中的注释为// 3.传统的HTML文档顺序是:doc ...
随机推荐
- .NET Core开发的iNeuOS物联网平台部署树霉派(raspbian),从网关到云端整体解决方案。助力2019中国.NET峰会。
2019 中国.NET 开发者峰会正式启动 目 录 1. 概述... 2 2. 树莓派硬件配置... 2 3. 软件信息... 3 4. Raspb ...
- vue学习面向对象,在项目中怎么用呢?
面向对象感觉很牛逼,可是在项目中怎么用呢? 我至今见到的用法,写了一个用户对象. 效果:只要执行了new User(userInfo)就会在cookie,localStorage存放数据. 所以最简单 ...
- AtomicInteger例子
AtomicInteger可以保证原子性,可见性,有序性 public class AtomicIntegerTest { private static AtomicInteger value = n ...
- Centos 7.6 安装 oracle 10.2.0.1 数据库软件
step 1: 编辑 /etc/redhat-release :内容为redhat-4 step 2: 安装32位的软件包:yum install libXp.i686 libXt.i686 li ...
- CountDownEvent 信号类来等待直到一定数量的操作完成
当主程序启动时,创建一个 CountDownEvent 类的实例,在其构造函数中指定个数操作完成发出信号,当前为2个操作完成会发出信号. /// <summary> /// 创建 Coun ...
- 简单地判断判断两矩形相交/重叠 C#
最近需要用到矩形相交算法的简单应用,所以特地拿一个很简单的算法出来供新手参考,为什么说是给新手的参考呢因为这个算法效率并不是很高,但是这个算法只有简简单单的三行.程序使用了两种方法来判断是否重叠/相交 ...
- Java集合大全
上图为整理的集合类图关系,带对号标志的为线程安全类. 区别说明: 1.List Set Map Queue的区别List: 有序,可以多个元素引用相同的对象Set: 无序,不重复,不可以多个元素引用相 ...
- 面试官:你知道Spring中有哪些可以让我们扩展的地方么
大家都知道我这段时间陆续更新了Spring系列源码分析以及各种扩展点的文章,到了今天可以总算可以更新这篇文章了 首先列举一下一个经典的面试题:Spring中Bean的生命周期: 开始初始化容器 加载B ...
- ztree实现复选框单选功能
/** * ztree的默认配置项 * */ var setting = { view: { selectedMulti: false //按住ctrl是否可以多选 }, check: { enabl ...
- .htaccess文件配置理解
0x00前言.htaccess文件是用于apache服务器下的控制文件访问的配置文件,因此Nginx下是不会生效的 .htaccess可以控制错误重定向,初始页面设置,文件夹的访问权限,文件的跳转等 ...