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 ...
随机推荐
- C#获取屏幕鼠标坐标点颜色
[DllImport("user32.dll")] private static extern IntPtr GetDC(IntPtr hwnd); ...
- # Leetcode 67:Add Binary(二进制求和)
Leetcode 67:Add Binary(二进制求和) (python.java) Given two binary strings, return their sum (also a binar ...
- Docker安装和上传容器
安装Docker Requirements for Mac(硬件要求): Mac的硬件必须是2010或者更新的,需要支持memory management unit(MMU) virtualizait ...
- python爬取电影网站信息
一.爬取前提1)本地安装了mysql数据库 5.6版本2)安装了Python 2.7 二.爬取内容 电影名称.电影简介.电影图片.电影下载链接 三.爬取逻辑1)进入电影网列表页, 针对列表的html内 ...
- Elasticsearch Field Options Norms
Elasticsearch 定义字段时Norms选项的作用 本文介绍ElasticSearch中2种字段(text 和 keyword)的Norms参数作用. 创建ES索引时,一般指定2种配置信息:s ...
- golang ----array and slice
Go Slices: usage and internals Introduction Go's slice type provides a convenient and efficient mean ...
- com.fasterxml.jackson.core.JsonGenerationException: Can not write a field name, expecting a value异常
springboot对象返回,一直报生成json异常,经过检查,发现是自己在做xss防护时对出参进行了json的处理(copy代码不可取,囧) 异常信息 这里进行了出参处理了,但实际上只要对入参处理就 ...
- 聊聊Lambda架构
定义 在数据分析场景中,我们可能会遇到这样的问题.例如,我们要做一个推荐系统,如果我们用批处理任务去做,一天或者一小时的推荐频次明显延迟太大.如果用流处理任务,虽然延迟的问题解决了,然而只用实时数据而 ...
- iviewUI 前端静态页面实现增删改查分页
完整代码部分 (仅供参考哈): <template> <div> <label prop="name"> 姓名: </label> ...
- asp.net core MVC 入门学习
前言 .net core 已经更新到2.0以上的版本了,今天才开始正式接触,深为程序员,丢脸了,作为无所不能的IT人,我着手折腾一下这个跨平台的开发框架. (转载自百度百科).NET Core 是.N ...